关于JavaScript中this的相干知识点

关于this

this 供应了一种文雅的体式格局来隐式“通报”一个对象援用,因而能够将API设想得越发简约而且易于复用。

    /*
     *this 隐式通报上下文对象
     */
    function identify() {
        return this.name.toUpperCase();
    }
    
    function speak() {
        var greeting = "Hello, I am " + identify.call(this);
        console.log(greeting);
    }
    var me = {
        name: "kelly"
    }
    var you = {
        name: "lucy"
    }
    identify.call(me); //KELLY
    identify.call(you); //LUCY
    speak.call(me); //Hello, I am KELLY
    speak.call(you); //Hello, I am LUCY
跟着运用形式愈来愈庞杂,显式通报上下文对象会让代码变得愈来愈乱,运用this则不会如许。

关于this的误会

新手会误认为this指向函数本身。

    /*
     *关于this的误会
     */
    function foo(num) {
        console.log("foo: " + num);
        this.count++;
    }
    foo.count = 0;
    var i;
    for (i = 0; i < 10; i++) {
        if (i > 5) {
            foo(i);
        }
    }
    console.log(foo.count); //0
因而可知,浏览器剖析语句产生了4条输出,证实foo(...)确切被挪用了4次,然则foo.count仍然是0,明显从字面意思来邃晓this是毛病的。
这时候,能够运用Function.call()的要领强迫使this指向foo函数对象。

    /*
     *运用function.call()要领使this指向foo函数对象。
     */
    function foo(num) {
        console.log("foo: " + num);
        this.count++;
    }
    foo.count = 0;
    for (i = 0; i < 10; i++) {
        if (i > 5) {
            foo.call(foo, i)
        }
    }
    console.log(foo.count);

this 究竟是什么

this是在运行时举行绑定的,并非在编写时绑定,它的上下文取决于函数挪用时的种种前提。this的绑定和函数声明的位置没有任何关系,只取决于函数的挪用体式格局。
当一个函数被挪用时,会建立一个运动纪录。这个纪录会包括函数在那里被挪用、函数的挪用体式格局、传入的参数等信息。this就是这个纪录的一个属性,会在函数实行的过程当中用到。

小结

进修this的第一步是邃晓this既不指向函数本身也不指向函数的词法作用域,抛开之前毛病的假定和邃晓。
this实际上是在函数被挪用时发作的绑定,它指向什么完整取决于函数在那里被挪用。
    原文作者:coolpi21
    原文地址: https://segmentfault.com/a/1190000005712316
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞