JavaScript是基于原型(prototype), 没有python中class 的概念。
var Cartoon={
name:'Micky Mouse',
height:15,
run:function () {
console.log(this.name+'is quacking')
}
};
function createCartoon(name) {
var p = Object.create(Cartoon);
p.name=name;
return p
}
var p2 = createCartoon('Donald Duck');
console.log(p2.name); //'Donald Duck'
p2.run() //'Donald Duck is running'
构造函数
在JavaScript中,可以用关键字new来调用这个函数,并返回一个对象:
function Cat(name) {
this.name = name;
this.hello=function () {
console.log('hello'+this.name)
}
}
var k1 = new Cat('kitty'); // new 别忘了写
k1.hello();
同上
function Cat(name) { // 构造函数首字母要大写
this.name=name
}
Cat.prototype.hello=function () {
console.log('hello'+this.name)
};
var k1 = new Cat('kitty');
k1.hello()
用Cat()创建的对象还从原型上获得了一个constructor属性,它指向函数Cat本身:
console.log(k1.constructor===Cat.prototype.constructor) //true
不写new时:
function Robot(props) {
this.name = props.name || 'John Doe';
this.inventor = props.inventor || 'None'
}
Robot.prototype.sayHi = function () {
console.log('hello,hello hello'+this.name + 'my inventor is '+ this.inventor)
};
function createNewRobot(props) {
return new Robot(props || {}) // 在这里封装new的相关操作
}
传参时:
var r1 = createNewRobot({
name:'David',
inventor:'Alice'
});
r1.sayHi()
动态原型创建对象
function Factory(name,location) {
this.name = name;
this.location = location;
if (typeof this.recruit !== 'function'){ // 判断this.recruit这个属性是不是function,如果不是function则证明是第一次创建对象
Factory.prototype.recruit = function () {
console.log(this.name+'starting'+ ' in ' + this.location )
};
}
}
let f1 = new Factory('NNL','Jilin');
console.log(f1.name,f1.location);
f1.recruit()
原型和原型链
proto 和 prototype
prototype是函数才有的属性
proto是每个对象都有的属性
在大多数情况下, proto可以理解成构造器原型, 即:
__proto__ === constructor.prototype
var a = {};
console.log(a.prototype); //undefined
console.log(a.__proto__); //Object {}
var b = function(){}
console.log(b.prototype); //b {}
console.log(b.__proto__); //function() {}
由于proto是任何对象都具有的属性,同python一样,JS中也是万物皆对象,所以会形成一条proto连接起来的链条,递归访问最终到头,返回值是null。
当JS引擎查找对象的属性时,会先查找对象本身是否具有该属性,如果不存在,会在原型链上查找。
JS实现继承的几种方式
先定义一个父类
// 定义一个动物类
function Animal (name) {
// 属性
this.name = name || 'Animal';
// 实例方法
this.sleep = function(){
console.log(this.name + ' is sleeping now');
}
}
// 原型方法
Animal.prototype.eat = function(food) {
console.log(this.name + ' is having ' + food);
};
1、原型链继承(核心:将父类的实例作为子类的原型)
function Cat(){
}
Cat.prototype = new Animal();
Cat.prototype.name = 'cat';
// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.eat('fish'));
console.log(cat.sleep());
console.log(cat instanceof Animal); //true
console.log(cat instanceof Cat); //true
这种方法缺点太多,例如,创建子类实例时,无法向父类构造函数传参,无法实现多继承等,不推荐。
2、构造函数继承(使用父类的构造函数来增强子类实例,等于是复制父类的实例属性给子类)
function Cat(name){
Animal.call(this);
this.name = name || 'Tom';
}
// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // false
console.log(cat instanceof Cat); // true
只能继承父类的实例属性和方法,不能继承原型属性/方法, 不推荐。
3、实例继承(为父类实例添加新特性,作为子类实例返回)
function Cat(name){
var instance = new Animal();
instance.name = name || 'Tom';
return instance;
}
// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // true
console.log(cat instanceof Cat); // false
不支持多继承,不推荐。
4、拷贝继承
function Cat(name){
var animal = new Animal();
for(var p in animal){
Cat.prototype[p] = animal[p];
}
Cat.prototype.name = name || 'Tom';
}
// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // false
console.log(cat instanceof Cat); // true
无法获取父类不可枚举的方法(不可枚举方法,不能使用for in 访问到)不推荐。