百度前端学习日记14——面向对象

1.多态

function Person(first, last, age, gender, interests){
	  this.name = {
    first,
    last
  };
  this.age = age;
  this.gender = gender;
  this.interests = interests;
}
var person1 = new Person('Bob', 'Smith', 32, 'male', ['music', 'skiing']);
var person2 = new Person('xiao', 'ming', 24, 'male', ['music', 'skiing']);

构造函数 构造函数提供了创建您所需对象(实例)的有效方法,将对象的数据和特征函数按需联结至相应对象。即上文中的Person。

对象实例   根据构造函数提供的数据以及特征函数创建的对象。即上文中的person1,person2.

多态 指多个对象拥有相同的属性以及特征,例如person1和person2都拥有年龄(age)这个属性。

2.继承

1.原型对象和原型链

JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板、从原型继承方法和属性。原型对象也可能拥有原型,并从中继承方法和属性,一层一层、以此类推。这种关系常被称为原型链 (prototype chain),它解释了为何一个对象会拥有定义在其他对象中的属性和方法。

举例,person1的原型对象即Person,而Person也有原型对象即Object。

person1.valueof();

person1中如果没有valueof函数,浏览器会向person1的原型对象Person里寻找,Person也没有的话,会到Person的原型对象Object中寻找。

2.prototype

继承成员被定义的地方(即会被子代继承的成员定义的地方,实质上person1就是根据Preson.prototype的值来创建的)

prototype类型是对象,在构造函数中被定义.

重要:prototype 属性大概是 JavaScript 中最容易混淆的名称之一。你可能会认为,this 关键字指向当前对象的原型对象,其实不是(还记得么?原型对象是一个内部对象,应当使用 __proto__ 访问)。prototype 属性包含(指向)一个对象,你在这个对象中定义需要被继承的成员。

修改原型

Person.prototype.farewell = function() {
  alert(this.name.first + ' has left the building. Bye for now!');
}

3.create()

var person2 = Object.create(person1);

按指定对象为原型来创建,即以person1为原型来创建person2.

person2.__proto__

返回的是Person,等于复制一个person1

4.constructor

每个对象实例都具有 constructor 属性,它指向创建该实例的构造器函数。

3.原型式的继承

Person.prototype.greeting = function() {
  alert('Hi! I\'m ' + this.name.first + '.');
};

紧接上例,给Person的原型添加一个greeeting函数

function Teacher(first, last, age, gender, interests, subject) {
  Person.call(this, first, last, age, gender, interests);
  this.subject = subject;
} 

创建Teacher构造函数,通过call函数继承Person的数据,并添加新数据成员subject,但是函数greeting并没被继承

Teacher.prototype = Object.create(Person.prototype);

以Person.prototype为原型创建对象,并赋值给Teacher.prototype,这样Person的greeting函数就会被继承,但是Teacher.prototype.constructor就会指向Person

Teacher.prototype.constructor = Teacher;

这里修改一下Teacher.prototype.constructor的值;

4.未解疑惑

1.疑惑一

var person2 = Object.create(person1);

  

person2 = person1;

 这两个语句有什么区别

2.疑惑二

function Teacher(first, last, age, gender, interests, subject) {
  Person.call(this, first, last, age, gender, interests);
  this.subject = subject;
} 

回到2.3的例子中,现在Teacher并未继承Person的greeting函数,Teacher.prototype的值为first, last, age, gender, interests, subject

Teacher.prototype = Object.create(Person.prototype);

现在Teacher.prototype的值为first, last, age, gender, interests, greeting(),prototype属性为希望被原型链下游的对象继承的属性和方法,但是subject属性并不在其中。

var teacher1 = new Teacher('xiao', 'ming', 24, 'male', ['music', 'skiing'],'shuxue');

上述subject属性并不在Teacher.prototype,但依然被继承。

Teacher.prototype.constructor = Teacher;

 此时Teacher.prototype的值为first, last, age, gender, interests, subject,greeting()。不理解subject是如何被加入Teacher.prototype。

后记

现在暂时不钻牛角尖,往后再处理这些疑惑

更多参考MDN

 

猜你喜欢

转载自www.cnblogs.com/no-wing/p/9317605.html