History of inheritance 1. Traditional form —-> The prototype chain () inherits too many useless attributes

2. Borrowed constructors (call/apply) do not inherit from borrowed constructors; each constructor passes one more function

3. Shared Prototypes You can’t change your own prototypes

4. Holy Grail mode

3. Share prototypes

Case 1

Father.prototype.lastName="Deng";
function Father(){

}
function Son() {

}
Son.prototype=Father.prototype
var son = new Son();
var father = new Father();
//son.lastName=father.lastName
Copy the code

Case 2

Father.prototype.lastName = "Deng";
function Father() {

}
function Son() {

}

function inherit(Target,Origin) {
    Target.prototype = Origin.prototype;
}
inherit(Son,Father);
Son.prototype.sex="male";
var son = new Son();
var father = new Father();
inherit(Son,Father);
Copy the code

// Son. LatName =undefined wants to add something unique to son, but affects father, so use holy Grail mode

4. Holy Grail mode

The extend/inherit inheritance

Example 3

/ / method

function inherit(Target,Origin) { function F() {}; F.prototype = Origin.prototype; // Target.prototype = new F(); // Target.prototype.constructor = Target; Prototype. uber = origine. prototype// The object's superclass, To see who had inherited from his father. Real prototype} father. The prototype. The lastName = "Deng"; function Father() { } function Son() { } inherit(Son,Father); var son = new Son(); var father = new Father();Copy the code

/ / method 2

function inherit(Target,Origin){ // var inherit = (function(){ // var F = function(){}; // return function(Target,Origin) { // F.prototype = Origin.prototype; // Target.prototype=new F(); // Target.prototype.constructor = Target; // Target.prototype.uber = Origin.prototype; / / / /}} ()); } Father.prototype.lastName="Deng"; function Father() { } function Son() { } inherit(Son,Father); var son = new Son(); var father = new Father();Copy the code

The namespace

Manage variables, prevent global pollution, suitable for modular development

The method namespace example used in the beginning

var org = {
    deparment1:{
        jicheng:{
            name:"abc",
            age:123,
        },
        xuming:{

        }
    }
},
department2{
    zhangsan:{

    },
    lisi:{

    }
}
org.department1.jicheng.name
var jicheng = org.department1.jicheng
Copy the code

Use webpack now

The new method uses closures. Modular development to prevent contamination of global variables

Patients with a

var init = 'bcd'; Var init = (function(){var name=" ABC "; function callName(){ console.log(name); } return function() { callName(); }}()) // init(); Var initDeng=(function() {var name=123; function callName(){ console.log(name); } return function(){ callName(); }} ())Copy the code

Whichever comes out

Implement successive calls to methods: return this

Example 2

var deng={ smoke : function(){ console.log("smoking is cool!" ); return this; }, drink : function(){ console.log("drinking is cool!" ); return this; }, perm : function(){ console.log("preming is so cool!" ); return this; } } deng.smoke().drink().perm().smoke().drink().perm();Copy the code

Representation of attributes

Example 3

var deng = { wife1:{name:"xiaoliu"}, wife2:{name:"xiaowang"}, wife3:{name:"xiaozhang"}, wife4:{name:"xiaoyang"}, sayWife:function(num){ return this['wife'+num]; // String concatenation with square brackets []}}Copy the code

obj.name-->obj['name']

For in loop, object traversal, enumeration. To call a property, you must write square brackets [], not a string “, which is itself a variable

1.hasOwnProperty 2.in 3.instance of

Example 4

var obj={ name:"13", age:123, sex:"male", height:180, Weight :75} for(var prop in obj){// console.log(typeof(prop)+" "+prop); Console. log(obj[prop]); // console.log(obj.prop); // console.log(obj.prop); 5 undefined / / / / the console. The log (obj. Prop = = = obj [' prop]); // use prop as a property.Copy the code

Example 5 hasOwnProperty —- and in(can call a property on an object)(console “height”in obj)

var obj={ name:"13", age:123, sex:"male", height:180, weight:75, __proto__:{ lastName:"deng", } for(var prop in obj){if(obj.hasownProperty (prop)){false console.log(obj[prop]); false console.log(obj[prop]); }}Copy the code

Case 6.Instanceof is similar to the usage of in, but completely different,A inatanceof B-->A is not constructed by the B constructor Person instanceof Object(true)-- > Person instanceof Object(true)-- > Person instanceof Object(true

function Person(){

}
var person=new Person();
Copy the code

Difference between an array of objects of three kinds of methods: constructor/instanceof/toString

Example 7

Object.prototype.toString.call(); Object. The prototype. ToString = function () {identify this returns the results of the corresponding} obj. The toString ();Copy the code