有关javaScript面向对象和原型笔记

Posted 2020-09-29 cynchanpin

javascript是一种比較特殊的语言，ECMAScript中没有类的概念。跟其它面向对象的语言有一定的差别。它的对象也与基于类的语言中的对象有所不同，严格来说，javascript对象是一组没有特定顺序的值，对象的每一个属性或方法都有一个名字。而每一个名字都映射到一个值。每一个对象都是基于一个引用类型的创建的。

创建自己定义对象的最简单的方式就是创建一个Object的实例。然后再为其加入属性和方法，如：

var box = new Object();        //创建对象
box.name1 = 'Lee';                    //加入属性
box.age = 100;                        //
box.run = function () {
    return this.name1 + this.age       //this表示当前作用域下对象

不足：使用同一个接口创建非常多对象。会产生非常多反复代码。

工厂模式：

在ECMAScript中无法创建类，开发者就想出了第二种方法，用一种函数来封装以特定接口创建对象的细节，如：

 

   function createPerson(name,age,job){
        var o = new Object();
        o.name = name;
        o.age = age;
        o.job = job;
        o.sayName = function(){
            alert(this.name);
        }
        return o;
    }
    var person1 = createPerson('lilei',29,'Software Engineer');
    var person2 = createPerson('Greg',27,'Doctor');
    person1.sayName();
    person2.sayName();
    alert(typeof person1);
    alert(typeof person2);

函数creatPerson()可以依据接受的參数来构建一个包括全部必要信息的Person对象。可以无数次低调用这个函数。而每次它都返回一个包括三个属性的一个方法的对象。

工厂模式尽管攻克了创建多个类型对象的问题，但却没有解决对象识别的问题。

构造函数模式

function Person(name,age,job){
        this.name = name;
        this.age = age;
        this.job = job;
        this.sayName = function(){
            alert(this.name);
        };
    }
    var person1 = new Person('lilei',29,'Software Engineer');
    var person2 =new Person('Greg',27,'Doctor');
    person1.sayName();
    person2.sayName();
    alert( person1 instanceof Object); 
    alert( person2 instanceof Person);

 

在这个样例其中。Person()函数代替了createPerson()函数。同一时候注意到跟createPerson()函数的差别：

没有显式地创建对象；

直接将属性和方法赋给了this对象；

没有return 语句；

构成方法首个字母大写。

构造函数的的问题也有，就是每一个方法都要在每一个实例上又一次创建一遍，

组合使用构造函数模式和原型模式

创建自己定义类型常见的方式是组合使用构造函数模式和原型模式。

构造函数模式用于定义实例属性，而原型模式用定义方法和共享属性，从而每一个实例都会有 自己的一份实例属性的副本。但同一时候又共享着对方的方法的引用。

function Person(name,age,job){
    this.name =name;
    this.age = age;
    this.friends = ["Shelpy","Court"];
    }
    Person.prototype = {
    constructor:Person,
    sayName:function(){
    alert(this.name)
    }
    }
    var person1 = new Person('lilei',29,'Software Engineer');
    var person2 = new Person('Greg',27,'Doctor');
    person1.friends.push("Van");
    alert(person1.friends);
    alert(person2.friends);
    alert(person1.friends === person2.friends);
    alert(person1.sayName === person2.sayName);

      在这个样例中。实例属性都是在构造函数中定义的。而由全部实例共享的属性consructor和方法sayName()则是在原型中定义的。当改动了person1.friends时，并不会影响到person2,.friends。由于它们引用了不同的数组。