JS对象、原型

Q&A：

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

• OOP，即Object Oriented Programming，面向对象编程，是计算机的一种编程架构，OOP的一条基本规则是，计算机程序由能够起到子程序作用的单个或对象组合而成。包含属性和方法的对象是类的实例，而JS中没有类的概念，而是直接使用对象实现编程任务。
• 特性：
• 封装：能够将一个实体的信息、功能、响应都装在一个单独对象中的特性；使编程过程不必拘泥于原理，而是重在实现；
• 继承：在不改变源程序的基础上进行扩充，原功能得以保存，并且子程序能对其进行扩展，避免编写重复代码，提高工作效率；
• 多态：允许将子类类型的指针赋值给父类类型的指针；原生JS是弱类型语言，没有多态概念。

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

由于函数也是对象的一种，所以继承了对象原型，可以对其添加属性和方法，构造函数也是函数，所以用自定义函数的方式，并将首字母大写以明确是构造函数即可，可以用new操作符创建函数实例验证。

function Person(name) {
      this.name = name;
      this.sayName = function() {
        console.log(this.name);
      }
    }

构造函数

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

• prototype，即原型，每创建一个函数都会有一个prototype属性，这个属性是一个指针，指向一个对象，这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。
• 特性：让所有对象实例共享原型对象所包含的属性和方法：

function Person(name) {
      this.name = name;
    }
    Person.prototype.sayName = function() {
      console.log(this.name);
    }
    var p1 = new Person('zhao'),
        p2 = new Person('kevin');

    p1.sayName();
    p2.sayName();

prototype

4. 画出如下代码的原型图

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

原型图

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

      function People() {
        var age = 1;
        this.age = 10;
      }
      People.age = 20;

      People.prototype.age = 30;

• var age = 1：age为局部变量；
• this.age = 10：函数调用时，age为this指向对象的属性；
• People.age = 20：构造函数的age变为20；
• People.prototype.age = 30：原型添加age属性；

Coding：

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

function Car(name, color, status) {
      this.name = name;
      this.color = color;
      this.status = status;
    }
    Car.prototype = {
      constructor : Car,
      run: function() {
        this.status = 'run';
      },
      stop: function() {
        this.status = 'stop';
      },
      getStatus: function() {
        console.log(this.status);
      }
    }

    var car1 = new Car('BMW', 'red', 'stop');

coding1

---

本文归本人和饥人谷所有，如需转载请注明出处