前端面试之---javascript作用域和闭包

知识点

执行上下文

范围：一段<script>或者一个函数

全局：变量定义、函数声明   <script>

函数：变量定义、函数声明、this、arguments

console.log(a);//undefinedvar a = 100;fn('zhangsan');function fn(name) {    age = 20;    console.log(name,age);//'zhangsan' 20    var age;}

 

在上面这段<script>中。执行前，先把变量定义拿出来，变量a拿出来并赋值undefined；函数声明fn拿出来，把函数体赋值给fn。所以执行到第一行的时候a是undefined。

在函数内部。先把变量定义age拿出来，赋值成undefined；this复制成fn对象，arguments复制成【name】。但是函数内第一行紧接着赋值成20了，所以age是20，name是zhangsan

 

函数声明和函数表达式区别

Function fuc（）{} 函数声明

Var func = function（）{} 函数表达式

fn();//不会报错function fn() {    //函数声明}fn1();//会报错var fn1 = function () {    //函数表达式}

 

This

This要在执行时才能确认值，定义时无法确认

var A = {    name:'A',    fn:function () {        console.log(this.name);    }}a.fn();//this === aa.fn.call({name:'B'});//this === {name:'B'}var fn1 = a.fn;fn1();//this === window

 

作为构造函数执行

作为对象属性执行

作为普通函数执行

Call apply bind

作用域

Js没有块级作用域，只有函数作用域和全局作用域

所以在块里面声明的变量和在块外面声明的一样，所以尽量不要在块里面声明变量。

函数里面声明的变量在函数外面是访问不到的，是受保护的。

//js没有块级作用域if(true){    var name = "zhangsan";}console.log(name);//函数作用域和全局作用域var a =100;function fn() {    var a =200;    console.log('fn',a);}console.log('global',a);fn();

 

作用域链

var a =100;function fn() {    var b = 200;    //当前作用域没有定义的变量，叫自由变量    console.log(a); //函数作用域内并没有定义变量a，去它的父级作用域找，父级作用域指函数定义时的作用域，

    console.log(b);}fn();

 

var a =100;function F1() {    var b=200;    function F2() {        var c =300;        console.log(a);        console.log(b);        console.log(c);    }    F2();}F1();

 

闭包

function F1() {    var a =100;    //返回一个函数    return function () {        console.log(a);    }}//得到一个函数var f1 =F1();var a =200;f1();

 

 

使用场景：函数作为返回值

函数作为参数传递

//1.函数作为返回值//2.函数作为参数传递function F1() {    var a =100;    //返回一个函数    return function () {        console.log(a);    }}//得到一个函数var f1 =F1();function F2(fn) {    var a =200;    fn();}F2(f1); //100

 

 

说一下对变量提升的理解

说明this几种不同的使用场景

创建10个<a>标签，点击的时候弹出来对应的序号

var i;for(i=0;i<10;i++){    (function (i) {        var a = document.createElement('a');        a.innerHTML = i+'<br>';        a.addEventListener('click',function (e) {            e.preventDefault();            alert(i);        })        document.body.appendChild(a);    })(i)}

 

如何理解作用域

自由变量

作用域链，即自由变量的查找

闭包的两个场景

实际开发闭包的应用

stringObject.indexOf(searchvalue,fromindex)

//闭包实际使用中主要用于封装变量，收敛权限function isFirstLoad() {    var _list = [];    return function (id) {        if(_list.indexOf(id)>=0){            return false;        } else {            _list.push(id);            return true;        }    }}var firstLoad = isFirstLoad();firstLoad(10);//truefirstLoad(10);//falsefirstLoad(20);//true