A. this B. this C. this D. this
Rule # 1: This always refers to the object on which the function was run, not the object on which the function was created.
2. The centralized direction of this:
- Window objects such as:
console.log(this);
- This in a function refers to whoever called the function, usually to the window. For example:
function foo() { console.log(this); } foo();
- Object this refers to an object such as:
var obj = { name: "jack", run: function() { console.log(this.name+"run"); } } obj.run();
4. This in the constructor refers to the instantiated objectfunction Person(name) { this.name = name; // This points to the currently instantiated object. } '
3, Borrowed this
There are ways to manually change the reference to this.Copy the code
Fn. call(object, parameter 1, parameter 2…) [Change the context of the function to another object] [Parameter separated by a comma, e.g. “Joe “,” one day”] note: this function is executed immediately; Execute once. Such as:
var p1 = {
name: "Little sister".phone: function(name) {
console.log(this.name + "give" + name +"Make a call")
}
}
p1.phone("Joe");
var p2 = {
name: "Cao cao"
}
p1.phone.call(p2, "The beginning"); Call (object, argument 1, argument 2...)
Copy the code
2, fn,apply(object, [parameter 1, parameter 2… Call is the same as call, but it is passed in a different way.
p1.phone.apply(p2, ["The beginning"."Two days"]); // function apply(object, [parameter 1, parameter 2... )
Copy the code
p1.phone("Joe"."One year");// All the methods above are temporary, and this method is still p1
Copy the code
3, fn.bind(object) is used to passively modify the reference to this.
Summary: The difference between call, apply and bind
Similarity: Both are used to change the direction of this in functions.
Difference:
- Call and apply are executed immediately (actively) for general functions
- Bind is executed passively and is usually used for callback functions
- Call instantiates arguments directly after the object
- Apply passes parameters as arrays
An example of this code is as follows
<script>
/* this always refers to the object on which the function was run, not the object on which the function was created. 2, this refers to the 2.1 window object */
console.log(this);
/* this refers to the person who called the function, usually referring to the window. * /
function foo() {
console.log(this);
}
foo(); // === window.foo() , window
/* this refers to the object */
var obj = {
name: "jack".run: function() {
console.log(this.name + "Run fast."); }}; obj.run();/ / type
window.name = "window";
// var obj = {
// name: "jack",
// run: function() {
// console.log(this.name);
// window.setTimeout(function() {
// console.log(this.name + "Run fast." );
/ /}, 1000);
/ /}
// };
// obj.run();
/* this in the 2.4 constructor refers to the instantiated object. * /
function Person(name) {
this.name = name;
}
var p1 = new Person("jack");
/* this (difficult) there are some methods to manually modify the reference to this. >> fn.call(object, parameter 1, parameter 2...) : Switch the context of a function to another object Note: This function executes immediately; Execute once; Temporary. * /
var p1 = {
name: "Zhou yu".phone: function(name, time) {
console.log(this.name + "To" + name + "Hit" + time + "The phone");
}
}
p1.phone("Joe");
var p2 = {
name: "Cao cao"
}
// p1.phone.call(p2, "杨修");
p1.phone.call(p2, "Joe"."One day");
/* >> fn.apply(object, [parameter 1, parameter 2... Call is the same as call, but the method of passing the parameter is different. * /
p1.phone.apply(p2, ["Big Joe"."A week"]);
p1.phone("Joe"."One year"); // All the methods above are temporary, and this method is still p1
/* >> fn.bind(object) : passively modify the reference to this, usually used to modify the reference to this of the callback function. >> Call, apply, and bind are used to change the direction of this in a function. Differences: * Call and apply execute immediately (actively) for general functions; * Bind is passively executed and is usually used for callback functions; * call lists parameters directly after the object; * Apply passes parameters as arrays. * /
var obj = {
name: "jack".run: function() {
setTimeout(function() {
console.log(this.name + "Run fast.");
// }.bind(obj), 1000);
}.bind(this), 1000); }}; obj.run(); </script>Copy the code