js中原型和原型链

1.原型： 在JavaScript 中，对象被表现为prototype 。

　　原型其实一直存在于咱们接触过的任何一个对象。

2.

Tip：在函数对象中也存在__proto__属性，可是查看函数对象的原型仍是要使用prototype 。

JavaScript 在建立对象的时候，不管是普通对象仍是函数对象，都存在一个属性__proto__，

JavaScript 的原型链 和继承主要依赖于__proto__

咱们能够经过__proto__ 和 prototype的结合 查看原型的每个层级，也就是原型链。

Tip：在js中，原型和原型链是实现继承的一种模型。

X.a();

当咱们调用一个对象的属性或者方法的时候，系统会查询这个对象，若是这个对象中不存在这个方法，就会向上一层查询，若是上一层仍是没有这个属性或者方法，就继续沿着原型链去找，一直找到原型的最顶端，object 的上一层 null才会中止。

3.简单的继承

 

        var a = {
            x : 1,
            y : 2
        }
        var b = {
            z : 3,
            w : 4
        }
        b.__proto__ = a;//b的原型是a，b继承a
        console.log(b);
        console.log(b.x);    

View Code

 

4.create建立对象的一种方式

var a = Object.create({x:1});
        console.log(a.__proto__);//{x:1}
        var b = Object.create(null);
        console.log(b);//Object No Properties
        var e = "hello";
        console.log(e.__proto__);//String {length: 0, [[PrimitiveValue]]: ""}
        var dd = Object.create(Object.prototype);
        console.log(dd);
        console.log(dd.__proto__);

View Code

5.constructor 属性返回对建立此对象的数组函数的引用。

var a  = 10;
        console.log(a.constructor);//function Number
        var b = "hello";
        console.log(b.constructor);//function String

6.继承

/*
        
        需求：让咱们新建立对象a 可以同时拥有 Show对象和 SHow对象原型的方法和属性。
        TIp：须要明白：js的原型是能够更改的。
        实现思路： 咱们要经过更改原型的方式来实现继承。
        Why？ 由于js中的机制是：对象会从原型无条件的继承属性和方法。
        咱们才去将a对象的原型从新赋值为实例化后的show对象。
         */
        function Show(){
            this.getName = function (name){
                alert(name);//爸爸
            }
        }
        Show.prototype.getAge = function (age){
            alert(age);//爷爷
        }
        // console.log(Show);
        // console.log(Show.prototype);
        var a = {};//干儿子  object  function Obejct
        a.__proto__ = new Show();//若是采用这种方式去实现继承的话，会发现，
        //a原型的构造函数和自己的构造函数被破坏了，那么这种状况是不利用开发的
        //容易出现不可预知的错误，因此，咱们在下一步，要将a原型的构造函数改成a自己也就是obejct。
        // console.log(a.constructor);    
        a.__proto__.constructor = a;  
        // a.getName('dav');
        // a.getAge(10);
        console.log(a);
        console.log(a.__proto__);
        console.log(a.__proto__.constructor);
        // a.__proto__ = Show.prototype;
        // a.getAge(2);
        // a.getName('dav');

 7.继承

/*
        
        m 对象  n对象  k对象
        须要k对象拥有m对象和 n对象的属性和方法
         */
        function m ()
        {
            this.showM = function (){
                alert('this is M')
            }
        }
        function n()
        {
            this.showN = function (){
                alert('this is N');
            }
        }
        function k()
        {

        }

        n.prototype = new m();
        n.prototype.constructor = n;

        k.prototype = new n();
        k.prototype.constructor = k;

        var boo = new k();
        boo.showM();
        boo.showN();

View Code

8.跳过继承过来的属性或方法

var a = {
            x:1,
            y:2
        }
        var b ={
            a :3,
            c:4
        }
        b.__proto__ = a;
        console.log(b);
        for(var i in b)
        {
            if(!b.hasOwnProperty(i)){//可以将继承过来的属性或者方法跳过，不去遍历出来
                continue;
            }
            else
            {
                document.write(b[i] + '<br/>')
            }
        }

View Code