• JavaScript


    侃侃JavaScript中的this

    this为何如此多变?

    this总是跟它的执行上下文有关,而在JavaScript总会有开辟新的执行上下文的东西,比如函数,所以,this才如此的变化。

    执行环境对JavaScript中的this有影响吗?

    JavaScript是一门解释型语言,需要有一个执行环境去执行它,通常的执行环境是浏览器,还有node脚本,还有`REPL`(“读取-求值-输出”循环(Read-Eval-Print Loop,简称REPL))。
    
    如果对REPL有兴趣的话,博客中的另一篇文章介绍了`REPL`

    this默认指代谁?

    在不同的执行环境中,会指代不同的对象

    浏览器中:

    > this              // Window {top: Window, window: Window,...

    > this === window //true

    > var a = 1; //在全局中,用var声明变量,会默认给window添加

    > this.a // 1

    > window.a // 1

    > b = 1; //不使用var声明变量,会默认给全局的this添加属性> this.b // 1

    > window.b // 1

    node脚本中

    console.log(this);              //{}
    console.log(this === global); //false

    console.log(this === window); //ReferenceError: window is not defined
    var a = 1; //在全局中,使用var声明变量,未给global添加属性
    console.log(this.a); //undefined

    console.log(global.a); //undefined

    console.log(window.a); //ReferenceError: window is not defined b = 1; //不使用var声明变量,会默认给全局的global添加属性。
    console.log(this.b); //undefined

    console.log(global.b); // 1
    在node脚本中,this默认指向一个空对象,并不是指向global,也不是指向window。

    REPL

    > this

    { DTRACE_NET_SERVER_CONNECTION: [Function], DTRACE_NET_STREAM_END: [Function], ... > global === this //true

    > var a = 1; //在全局中,使用var声明变量,会默认给全局的global添加属性

    > this.a // 1

    > global.a // 1

    > b = 1; //不使用var声明变量,会默认给全局的this添加属性

    > this.b // 1

    > global.b // 1

    实例扩展

    我们对于省略var的变量声明方式,我们总说它是不安全的,但是是合法的。

    为什么不安全?

    如上文所述:不使用var声明变量,会让变量默认的添加到了全局的this中,这有时候会莫名的给变量提升它的作用域,从而影响其他全局变量。

    举个栗子:

    var position = "outer";           //this.position = "outer"

    function test(){ position = "inner"; //this.position = "inner",在函数执行后,覆盖原先的值
    console.log(this.position); } test();

    我们在外部定义了一个名为position的全局变量,它会被默认添加到全局this的属性上。

    然后在我们的test函数中,又定义了一个同名的变量,但是注意,函数中的变量声明没有用var

    因为我们并没有对函数实例化,所以this.positionthis会默认指代全局。

    而当我们调用函数test时,函数会生成一个执行上下文,而内部position会将作用域从函数内部提升到全局,从而覆盖(污染)了外部全局定义的position变量。

    所以,在JavaScript的严格模式中,是不允许省略var来声明变量的。故在声明变量的时候,就顺手加上var吧。

    总结

    • this在不同的执行环境中的默认指代

    • 通过省略var声明变量导致“变量提升”现象的发生及预防

  • 相关阅读:
    设计模式学习(十二) 责任链模式
    设计模式学习(十一) 享元模式
    设计模式学习(十) 外观模式
    设计模式学习(九) 装饰模式
    设计模式学习(八) 组合模式
    设计模式学习(七) 桥接模式
    设计模式学习(六) 代理模式
    设计模式学习(五) 适配器模式
    设计模式学习(四) 原型模型
    设计模式(三) 建造者模式
  • 原文地址:https://www.cnblogs.com/-ding/p/6022685.html
Copyright © 2020-2023  润新知