<Js知识点梳理>---作用域&闭包篇

最新推荐文章于 2025-09-10 19:44:49 发布

转载最新推荐文章于 2025-09-10 19:44:49 发布 · 57 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://juejin.im/post/5c0cc7a2e51d451a00653858

文章标签：

#javascript #ViewUI

本文深入解析JavaScript中的闭包概念，通过实例演示闭包如何访问外部函数的变量，并探讨了作用域与this关键字的关系。同时，文章提供了实用的编程技巧，如使用bind、call和apply来改变函数的执行环境。

作用域&闭包篇

什么是闭包

“闭包是指有权访问另一个函数作用域中的变量的函数”--《JavaScript高级程序设计》

具体一点

function foo(){
    var a = "test";
    function bar(){
        return a;
    }
    return bar();
}
//现在回头再看看闭包的定义:)
var b = foo();
bar();  //a
复制代码

小练习

/*
* 题目:
* 完善工厂函数 createPerson，需要完成以下要求：
* 1.保存传入参数 name 到一个私有变量中
* 2.函数返回一个对象，且对象带有一个方法 getName，用于返回对象的私有变量 name 的值
*/

function createPerson(name) {
    var n = name;
    var result = {
        getName : function(){
            return n;
        }
    }
    return result;
}

var person = createPerson('web');
console.log(person.name); //你什么都得不到的，相信我
console.log(person.getName());
复制代码

再进一步，看一下Js中的作用域

this是什么

this其实指的就是函数的执行环境，看下面一段代码

window.name = "web";
var o = {
  name :  "test"
};
function sayName(){
    console.log(this.name);
}

sayName();  //web，执行环境windows
o.sayName = sayName;
o.sayName(); //test，执行环境o
复制代码

一些特性

1.this并不是声明函数时就已经确定的，调用时才会确定this的取值
2.全局环境下执行函数this一般指向window，对象的方法一般指向对象
复制代码

练习

函数的方法--改变this指向

bind

window.name = "web";
var o = {
  name :  "test"
};
function sayName(){
    console.log(this.name);
}

o.sayName = sayName.bind(window);
o.sayName(); //web，执行环境window
复制代码

call和apply

window.name = "web";
var o = {
  name :  "test"
};
function sayName(){
    console.log(this.name);
}

sayName.call(o);  //test，执行环境o
sayName.apply(o);   //test，执行环境o
复制代码

call与apply的区别

sayName.call(o,1,2,3);  //正常传参
sayName.apply(o,[1,2,3]);   //只接受两个参数，第一个参数执行环境，第二个是参数的数组
复制代码