• 技术文章 >web前端 >js教程

    js指向问题

    小云云小云云2017-12-08 15:00:49原创826
    1. this的指向:
      json和原型链是一样的。
      看了很多文章都说的比较复杂。
      this指向调用对象。
      直接贴代码吧。


    var x = {
             test:function(){
                              console.log(this);
                            };
                  };
    x.test()//x{...};
    var n = x.test();
    n();//Window

    第一次是x调用,所以console.log的是x,第二次相当于是window.n(),也就是window调用,所以显示的是window。
    可能我理解得比较浅,我觉得this就是包含‘this’得那个函数的'.'前面的对象。至于apply和call会有些变化,我下面粗略说下。
    apply和call的区别就在于,apply是(对象,[参数集合]),call是(对象,参数,参数,参数,参数,参数...),其他的我暂时还不清楚。先贴个代码。

        function ed(){
        this.age = ed;
        }; 
        function ing(){
        this.age = 2;
        this.sex = 0;
        this.showAge = function(){
            console.log(this.age);
            console.log(this.sex);
            }
        };
        var edObj = new ed();
        var ingObj = new ing();
        ingObj.showAge.apply(edObj);//2,Undefined

    这说白了,就好比一个程序员换了台电脑进行开发,除了处理数据的逻辑在自己的脑子里,其他的环境变量都得用人家的。apply前面的方法是这个程序员的思维,()里面的方法就是新电脑。至于后面的参数...就是方法所需要的参数,这个可以自己随便传。

    2.箭头函数指向: 箭头函数名字都没有一个,根本没法被喊着名字去调用,所以this永久指向Window.

    3.变量指向:这个我觉得涉及到内存指针的问题。但是很好理解,就是常量占内存,变量往上凑。好比2+个小孩玩游戏一样,只要你别换地也别去和其他人玩,你的就是我的,我的也是你的。这个内存就好比小孩游戏的场地,小孩拥有的玩具就是他们的属性(这些小孩都比较大方)。
    先举个三个例子:

    var xArr = [];
    var xJson = {};
    (()=>{
          let yArr = xArr,
             yJson = xJson;
           yArr.push(1);
           yJson.age = 1;
          })();//这里说明即便是块级变量也是可以一起参与玩耍的,屋里玩耍的孩子玩具一样可以被其他小孩在屋外展示。
    console.log(xArr);//[1]; 
    console.log(xJson);//{age: 1}

    因为Y一直没有去找其他人玩(怎么找别人玩看例子3),所以y的玩具就是x的玩具。

    var x = 0,
        a = 2.
        b = 3,
        y = x;
        console.log(y);//0
        y = a+b;
        console.log(x);//0
        console.log(y);//5

    因为Y换了个地方玩(自己开了一个内存去指向),所以x拿不到Y的玩具。

    var x = {},
        a = {},
        y = x,
        z = y,
        y = a;
        y.age = 1;
        console.log(x);//{}
        console.log(y);//{age:1}
        console.log(z);//{}
        console.log(a);//{age:1}
        z.age = 2;
        console.log(x);//{age:2}

    这可能就是一个从此相逢是路人的故事...


    1.this的指向:
    json和原型链是一样的。
    看了很多文章都说的比较复杂。
    this指向调用对象。
    直接贴代码吧。

    var x = {
             test:function(){
                              console.log(this);
                            };
                  };
    x.test()//x{...};
    var n = x.test();
    n();//Window

    第一次是x调用,所以console.log的是x,第二次相当于是window.n(),也就是window调用,所以显示的是window。
    可能我理解得比较浅,我觉得this就是包含‘this’得那个函数的'.'前面的对象。至于apply和call会有些变化,我下面粗略说下。
    apply和call的区别就在于,apply是(对象,[参数集合]),call是(对象,参数,参数,参数,参数,参数...),其他的我暂时还不清楚。先贴个代码。

        function ed(){
        this.age = ed;
        }; 
        function ing(){
        this.age = 2;
        this.sex = 0;
        this.showAge = function(){
            console.log(this.age);
            console.log(this.sex);
            }
        };
        var edObj = new ed();
        var ingObj = new ing();
        ingObj.showAge.apply(edObj);//2,Undefined

    这说白了,就好比一个程序员换了台电脑进行开发,除了处理数据的逻辑在自己的脑子里,其他的环境变量都得用人家的。apply前面的方法是这个程序员的思维,()里面的方法就是新电脑。至于后面的参数...就是方法所需要的参数,这个可以自己随便传。

    2.箭头函数指向: 箭头函数名字都没有一个,根本没法被喊着名字去调用,所以this永久指向Window.

    3.变量指向:这个我觉得涉及到内存指针的问题。但是很好理解,就是常量占内存,变量往上凑。好比2+个小孩玩游戏一样,只要你别换地也别去和其他人玩,你的就是我的,我的也是你的。这个内存就好比小孩游戏的场地,小孩拥有的玩具就是他们的属性(这些小孩都比较大方)。
    先举个三个例子:

    var xArr = [];
    var xJson = {};
    (()=>{
          let yArr = xArr,
             yJson = xJson;
           yArr.push(1);
           yJson.age = 1;
          })();//这里说明即便是块级变量也是可以一起参与玩耍的,屋里玩耍的孩子玩具一样可以被其他小孩在屋外展示。
    console.log(xArr);//[1]; 
    console.log(xJson);//{age: 1}

    因为Y一直没有去找其他人玩(怎么找别人玩看例子3),所以y的玩具就是x的玩具。

    var x = 0,
        a = 2.
        b = 3,
        y = x;
        console.log(y);//0
        y = a+b;
        console.log(x);//0
        console.log(y);//5

    因为Y换了个地方玩(自己开了一个内存去指向),所以x拿不到Y的玩具。

    var x = {},
        a = {},
        y = x,
        z = y,
        y = a;
        y.age = 1;
        console.log(x);//{}
        console.log(y);//{age:1}
        console.log(z);//{}
        console.log(a);//{age:1}
        z.age = 2;
        console.log(x);//{age:2}

    相关推荐:

    JavaScript 中的 this 全面解析

    js中的this如何使用

    JavaScript中this规则的简单介绍

    以上就是js指向问题 的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:javascript 问题 指向
    上一篇:调整JavaScript抽象的迭代方案 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • 聊聊Node中怎么用async函数• 浅析Angular中怎么结合使用FormArray和模态框• react 怎么实现按需加载• react怎么实现滚动条• 一文聊聊node文件的读写操作
    1/1

    PHP中文网