学习总结 javascript 闭包
1,关于闭包的简单实现
//example 1
function sayHello(name) {
var words = "hello," + name;
var sayForAlert = function () {
alert(words);
}
sayForAlert();
}
//sayHello("jack");
/*
An Example of a Closure
Two one sentence summaries:
a closure is the local variables for a function — kept alive after the function has returned, or
a closure is a stack-frame which is not deallocated when the function returns (as if a 'stack-frame' were malloc'ed instead of being on the stack!).
*/
function sayHello2(name){
var words = "hello, "+name; //local variables;
var sayForAlert = function (){
alert(words);
}
return sayForAlert;
}
var say2 = sayHello2("lucy");
say2();
/*
一个函数的引用。作为一个參数返回回来。
在这里相当于返回一个函数的
指针。
sayForAlert 和 say2指向的是同一函数。
javascrip与c的一个重要差别在于c指针指向一个函数,而javascript是一个引用指向一个函数。
(相当于是隐藏性指针)。
在很多的语言中和c一样。当函数运行完毕后,本地的变量就不能再訪问。
由于其函数的堆栈被销毁。
在javascript中函数的里面能够在声明函数。而且本地的变量能够訪问,并
可心在声明的函数中返回。
*/
function saynumadd(){
var num = 666;
var showAlert = function(){
alert(num);
//num++;//place 2;
}
num++;//place 1;
return showAlert;
}
var sayNumber = saynumadd();
sayNumber();//alert 667;
/*
note: 依据上面的运行结果来看num做为一个变量被保存起来在后面
函数的调用能够再获取到。
假设我们把num++;放到place2的位置
看到的结果就是666.说明函数的运行顺序运行 saynumadd() 运行过程
中 1。声明变量num,2,声明函数 showAlert,3,把变量num自添加1。
当我们运行 sayNumber()的时候看到的就是667 添加后被保存的结果。
*/
function setupSomeGlobals(){
var num = 666;
//store some references to function as global variables
getAlertNumber = function (){
alert(num);
}
getIncreaseNumber = function(){
num ++;
}
getSetNumber = function(x){
num = x;
}
}
setupSomeGlobals();
getIncreaseNumber();
getAlertNumber();
getSetNumber(10);
getAlertNumber();//10
setupSomeGlobals();
getAlertNumber();//666
/*
onte:
从上面的样例能够看出,
setupSomeGlobals 里面的三个函数被声明都有权限去訪问里面的变量。
假设我们又一次调用 setupSomeGlobals() 新的函数堆栈会被创建. 之前创建的getAlertNumber, getIncreaseNumber, getSetNumber 会被重写并有一个新的闭包. (在 JavaScript中, 不管不论什么候都能够在function的内部声明另外一个function,外面的function被调用的时候。里面的function都会被又一次创建.)
*/
function buildList( list ){
var result = [];
for (var i = 0 ; i<list.length; i ++){
var item = 'item' + list[i];
result.push(function(){alert(item +' '+list[i])});
}
return result;
}
function testList(){
var fnList = buildList([1,2,3,4]);
for(var j=0; j < fnList.length; j ++){
fnList[j]();
}
}
testList();//alert item1 undefined;
/*
执行结果。能够说明function里面的function仅仅能够保存本地变量,不能保存參数变量。所以我们在使用封包函数要注意当中变量的作用域。
*/
function callLocalVar(){
var sayAlertName = function(){alert(name)};
var name = "jacy";
return sayAlertName;
}
callLocalVar()();//这样的写首先会运行callLocalVar再运行返回的sayAlertName;
/*
note:
总结闭包函数能够訪问到同一个域时定义的变量,不管是在这个闭包函数的前面还是后面。 仅仅要是同一个域就能够被訪问到。
*/
function checkClosure(someNum, someRef){
var num = someNum;
var arr = [1,2,3];
var ref = someRef;
return function(x){
num += x;
arr.push(num);
alert('num :'+num + ' \n arr :'+arr.toString()
+'\n ref.someVar'+ref.someVar);
}
}
var obj = {someVar:4};
var fn1 = checkClosure(4,obj);
var fn2 = checkClosure(5,obj);
fn1(1);// num: 5; arr: 1,2,3,5; ref.someVar: 4;
fn2(1);// num: 6; arr: 1,2,3,6; ref.someVar: 4;
obj.someVar ++;
fn1(2);// num: 7; arr: 1,2,3,5,7; ref.someVar: 5;
fn2(2);//num: 8; arr: 1,2,3,6,8; ref.someVar: 5;
/*
note:
这里的写法攻克了參数变量不能被保存的问题,仅仅要创建一个本地作用域一个变量来接收这个參数变量的值就能够了。
能够说明不同的作用域,互相不影响。
*/
相关文章
- javascript - 一种对象赋值方式
- jQuery 追加元素、拼接元素的方法总结(append、html、insertBefore、before等) 初识document.onkeydown及其兼容性问题 js学习笔记27----键盘事件 JavaScript onkeydown事件入门实例(键盘某个按键被按下)
- 【学习笔记27】JavaScript字符串方法的练习
- 【学习笔记30】JavaScript中数组的5种去重方法
- 【学习笔记33】JavaScript延时器定时器和异步程序
- 【学习笔记35】JavaScript计算两个指定日期的时间差
- 简单粗暴的JavaScript笔记-1
- 前端学习之路-CSS介绍,Html介绍,JavaScript介绍
- 《JavaScript专家编程》——9.4 度量JavaScript代码质量
- 《移动网页设计与开发 HTML5+CSS3+JavaScript》—— 1.1 对术语的简短说明
- 《JavaScript设计与开发新思维》——导读
- JavaScript权威指南学习笔记
- JavaScript权威指南学习笔记5
- ABP理论学习之Javascript API(理论完结篇)
- 使用 JavaScript 在浏览器中构建机器学习模型,学习使用 TensorFlow.js 和 JavaScript 在浏览器中构建机器学习模型
- Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例
- JavaScript 究竟是怎样执行的?
- 深入理解JavaScript作用域和作用域链
- 华为OD机试 - 找出重复代码(JavaScript) | 机试题+算法思路+考点+代码解析 【2023】
- 轻松学习JavaScript十二:JavaScript基于面向对象之创建对象(一)
- 深入理解JavaScript系列(44):设计模式之桥接模式
- javascript 的学习笔记(第一天)