对象_原型

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。

图1 图2

在上面构造函数的例子中，People是一个函数，还是一个对象，我们称其为“类”，而p1是People这个“类”用new创建出来的，叫做“实例”，也是一个对象，p1的__proto__属性对应的就是People的prototype属性。如下图：

图3
那么我们在图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的关系：

1. 我们通过函数定义了类People，类（函数）自动获得属性prototype。
2. 每个类的实例都会有一个内部属性proto，指向类的prototype属性。

原型图.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);
};

Car.jpg

6. 创建一个 GoTop 对象，当 new 一个 GotTop 对象则会在页面上创建一个回到顶部的元素，点击页面滚动到顶部。拥有以下属性和方法

1. ct属性，GoTop 对应的 DOM 元素的容器
2. target属性， GoTop 对应的 DOM 元素
3. bindEvent 方法， 用于绑定事件
4. createNode 方法， 用于在容器内创建节点
   预览
   代码