关于对象和原型的几个问题

问答

1. OOP指什么？有哪些特性

面向对象程序设计（Object-oriented programming）
封装
封装机制将数据和代码捆绑到一起，避免了外界的干扰和不确定性。它同样允许创建对象。简单的说，一个对象就是一个封装了数据和操作这些数据的代码的逻辑实体。 在一个对象内部，某些代码和（或）某些数据可以是私有的，不能被外界访问。通过这种方式，对象对内部数据提供了不同级别的保护，以防止程序中无关的部分意外的改变或错误的使用了对象的私有部分。
继承
继承是可以让某个类型的对象获得另一个类型的对象的属性的方法。它支持按级分类的概念。例如，知更鸟属于飞鸟类，也属于鸟类。就像图5中描绘的那样，这种分类的原则是，每一个子类都具有父类的公共特性。
多态
多态是OOP的另一个重要概念。多态的意思是事物具有不同形式的能力。举个例子，对于不同的实例，某个操作可能会有不同的行为。这个行为依赖于所要操作数据的类型。比如说加法操作，如果操作的数据是数，它对两个数求和。如果操作的数据是字符串，则它将连接两个字符串。

2. 如何通过构造函数的方式创建一个拥有属性和方法的对象?

例：

function Hunger(name,age){
  this.name = name,
  this.age = age
  this.func = function(name){
    console.log(name)
  } 
}
var p1 = new Hunger("hunger",18);
p1.func("name",18);

3. prototype是什么？有什么特性

prototype是构造原型，构造函数的prototype指向其所属类的原型对象，一个类的原型对象初始值是与类同名的

function Animal(){}

console.log(Animal.prototype)

// 结果：

Object {}
constructor: function Animal()
__proto__: Object

// Animal类的原型对象有两个属性：constructor和__proto__。
constructor属性便是构造函数Animal()。__proto__属性指向的是
Animal类的父类原型对象

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('前端');

5. 以下代码中的变量name有什么区别

function People (){
 var name = "饥人谷"; // 函数内部变量name == “饥人谷”
 this.name = "我"; // this指向的name == "我"（不使用构造函数时为window）
}
People.name = "jscode"; // 对象People的属性name
People.prototype.name = "学前端"; // People的原型对象的属性name

代码

1. 创建一个 Car 对象，拥有属性name、color、status；拥有方法run，stop，getStatus

function Car(name,color,status){
  this.name: name;
  this.color: color;
  this.status: status;
  this.run: function(){
    this.status = "running";
  } ;
  this.stop: function(){
    this.status = "stop";
  }
  this.getStatus: function(){
    return this.status;
  };
}
var p1 = new Car("BMW","black","running");

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

ct属性，GoTop对应的DOM元素的容器
target属性，GoTop对应的DOM元素
bindEvent方法，用于绑定事件
createNode方法，用于在容器内创建节点

function GoTop($ct){
  this.ct  = $(".ct");
  this.creatNode = function(){
    this.ct.append("<div class='goTop'></div>");
  }
  this.target = $(".goTop");
  this.bindEvent = function(){
    this.target.on("click",function(){
      $(window).scrollTop(0);
    });
  }
}
var goTop = newGoTop($(".ct"));

3. 使用构造函数创建对象的方式完成轮播功能( 查看demo )，使用如下调用方式

function Carousel($node){
//todo...
}
Carousel.prototype = {
//todo...
};
var $node1 = $('.ct').eq(0);
var $node2 = $('.ct').eq(1);
var carousel1 = new Carousel($node1);
var carousel2 = new Carousel($node2);

本文版权归本人（帘外修竹），转载须说明来源