Home >Web Front-end >JS Tutorial >js pointing problem

js pointing problem

小云云
小云云Original
2017-12-08 15:00:491528browse
  1. This points to:
    json and the prototype chain are the same.
    I have read many articles that say it is more complicated.
    This points to the calling object.
    Post the code directly.


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

The first time is x call, so console.log is x, and the second time is equivalent to window. n(), which is called window, so the window is displayed.
Maybe my understanding is shallow. I think this is the object in front of the '.' of the function that contains 'this'. As for apply and call, there will be some changes, I will briefly mention them below.
The difference between apply and call is that apply is (object, [parameter set]) and call is (object, parameter, parameter, parameter, parameter, parameter...). I don’t know the rest yet. Post a code first.

    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

To put it bluntly, it is like a programmer changing computers for development. Except for the logic of processing data in his own mind, other environment variables must be used by others. The method in front of apply is the programmer's thinking, and the method in () is the new computer. As for the following parameters... they are the parameters required by the method. You can pass this by yourself.

2. Arrow function pointing: The arrow function does not have a name, so it cannot be called by name, so this always points to Window.

3. Variable pointing: I think this is involved Problem with memory pointers. But it is easy to understand, that is, constants occupy memory, and variables are added up. It's like 2+ children playing a game. As long as you don't change places or play with other people, what's yours is mine, and what's mine is yours. This memory is like a children's play field, and the toys owned by the children are their attributes (these children are relatively generous).
Let’s give three examples:

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

Because Y has never found anyone else to play with (see example 3 for how to find others to play with), so y’s toys are x’s toys.

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

Because Y changed the place to play (opened a memory to point to), so x cannot get Y's toys.

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}

This may be a story of meeting passers-by...


1.This points to:
json and the prototype chain are the same of.
I have read many articles that say it is more complicated.
This points to the calling object.
Post the code directly.

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

The first time is x call, so console.log is x. The second time is equivalent to window.n(), which is window call, so window is displayed.
Maybe my understanding is shallow. I think this is the object in front of the '.' of the function that contains 'this'. As for apply and call, there will be some changes, I will briefly mention them below.
The difference between apply and call is that apply is (object, [parameter set]), call is (object, parameter, parameter, parameter, parameter, parameter...), and I don’t know the rest yet. Post a code first.

    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

To put it bluntly, it is like a programmer changing computers for development. Except for the logic of processing data in his own mind, other environment variables must be used by others. The method in front of apply is the programmer's thinking, and the method in () is the new computer. As for the following parameters... they are the parameters required by the method. You can pass this by yourself.

2. Arrow function pointing: The arrow function does not have a name, so it cannot be called by name, so this always points to Window.

3. Variable pointing: I think this is involved Problem with memory pointers. But it is easy to understand, that is, constants occupy memory, and variables are added up. It's like 2+ children playing a game. As long as you don't change places or play with other people, what's yours is mine, and what's mine is yours. This memory is like a children's play field, and the toys owned by the children are their attributes (these children are relatively generous).
Let’s give three examples:

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

Because Y has never found anyone else to play with (see example 3 for how to find others to play with), so y’s toys are x’s toys.

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

Because Y changed the place to play (opened a memory to point to), so x cannot get Y's toys.

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}

Related recommendations:

Comprehensive analysis of this in JavaScript

How to use this in js

A brief introduction to this rule in JavaScript

The above is the detailed content of js pointing problem. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn