4 原型

JS的继承是基于原型的继承

作用：可以在一个类上定义一个对象，那么实例化的对象就自动拥有了这个方法

/* 原型
    1.obj.__proto__ 找到它的原型对象
    2.数组上的方法都是挂载在原型上(Array.prototype)的
*/
// toString() 因为数组的原型上有字符串toString()
// push,unshift()  因为数组原型上有
var arr = [1,2,3]
console.log(Array.prototype);
console.log(arr.__proto__);
console.log(arr.__proto__ == Array.prototype);
// Object.getPrototypeOf() 也可以访问原型对象
/*
var object = {};
var prototype = Object.getPrototypeOf(object);
console.log(prototype === Object.prototype); // true
*/

修改原型

<!-- 原型 -- 为了继承而诞生 -->
    <script>
        Array.prototype.push = function(){
            console.log("push");
        }
        var arr = [];
        arr.push();
    </script>

添加原型

 <!-- 作用：可以在一个类上定义一个对象，那么实例化的对象就自动拥有了这个方法 -->
    <script>
        var arr = [1,2,3];
        Array.prototype.sum = function (arr) {
            let total = 0;
            for (let i = 0; i < arr.length; i++) {
                total += arr[i]
            }
            return total;
        }
        console.log(arr.sum(arr));
    </script>

构造函数原型

<script>
        // es6之前没有类
        // 构造函数
        //Person 
        //自有属性 name age
        //共有方法 原型上定义 sayName，之后使用new关键字新建的实例都有这个方法
        function Person(name,age){
            this.name = name;
            this.age = age;
        }
        Person.prototype.sayName = function(){
            console.log(this.name);
        }
        Person.prototype.sayAge = function(){
            console.log(this.age);
        }
        Person.prototype.skill = "vue"
        var p = new Person("李四",10);
        p.sayName()
        p.sayAge()
        console.log(p.skill);
        // hasOwnProperty 判断一个属性是否为自有属性
        console.log(p.hasOwnProperty("name"));//true
        console.log(p.hasOwnProperty("skill"));//false
        //构造函数的特点
        //1、构造函数的首字母大写
        //2、在函数内部可以通过this关键字，给其添加自有属性
        //3、可以通过new关键字实例化一个对象
    </script>

原型的作用

# 原型对象：是某一类对象的基类，所有创建的对象都会共享该原型对象 (共享机制)
# 作用：将对象通用的方法挂载在原型上

var arr = [1,2,3]
Array.prototype.sum = function(params){
  if(Array.isArray(params)){
    return params.reduce((a,b)=>a+b)
  }
}
console.log(arr.sum(arr));
Array.prototype.http = function(){
  console.log("http");
}
arr.http()

function Teacher(name,age){
  this.name = name
  this.age = age
}
/* sayName */
Teacher.prototype.sayName = function(){
  console.log(this.name);
}
var p = new Teacher("lisi",30)
console.log(p);

2-2-1 判断一个对象是否是另一个对象的原型对象

isPrototypeOf()  判断一个对象是否是另一个对象的原型对象
var object = {}; 
console.log(Object.prototype.isPrototypeOf(object)); // true