1. OOP指什么?有什么特性?
Object Oriented Programming,OOP,面向对象程序设计,特征:
1) 封装
2) 继承
3) 多态
4)抽象
面向对象编程的目标是提高软件编程的灵活性和拓展性。
2. 如何通过构造函数的方式创建一个拥有属性和方法的对象?
function People(name,age){
this.name=name;
this.age=age;
this.sayHello=function(){
console.log("Hello! My name is"+name);
};
}
var p1=new People('小红',20);
var p2=new People('小明',22);
一个函数使用new表达式就是一个构造函数,在上面的例子中,我用构造函数People创建了两个实例:p1和p2。p1和p2都拥有name、age属性和sayHello这个方法。
p1.name // "小红"
p2.age // "22"
p1.sayHello() // "Hello! My name is小红"
3.prototype 是什么?有什么特性
- 任意一个函数都有一个名称为prototype的属性,这是一个对象。
- 每个对象都有一个内部属性
__proto__
(规范中没有指定这个名称,但是浏览器都这么实现的) 指向其类型的prototype属性,类的实例也是对象,其__proto__
属性指向“类”的prototype。
![](https://img.haomeiwen.com/i3231937/e4d45a255ea60439.jpg)
![](https://img.haomeiwen.com/i3231937/e6f1fd0ae861dd3e.jpg)
在上面构造函数的例子中,People是一个函数,还是一个对象,我们称其为“类”,而p1是People这个“类”用new创建出来的,叫做“实例”,也是一个对象,p1的__proto__
属性对应的就是People的prototype
属性。如下图:
![](https://img.haomeiwen.com/i3231937/6fabab11fa0e5cb8.jpg)
那么我们在图2中直接
var
一个空对象 a
的__proto__
属性对应的又是谁的prototype
呢?我们不妨来试一试,在控制台中输入:
a instanceof Object //-->true
instanceof
可以在继承关系中用来判断一个实例是否属于它的父类型。再输入:
a.__proto__ === Object.prototype //-->true
可以看出a
对象是由Object
直接创建,a
的__proto__
属性指向的是Object
的prototype
属性。
4.画出如下代码的原型图
function People (name){
this.name = name;
this.sayName = function(){
console.log('my name is:' + this.name);
}
}
People.prototype.walk = function(){
console.log(this.name + ' is walking');
}
var p1 = new People('饥人谷');
var p2 = new People('前端');
类、实例、prototype、proto的关系:
- 我们通过函数定义了类People,类(函数)自动获得属性prototype。
- 每个类的实例都会有一个内部属性proto,指向类的prototype属性。
![](https://img.haomeiwen.com/i3231937/d8243161743fc353.jpg)
所以,当我们调用
p1.walk()
的时候p1
会先在自己的属性中查找,没有这个属性,然后在__proto__
属性中查找,而p1
的__proto__
指向的就是People
的prototype
,其中有walk。所以p1.walk()
输出 '饥人谷 is walking'
。‘类’的prototype就好像这个类所创建的实例的公共属性容器,这样当所有的实例都具有一个公共属性或方法时,我们就可以将这个属性或方法写进父类的prototype里。
5. 创建一个 Car 对象,拥有属性name、color、status;拥有方法run,stop,getStatus
function Car(name,color,status){
this.name=name;
this.color=color;
this.status=status;
}
Car.prototype.run=function(){
console.log('running');
};
Car.prototype.stop=function(){
console.log('stop');
};
Car.prototype.getStatus=function(){
console.log(this.status);
};
![](https://img.haomeiwen.com/i3231937/03f8305f85b46d10.jpg)
网友评论