Javascript构造函数、原型、对象

构造函数与原型

构造函数是生成对象的模板,一个构造函数可以生成多个对象,每个对象都有相同的结构。使用new调用构造函数会自动创建一共新对象,调用构造函数的一共重要特征是,构造函数的prototype属性会被用作新对象的原型。

构造函数的缺点就是,每当你实例化两个对象时,需要调用两次构造函数的某一个方法,这带来的坏处就是占用内存。

为了解决构造函数的属性和方法无法被对象实例所共享的问题,我们可以把需要共享的属性和方法放在原型(prototype)对象上。原型对象上的所有属性和方法,都会被对象实例所共享。

function Animal(){}
var anim = new Animal();

每个javascript函数都自动拥有一共prototype属性,该属性是一个对象

\\true
Animal.prototype.__proto__ == Object.prototype 

prototype对象包含一个constructor的属性,该属性指向函数自身

\\true
Animal.prototype.constructor == Animal

当使用new调用构造函数时,会创建一个新对象,新对象的有一个__proto__属性,该属性指向构造函数的prototype。

下面图中概括了js对象、原型、构造函数之间的关系。
原型 对象 构造函数


原型继承

js是一门基于原型的语言,在其他面向对象语言中,例如Java,一个类继承于另一个类,而js则是从另一个对象继承。

function Animal(name){
    this.name = name;
}
Animal.prototype.say=function(){
    console.log('I am ' + this.name);
}

function Cat(){}
Cat.prototype = new Animal();

var cat = new Cat();
cat.say();

将Cat的prototype属性设为一个Animal对象,此时Cat可以继承Animal的属性。

当读取对象的某个属性时,JavaScript引擎先寻找对象本身的属性,如果找不到,就到它的原型去找,如果还是找不到,就到原型的原型去找。如果直到最顶层的Object.prototype还是找不到,则返回undefined。

但上面的继承方法也有缺陷,Cat构造函数传递参数,此时可以使用apply或call的方法。

function Cat(name, age){
    Animal.call(this,name);
    this.age = age;
}
Cat.prototype = new Animal();
Cat.prototype.constructor=Cat;

Cat.prototype.say = function(){
    Animal.prototype.say.call(this,null);
    console.log('I am ' + this.age + ' years old');
}

var cat = new Cat('Tom',15);
cat.say();

//I am Tom
//I am 15years old

instanceof

instanceof 云悬浮用于检测对象是否属于某个类

//true
cat instanceof Animal

实际上instanceof运算符并不会检测cat是否由Animal()构造函数初始化而来,而会检测cat是否继承自Animal.prototype。

实际上,instanceof判断的是一个对象原型链上的__proto__与另一个构造函数的prototype是否相等

cat.__proto__ == Cat.prototype      //true
cat instanceof Cat                   //true

cat.__proto__.__proto__ == Animal.prototype     //true
cat instanceof Animal                            //true

cat.__proto__={}        //改变cat对象的__proto__属性
cat instanceof Cat       //输出false
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值