创建对象

2018-10-18  本文已影响0人  唐卡豆子

工厂方式

function Car(name, color){
        let car = new Object();// 每一次通过工厂方法去创建一个对象
        car.name = name;
        car.color = color;
        car.say = function(){
          console.log(this.color);
        }
        return car;
      }
      var c1 = Car('xp', 'red');
      var c2 = Car('BMW', 'white');
      c1.say ();
      c2.say ();

缺点:
1.无法确定对象的类型(因为都是Object)。
2.创建的多个对象之间没有关联。
3.这个对象的属性name和方法say 都必须重新创建一次,浪费内存

构造函数

function Car(name, color){
        this.name = name;
        this.color = color;
        this.say = function(){
          alert(name);
        }
      }

      let car = new Car('kiwi', 'red');
      car.say();

缺点:
1.多个实例重复创建方法,无法共享。
2.多个实例都有say 方法,但均不是同一个Function的实例。

原型

    function Car(){

      }

      Car.prototype.name = 'kiwi';
      Car.prototype.color = 'red';
      Car.prototype.list = new Array('a', 'b');
      Car.prototype.say = function(){
        console.log(this.name+'---------------------');
      }
      let car = new Car();
      car.say();
      car.name = 'jojo';
      car.list.push('c');
      console.log(car.name);// jojo
      console.log(car.list);// 数组的引用值,Car的两个对象指向的都是同一个数组
      car.say();// a,b,c

      let car2 = new Car();
      car2.say();
      console.log(car2.name);// kiwi
      console.log(car2.list);//a,b,c

缺点:
1.无法传入参数,不能初始化属性值。
2.如果包含引用类型的值时,改变其中一个实例的值,则会在所有实例中体现。

混合原型,构造函数

// 构造函数
      function Car(name, color){
        this.name = name;
        this.color = color;
        this.list = new Array('a', 'b');
      }
      // 原型
      Car.prototype.say = function(){
        console.log(this.color+'---------------------');
      }
      let car = new Car('kiwi', 'red');
      car.list.push('c');
      console.log(car.list);// a, b, c

      let car2 = new Car('kiwi', 'red');
      console.log(car2.list);// a, b

优点: 这种是目前用的最多的创建类和对象的方式, 将方法和属性用不同的方式封装.
构造函数共享实例属性,原型共享方法。可传递参数,初始化属性值。

动态原型,构造函数

// 构造函数
      function Car(name, color){
        this.name = name;
        this.color = color;
        this.list = new Array('a', 'b');
        // 属性的方法不会被重复创建, 只执行一次
        if (typeof this.say != 'function'){
          Car.prototype.say = function(){
            console.log(this.name);
          }
        }
      }
上一篇 下一篇

猜你喜欢

热点阅读