JavaScript基础让前端飞Web前端之路

Javascript类和继承

2017-09-22  本文已影响54人  softbone

Javascript中的‘类’

Javascript中并没有严格意义上的类。ES5中通过使用首字母大写的方法来模拟类。这个首字母大写的方法也被称为构造函数,其是一个函数。
构造函数前面用关键字new,则创建一个新的空对象,并用这个新对象调用这个函数。

function Person (name) {
  this.name = name;
}  
var per1 = new Person('bob');

其实方法也是对象,方法都是由Function构造函数创建的,Function由它本身创建。

三个概念

如果构造函数里显示的返回一个对象,我们声明的实例对象就是返回的这个

function OBJ(){
  return {name : 1}
};
var other = new OBJ(); 
other.name;  // 1

//other的构造函数为Object , 如果返回的是一个别的构造函数创建的实例对象,other就是指向这个实例对象

一个例子

function Person(name){
  this.name = name
}
var per = new Person("someone");

在这个例子中,Person是构造函数,是一个函数对象,是对象就会有构造函数(Object.prototype对象除外,它是唯一没有原型和构造函数的对象)
Object.prototype instanceof Object // false 结果很有趣
函数对象的构造函数都是Function , Object也是函数对象,所以 Object的构造函数也是Function.

上面的例子,解释器会为Person创建一个初始的prototype,这个原型对象中有个constructor属性指向构造函数,在我们给Person指定自定义的对象时,自定义的对象是没有自己的constructor属性的(会继承),除非我们手动添加

实现继承

function Student(id){
this.id = id
}

根据现实逻辑,Student是Person的一类
所以Student的实例应该有Person的特征
继承是通过prototype表现的,所有类的实例对象都会继承类(构造函数)protptype的属性和方法。prototype一定是个对象
Student.prototype = inhert(Person.prototype) || new Person();
Student.prototype.constructor = Student //这一句是指定Student实例的构造函数的,如果不指定,不会默认生成,而是使用继承来的(这里就是Person)

function inherit(obj){
    if(obj == null || (typeof obj !== "object" && typeof obj !== "function")){
        throw TypeError();
    }
    if(Object.create) return Object.create(obj);   //新建一个对象,对象构造函数的prototype为obj
    var f = function(){};
    f.prototype = obj;
    return new f();
}

关于实例对象的constructor

//下面两种错误的继承
Student.prototype = Person.prototype //Student和Person一样了
Student.prototype = Person //Person这个函数对象被当作prototype了

var otherCon = Person;
obj4 instanceof otherCon //true instanceof是检测对象的继承关系而不是构造函数
函数有个name属性,可以用来看构造函数的name

上一篇下一篇

猜你喜欢

热点阅读