Object
All things in JavaScript are objects: strings, numbers, arrays, functions ... In addition, JavaScript allows custom objects to be customized.
In a word, everything is an object in JavaScript.
Use {} to create an object var user = { ' name ': ' Jay Chou ', ' age ': 35
- Construction, prototype, __proto__
Constructor always points to the constructor that creates the current object. var arr = [];console.log (arr.constructor = = = = Array); Truevar Foo = function () {};console.log (foo.constructor = = = function); true//is instantiated by a constructor with a obj object var obj = new Foo (); Console.log (Obj.constructor = = = Foo); Trueconsole.log (Obj.constructor.constructor = = = Function); True
Each function has a default property of prototype, and this prototype constructor is the default point for this function. function person (name) { this.name = name;}; Person.prototype.getName = function () { return this.name;}; var p = new Person ("Jack"), console.log (p.constructor = = = person); Trueconsole.log (Person.prototype.constructor = = = person); Trueconsole.log (P.constructor.prototype.constructor = = = person); True
here the prototype and the prototype chain directly
This is the online comparison of the spread of
Here's the one you painted.
the creation of a class
Although JS is the object-based language of the door, there is no concept of class, although the reserved class
keyword, but before ES6 is unusable. Therefore, you can use constructors to simulate the creation of classes, which are pseudo-classes. The so-called "constructor", in fact, is a normal function, but the internal use of this
variables. Using an operator on a constructor new
enables you to generate an instance, and the this
variable is bound to the instance object. Each constructor has a prototype
property that points to another object. All properties and methods of this object are inherited by an instance of the constructor. This means that we can define the invariant properties and methods directly prototype
on the object.
function User () { this.name; } Define a User's working method User.prototype.work = function () {alert (this.name+ "in Work");}
var u1 = new User ("Jay Chou");
This keyword
This represents the current object, if this is used within the global scope, refers to the current Page Object window, and if this is used in the function, the this refers to what is called based on what object the function is running at. We can also use the Apply and call two global methods to change the specific point of this in the function.
Console.log (This = = = window); True to use this in global scope to point to the Window object
- Calls to normal functions
function f () { this.name = "Jaychou";//This points to the Window object at run time, in strict mode it is undefined}
var obj1 = { name: "Jaychou", print:function () { console.log (this.name); This points to the object obj1, but can change its point to }};
- As a constructor function
New F (); The This within the function points to the newly created object.
- Multi-layered nested intrinsic functions
var name = "Jay"; var person = { Name: "JJ", hello:function (a) { var SayHello = function (a) { Console.log (THIS.name + "says" + a); }; SayHello (a); }} Person.hello ("Hello World"),//jay says Hello World
A different way
var name = "Jay"; var person = { Name: "JJ", hello:function (a) { var. = this; var SayHello = function (a) { Console.log (that.name + "says" + a); }; SayHello (a); }} Person.hello ("Hello World"),//JJ says Hello World
var ele = document.getElementById ("id"), Ele.addeventlistener (' click ', Function () { console.log (this); This points to the DOM element});
Apply and call are similar, except that the arguments that follow are passed in through an array instead of being passed in separately. Both are used to bind a function to a specific object,
Naturally this will be explicitly set to the first parameter. Method definitions for both: Call (Thisarg [, ARG1,ARG2, ...]); Parameter list, arg1,arg2,...apply (Thisarg [, Argarray]); The parameter array, argarrayvar name = ' Global '; var o = { name: ' Job ', getname:function () { console.log (this.name); } };o.getname (); job//to change the point of this in the function with call or Apply O.getname.call (this); Global
Summary of this
When a function is called as a method of an object, this points to the object. when the function is called as a fade function, this pointer to the global object (when strict mode is undefined) in the constructor, the this point in the newly created object nested function does not inherit this from the upper function, if necessary, You can save this for the upper function with a variable.
JavaScript OOP classes and objects