简介:很多概念不清或忘记,重新构建自己的知识体系。每天问自己1~多个问题。我是菜鸟 成为大神之路!
1. 经典面试题 for(var i=0;i<=3;i++){ setTimeout(function() { console.log(i) }, 10);}
打印结果?分析?
for(var i = 0; i < 10; i++) {
console.log(new Date(),i);
setTimeout(() => {
console.log(new Date(),i)
}, 1000);//一秒
}
答案:打印10个10
这道题涉及了异步、作用域、闭包
?settimeout是异步执行,1ms后往任务队列里面添加一个任务,只有主线上的全部执行完,才会执行任务队列里的任务,
当主线执行完成后,i是10,所以此时再去执行任务队列里的任务时,i全部是10了。
?对于打印10次是:每一次for循环的时候,settimeout都执行一次,但是里面的函数没有被执行,而是被放到了任务队列里面,
等待执行,for循环了10次,就放了10次,当主线程执行完成后,才进入任务队列里面执行。
(注意:for循环从开始到结束的过程,需要维持几微秒或几毫秒。)
复制代码
① 若要输出从0到9,将 var 改为 let
for(let i = 0; i < 10; i++) {
console.log(new Date(),i);
setTimeout(() => {
console.log(new Date(),i)
}, 1000);//一秒
}
当我把var 变成let 时
?打印出的是:0~10当解决变量作用域,因为for循环头部的let不仅将i绑定到for循环快中,
事实上它将其重新绑定到循环体的每一次迭代中,确保上一次迭代结束的值重新被赋值。
?setTimeout里面的function()属于一个新的域,通过 var 定义的变量是无法传入到这个函数执行域中的,
通过使用 let 来声明【块变量】,这时候变量就能作用于这个块,所以 function就能使用 i 这个变量了;
?这个匿名函数的参数作用域 和 for参数的作用域不一样,是利用了这一点来完成的。
这个匿名函数的作用域有点类似类的属性,是可以被内层方法使用的。
复制代码
② 若要输出从0到9,改写为闭包
闭包相关解释下一问。
// 使用闭包
for(var i = 0; i < 10; i++) {
console.log(new Date(),i);
(function (i) {
setTimeout(() => {
console.log(new Date(),i);
}, 1000);
})(i);
}
复制代码
2.闭包的作用域?代码执行过程?
经常遇到闭包的相关问题
代码一:
// 以1问中例子为例
for(var i = 0; i < 10; i++) {
console.log(new Date(),i);
(function (i) {
setTimeout(() => {
console.log(new Date(),i);
}, 1000);
})(i);
}
代码一是闭包,写为代码二不为闭包的形式,(function(i){})(i) '理解为自执行函数' 自执行函数的相关参考在12天和参考文章中,之后我会对着一块内容进行学习?。
代码二:
var fun = function(x){
setTimeout(() => {
console.log(new Date(),x);
}, 1000);
}
for(var i = 0; i < 10; i++) {
console.log(new Date(),i);
fun(i);
}
复制代码
JavaScript 变量可以是局部变量或全局变量。
私有变量可以用到闭包。
什么是闭包:
> 就是函数的局部变量集合,只是这些局部变量在函数返回后会继续存在。
> 就是函数的“堆栈”在函数返回后并不释放,我们也可以理解为这些函数堆栈并不在栈上分配而是在堆上分配
> 当在一个函数内定义另外一个函数就会产生闭包
> "注:变量声明时如果不使用 var 关键字,那么它就是一个全局变量,即便它在函数内定义。"
注意:通常人们对闭包的理解是不完全的,认为在 JavaScript 中只有嵌入的函数才是闭包。但其实任何拥有 free variable(自由变量)
的函数都是以闭包的形式存在的。因为本质上,闭包是 free variable 问题的一种解决方案。http://liximomo.github.io/javascript-closure
闭包的注意点
1)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。
解决方法是,在退出函数之前,将不使用的局部变量全部删除。
2)闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),
把内部变量当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。
复制代码
闭包需要注意的两种情况----函数作为返回值,函数作为参数传递。
例子:函数作为返回值
1. function greeting(name) {
2. var text = 'Hello '; // local variable
// 每次调用时,产生闭包,并返回内部函数对象给调用者
3. return function() {return text += name; }
}
4. var sayHello=greeting("Closure");
5. document.write(sayHello());
6. document.write("<br>");
7. document.write(sayHello());
8. document.write("<br>");
9. document.write(sayHello());
10. document.write("<br>");
11. document.write(sayHello());
12. document.write("<br>");
13. document.write(sayHello());// 通过闭包访问到了局部变量text
代码解析:
> 执行第4行时第一行的函数运行一次,返回内嵌函数引用作为第4行sayHello变量的值。
> 之后的第5到13行执行的函数操作其实只是执行sayHello指向的函数(即返回的内嵌函数)。
> 解释text为什么能自增,闭包的概念。
复制代码
例子:函数作为参数传递
1. var num = 10;
2. var fun = function(var num){
3. console.log(num);
}
4. !function(f){
5. var num = 100;
6. f(num);
7. }(fun)
代码解析:
> 第四行'!'表示高优先级,被'!'标注的先执行。
> 第7行将fun指向的引用2行函数传给参数f在函数中执行f(?)函数,此时log出来的值是10。
> 解释看js作用域
复制代码
3.var let const
的区别?
① 什么是var的变量提升补充2019年1月5日23:31:41
来源网易课堂
'代码1'
var a = 10;
function foo(){
console.log(a);//打印:10
}
'代码2'
var a = 10;
function foo(){
console.log(a);//打印:undefined
var a = 5;
}
'问代码2为什么输出的是undefined这里变量提前了,实际代码相当于如下'
'代码3'
var a = 10;
function foo(){
var a;
console.log(a);//打印:undefined
a = 5;
}
复制代码
② let 声明的变量只在它所在的代码块有效
function demo(){
{
var a = 12;
let c = 10;
console.log(a);//这里会打印出12;
console.log(c);//这里会打印出10;
}
console.log(a);//这里会打印出12
console.log(c);//这里打印出的内容为 "c is not defined";
//说明声明的c变量只在{}代码块中能够访问,其他地方都访问不到;
}
demo();
复制代码
③ let不存在变量提升
let 不像var 那样会发生 '变量提升' 现象,因此,变量需要先声明然后再使用,否则报错;
// var 的情况
console.log(vardata); // undefined
var vardata = 2;
// let的情况;
console.log(letdata); // letdata is not defined 报错
let letdata = 2;
复制代码
④ let暂时性死区
快级作用域内存在let命令,它所声明的变量就绑定在这个区域,不再受外部影响;
var tmp = 123;
if (true) {
tmp = 'abc';
let tmp;
console.log(tmp); // tmp is not defined
}
复制代码
⑤ let不允许重复声明
let 不允许在相同作用域内,重复声明同一个变量。
function foo() {
let v = 10;
var v = 1;//Identifier 'v' has already been declared
console.log(v);
}
foo();
function foo1() {
let v1 = 10;
let v1 = 1;//Identifier 'v1' has already been declared
console.log(v1);
}
foo1();
复制代码
⑥ const 声明一个只读的常量,一旦声明,常量的值就不允许改变
⑦ const 一旦声明了变量,就必须初始化,不能留到以后赋值。如果使用const声明一个变量,但是不赋值,也会报错
⑧ const 的作用域与let命令相同;只在声明所在的块级作用域内有效。
⑨ const 不可重复声明 (和let一样)
参考文章:
① let的含义及let与var的区别
② 闭包文档
③ 博客-深入理解javascript原型和闭包
④ JS关于闭包
⑤ 函数 + 函数创建时的环境 = 闭包