1.闭包
函数+词法作用域(/执行上下文/变量对象【存储一堆变量,arguments,函数)
理解:
1.对自由变量的访问
2.存储数据
通过自由变量存储数据(浅拷贝)
通过参数存储数据(浅拷贝
var a=10;
(function(kuaizhao){
//此时参数kuaizhoa与a之间已经是两个独立的栈空间
setTimeout(()=>{console.log('输出快照,',kuaizhao);},2000);
})(a);
a=100;
//参考MDN闭包的解释
//另外:
闭包是指那些能够访问自由变量的函数--MDN
自由变量的意思是,当前作用域中用到,但是未在当前作用域中声明的变量。
闭包访问的自由变量,有可能是父/祖(祖的N次方等)作用域中的变量【祖/祖的N次方,太远了,一般是访问的父作用域
没有闭包就不能通过闭包的作用域链访问到
//图
https://github.com/ZengLingYong/Blog/issues/16
2.执行上下文
执行上下文涉及栈操作,入栈出栈,一大坨变量
执行函数的过程:
1.创建执行上下文环境
声明变量(也会隐式声明argument)【没赋值
声明方法function【方法体都写好了
【1.就是创建变量对象的意思拉
注意:这一步声明变量,给函数赋值时候不看顺序。
undefined不会覆盖function的赋值
ru:
console.log(a);//输出function a(){return 10;}
function a(){return 10;}
var a=10;
2.执行
对变量(函数表达式,变量)的赋值
涉及变量提升,function优先级赛高原理{
console.log(a) //输出function a(){return 10}
var a=10;
function a(){return 10}
var a=function(){xxx}
}
&&闭包(函数的执行需要执行上下文。执行完毕后才推出栈销毁上下文)
3.堆栈
栈
存放基本类型值+对象的指针。声明一个变量,开辟一个空间
var a=10;
var b=a;//a,b的值都是10,存于不同的两个栈内控件
堆
存放对象,无序,空间可扩展。堆中对象由栈中指针找到
深浅拷贝,堆/栈拷贝。
4.
作用域
一个函数里面的东西。包括变量,arguments,函数
作用域链
某个作用域的父作用域(ect.一直往上)
通过闭包访问父作用域(ect.)中的变量对象
5.柯里化
延迟执行,部分传参,返回一个可处理剩余参数的函数
function a(a,b,c){return a+b+c}
function createCurry(fn,...args){
var need=fn.length;
return (...param)=>{
var argGotten=[...args,...param];
if(argGotten.length<need){
return createCurry(fn,...argGotten);
}
return fn(...argGotten);
}
}
var curry=createCurry(a);
var num=curry(1)(1)(1);
可以理解成一个工厂函数。传入的参数可以对createCurry进行初始化
前后的传参根据初始化造作
6.原型链
this指向
1.箭头函数对this的绑定
2.运行时this确定
3.手写new Instance();
4.Function.apply()的实现
this的指向不是写代码的时候确定的,是看运行时的具体指向。
【谁调用指向谁】,并不完全
function.prototype是给实例继承的。函数才有prototype
{}.__proto__指向原型链,instance.__proto__===instance.constructor.prototype
7.防抖&&节流
9.执行顺序
https://cloud.tencent.com/developer/article/1547827
微任务,宏任务
宏任务->微任务->渲染
宏任务 including setTimeout,setInterval,被推入执行栈的同步任务
微任务 执行promise的then
js首先执行宏任务。执行完宏任务后(js空闲),开始执行微任务。清空了微任务队列后,执行渲染。渲染完后再执行宏任务(又是下一个轮回)
使用到promise的时候,resolve() 与then的执行完成后,会注册下一个then的微任务【把这个then的执行内容加入到微任务队列中(先进先出)
8.promise
https://mp.weixin.qq.com/s/op3EaSXKTCXwYt_uRvhePg
https://www.jianshu.com/p/62c7d633a879
Promise的resolve()与then的完成会注册下一个then的微任务(if exit)
注册微任务也是一个同步的过程
反正一个then内同步的内容执行完后,这个then就算完了。有return的先执行好return
执行微任务
10.回流/重绘
https://www.pianshen.com/article/6377147915/
回流:更新渲染树,更新更新元素的布局信息:尺寸px,位置,
重绘:渲染树的内容显示到屏幕
回流引起重绘
重绘不一定引起回流
重绘有可能是改变颜色【不影响布局就不回流
js执行队列,执行顺序,垃圾清理