快上网专注成都网站设计 成都网站制作 成都网站建设
成都网站建设公司服务热线:028-86922220

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

构造函数与实例化之间的关系和原型的引入

我对构造函数与实例化之间的理解

当我们的编程是面向对象的时候,
先是抽象的过程=>然后实例化的过程
比如我们抽象一个人,我知道一个人的基本信息。
名称,年龄,性别,....等等
我们把先是抽象的,在抽象完成后,我们在实例化。

构造函数与实例化之间的关系?

//这个自定义的构造函数在抽象
function Person(name,age,sex){
    this.name=name;
    this.age=age;
    this.sex=sex;
    this.say=function(){
        console.log("我叫",name)
    }
}
// 这个过程是实例化
let per1=new Person('司藤',300,'女');
per1.say();//调用


//let per1=new Person('司藤',300,'女');
通过上面这一行代码。
我们可以得出一个结论:
构造函数与实例对象之间的关系是:
实例对象需要通过构造函数来创建的。
同时:我们可以知道实例对象的构造器就是构造函数
我们来证明这一句话是否正确;上面的代码不改变。
console.log( per1.constructor===Person ) //返回的是true
充分说明:实例对象的构造器就是构造函数这一句话是正确的。

per1.say是否等于per2.say

 function Person(name,age,like) {
    this.name=name;
    this.age=age;
    this.like=like;
    this.say=function(){
        console.log('我可以不吃饭');
    }
}
var per1=new Person("司藤",300,'耍');
var per2=new Person('白浅','','耍');
per1.say();
per2.say();
console.log( per1.say==per2.say ) //false

per1.say不等于per2.say得出的结论

因为console.log( per1.say==per2.say ) //false
我们可以得出一个结论。
那就是per1.say()和per2.say()调用的不是同一个方法

那么他们的内容是否是相等的的呢?
console.log( per1.say()==per2.say() ) //true
说明内容是相等的

康康下面这一段代码出现的问题

function Person(name,age,like) {
    this.name=name;
    this.age=age;
    this.like=like;
    this.say=function(){
        console.log('我可以不吃饭');
    }
};
for (var index = 0; index < 100; index++) {
    var per=new Person("司藤",300,'耍');
    per.say();
}

这一段代码是它在内存中开辟了100个空间。
每个空间都有一个say方法。
但是每一个say方法都是不同的。可是他们输出的内容是相同。
或者说执行的逻辑是相同的。
这样就造成了空间浪费。
所以在项目中,这样就造成了浪费空间。
我们可不可以来优化呢 ?

优化代码解决造成空间浪费

function comSay(){
    // 执行相同的逻辑
    console.log('我可以不吃饭')
};

function Person(name,age,like) {
    this.name=name;
    this.age=age;
    this.like=like;
    this.say=comSay;//不要加括号
};
var per1=new Person("司藤",300,'耍');
var per2=new Person('白浅','','耍');
console.log( per1.say==per2.say ) //true

这样我们就节约了空间。
每次调用的时候,都是同一个方法。

处理使用这种方法,我们还可以使用原型的方式

function Person(name,age,like) {
    this.name=name;
    this.age=age;
    this.like=like;
};
Person.prototype.comSay=function(){
    console.log('我可以不吃饭')
}
var per1=new Person("司藤",300,'耍');
var per2=new Person('白浅','','耍');
console.log( per1.comSay==per2.comSay ) //true
// 我们还可以通过原型来解决数据共享

原型的作用:数据共享,节约空间。

文章名称:构造函数与实例化之间的关系和原型的引入
文章网址:http://6mz.cn/article/dsoposg.html

其他资讯