函数的执行过程和闭包

1.函数的执行过程

函数的执行过程分为两个阶段

1.函数定义阶段

会开辟一个存储空间,把函数体内的代码原封不动的放在这个空间内(不解解析变量),把存储空间的地址给函数名

2.函数调用阶段

会生成一个执行空间(函数体内部有很多变量需要保存),按照函数的地址名找到函数的存储空间

进行形参赋值,与解析,将函数存储空间中的代码拿出执行(才解析变量),执行完毕后执行空间会销毁(js的垃圾回收机制)

3.如何让函数的执行空间不被销毁

一旦函数的内部返回了一个引用数据类型的时候,并且在函数外部有变量接受的情况下

这个函数的执行空间就不会被销毁了

代码示例:function fn() {

 const obj = {
      name: 'Jack',
      age: 18,
      gender: '男'
  }
  return obj
}
const o = fn()

2.闭包

闭包是函数使用的一种方式,目的是让外部可以访问函数内部的变量,闭包就是利用了这个函数的执行空间不被销毁的逻辑

1.闭包的概念

函数都有自己的作用域,并且外部无法访问函数内部的变量

函数在调用的时候会生成一个执行空间,存储函数内部声明的变量,执行空间在函数运行结束后会立即销毁

当函数内部返回了一个引用数据类的时候,并且在函数外部有变量接受的情况下,这个执行空间就不会被销毁了

2.闭包常见的实现方式

两层函数,外层函数返回内层函数,内层函数去操作外层函数声明的变量

3.闭包的使用场景

(1)封装私有变量:

function fn(){

var a = 10;

var obj = {

get:function(){

  return:a;

}

set:function(v){

  a=v;

}

return obj;

}

2.for循环中打印下标

<button>1</button>
 <button>2</button>
 <button>3</button>
<script>
var btns = document.queryElectorAll("button")

for(var i = 0;i<btns.length,i++){

(function(j){

btns[i].onclick = function(){

alert(i)

}

}(j));}

</script>

3.window的滚动防抖

当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定时间到来之前,又触发了事件,

就重新开始延时。也就是说当一个用户一直触发这个函数,且每次触发函数的间隔小于既定时间,那么防抖的情况下只会执行一次。

function fn(){    //处理函数
            console.log(11)
        }

window.onscroll = Debounce(fn,30)

function Ddbounce(fn,interval){

var timer = null;   //定义一个定时器

return function(){

if(!timer){    //当没有定时器的时候添加定时器

  timer = setTimeout(fn,interval);

}else{  //清除这个定时器

  clearTimeout(timer);

  timer = false;

} } }

4.闭包的缺点

内存泄漏   浪费内存(产生的值不会被垃圾回收)

 

posted @ 2020-07-01 09:44  Bruce--Li  阅读(523)  评论(0)    收藏  举报