构造函数和原型

一.构造函数和原型

1、构造函数

1.概述

构造函数是一种特殊的函数，主要用来初始化对象，即为对象成员变量赋初始值，它总与new一起使用，我们可以吧对象中一些公共的属性和方法抽取出来，然后封装到这个函数里面。

new在执行时会做四件事：

1. 在内存中创建一个新的空对象；

2. 让this指向这个新的对象；

3. 执行构造函数里面的代码，给这个新对象添加属性和方法；

4. 返回这个新对象（所以构造函数里面不需要return）。

创建对象的三种方式：

1.对象字面量

var obj1={};

2. new Object（）

var obj2=new Object();

3.自定义构造函数

function Star(uname,age){
    this.uname=name;
    this.age=age;
    this.sing=function(){
        console.log("我会唱歌啊");
    }
}
var ldh=new Star('刘德华',42);
var zxy=new Star('张学友',46);
ldh.sing();
zxy.sing();
​

下文皆使用这个例子来说明。

2.成员

JavaScript的构造函数中可以添加一些成员，可以在构造函数本身添加，也可以在构造函数内部的this上添加。通过这两种方式添加的成员，就分别为静态成员和实例成员。

• 静态成员：在构造函数本身上添加的成员，只能由构造函数本身来访问；

function Star(uname,age){
    this.uname=name;
    this.age=age;
    this.sing=function(){
        console.log("我会唱歌啊");
    }
}
Star.sex="男";//在构造函数本身添加  就是静态成员
console.log(Ster.sex)；//只能通过本身来访问

• 实例成员：在构造函数内部创建的对象成员，只能由实例化的对象来访问。

function Star(uname,age){
    this.uname=name;
    this.age=age;
    this.sing=function(){
        console.log("我会唱歌啊");
    }
}
var ldh=new Star('刘德华',42);
//这里面的 uname  age sing  就是实例成员，都是通过this添加的成员。只能通过实例对象ldh来访问

2.对象原型prototype

构造函数虽然很好用，但是存在浪费内存的问题~

美创造一个都会开辟一个新的空间。

这就来了原型prototype 解决这个问题~

构造函数通过原型分配的函数是所有对象共享的；

JavaScript规定：每一个构造函数都有一个prototype属性，指向另一个对象。注意这个prototype就是一个对象，这个对象的所有属性方法，都会被构造函数拥有。

我们把那些不变的方法直接定义在原型对象上，这样所有的对象的实例就可以共享这些方法，就节约了内存空间。

function Star(uname,age){
    this.uname=name;
    this.age=age;
}
​
Star.prototype.sing=function(){
        console.log("我会唱歌啊");
    }//把sing这个方法定义在原型上
​
var ldh=new Star('刘德华',42);
var zxy=new Star('张学友',46);
ldh.sing();
zxy.sing();
​

3.原型对象 proto

对象都会有一个属性proto指向构造函数的prototype原型对象，之所以我们对象可以使用构造函数prototype原型对象的属性和方法，就是因为对象proto的存在。

• proto对象原型和原型对象prototype是等价的

console.log(ldh.__proto__ === Star.prototype)//true

• proto对象原型的意义就在于为对象的查找机制提供一个路线。但是是一个非标准属性，在实际开发中，不可以使用这个属性，他只是内部指向原型对象prototype。

来张图理解理解~

4. constructor构造函数

对象原型（proto）和原型对象（prototype）都有一个constructor属性，constructor我们称为构造函数，因为它指回构造函数本身。

很多情况下，我们需要用constructor函数指回原来的构造函数。

Star.prototype={
    constructor:Star,//如果不添加这一步，那么就会把原来的对象覆盖，因此不会指向原来的构造函数
    Sing:fnction(){
    console.log("我会唱歌");
},
     Movie:fnction(){
    console.log("我会演电影");
}
}
​
console.log(Star.prototype.constructor);
//指回原来的构造函数

5.三者的关系

 

6.原型链

查找成员是按照这个原型链一层一层找下去，如果没找到，就返回undifined。

成员查找规则：

1. 当访问一个对象的属性时，首先查找这个对象自身有没有这个属性；

2. 如果没有就查找他的原型也就是proto指向的prototype原型对象；

3. 如果也没有找到，就查找原型对象的原型（Object的原型对象）；

4. 依此类推直到找到Object为止（null）。

7.扩展内置对象

通过原型对象，对原来的内置对象进行扩展自定义的方法。

例子：添加一个加法方法sum

<script>
        Array.prototype.sum = function () {
            var sum = 0;
            for (var i = 0; i < this.length; i++) {
                sum += this[i];
            }
            return sum;
        }
        var arr = [1, 2, 3];
        console.log(arr.sum());
</script>

注意：数组和字符串内置对象不能给原型对象覆盖操作Array.prototype={},只能是Array.prototype.xxx=function(){}的方式。

二、继承

ES6之前不提供extends继承，可以通过构造函数+原型对象模拟实现继承，被称为组合继承。

1.call( )

调用这个函数，并且修改函数运行时的this指向。

fun.call(当前调用函数this的指向对象,参数1,参数2,...)

function myFunction(a, b) {
    return a * b;
}
myObject = myFunction.call(myObject, 10, 2);     // 返回 20

2.借用父构造函数继承属性

例子：

 <script>
        function Father(uname, age) {
            this.uname = name;
            this.age = age;
        }
​
        function Son(uname, age) {
            Father.call(this, uname, age);
        }
        var son = new Son('刘德华', 34);
        console.log(son);//添加了这两个属性
    </script>

2.借用原型对象继承属性

<script>
        function Father(uname, age) {
            this.uname = name;
            this.age = age;
        }
        Father.prototype.money = function () {
            console.log('赚了10000块');
        }
        Son.prototype = new Father();
        //用了对象的形式秀发i了原型对象用constructor指回原来的构造函数
        Son.prototype.constructor = Son;
​
        function Son(uname, age, score) {
            Father.call(this, uname, age);
            this.score = score;
        }
        var son = new Son('刘德华', 34, 100);
        console.log(son);
        console.log(Son.prototype.constructor);
    </script>
​

图片分析过程：

在Father原型对象上添加了money这个方法，当Son要使用这个方法时，创建一个Father实例对象，Son原型对象指向这个实例对象，这个实例对象里面有一个proto对象原型指向Father原型对象，也就相当于继承到了这个方法。

 

 

本文为pink老师视频的笔记，原视频指路：

https://www.bilibili.com/video/BV1f5411t7dq?p=13&spm_id_from=pageDriver

标签：对象,age,uname,原型,prototype,构造函数
来源： https://www.cnblogs.com/xiaohuliya/p/16263364.html