Heim > Web-Frontend > js-Tutorial > Hauptteil

七种JS面向对象之创建对象的方法

零到壹度
Freigeben: 2018-03-22 16:31:06
Original
1193 人浏览过

本文主要和大家详解七种JS面向对象之创建对象,主要以代码的形式和大家分享,希望能帮助到大家。

一、工厂模式
考虑到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("Joy",29,"Software Engineer");
var person2 = createPerson("Greg",27,"Doctor");
Nach dem Login kopieren

二、构造函数模式

function Person(name,age,job){  
  this.name = name;  
   this.age = age;  
     this.job = job; 
        this.sayName = function(){   
             alert(this.name);
    }
}
var person1 = new Person("Joy",29,"Software Engineer");
var person2 = new Person("Greg",27,"Doctor");
alert(person1.sayName === person2.sayName); //false.每个Person实例都会创建一个功能相同的Function实例
Nach dem Login kopieren

三、原型模式
每创建一个函数都有一个prototype属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以有特定类型共享的属性和方法。使用原型对象的好处就是可以让所有对象实例共享他所包含的属性和方法

function Person(){}
    Person.prototype.name = "Joy";
    Person.prototype.age = 29;
    Person.prototype.job = "Software Engineer";
    Person.prototype..sayName = function(){ 
  alert(this.name)
};
  var person1 = new Person();
Nach dem Login kopieren


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

 function Person(name,age,job){  
    this.name = name;   
     this.age = age;    
     this.job = job;
}
   Person.prototype = { 
      sayName:function(){     
         alert(this.name)
    }
};
   var person1 = new Person("Joy",29,"Software Engineer");
   var person2 = new Person("Greg",27,"Doctor");
   alert(person1.sayName === person2.sayName); //true
Nach dem Login kopieren


五、动态原型模式

 function Person(name,age,job){   
    this.name = name;    
    this.age = age;    
    this.job = job;    
    if(typeof this.sayName != 'function'){  
          console.log(this.name); //在下了person1、person2两个实例下只会输出Joy,不会输出Greg   
          Person.prototype.sayName = function(){ //这里只在sayName()方法不存在的情况下,才会将它添加到原型中。这段代码只会在初次调用构造函数是才会执行。            alert(this.name)
        }
    }
}
  var person1 = new Person("Joy",29,"Software Engineer");var person2 = new Person("Greg",27,"Doctor");
Nach dem Login kopieren



六、寄生虫模式

   function Person(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 = new Person("Joy",27,"Software Engineer");
Nach dem Login kopieren


寄生模式返回的对象与构造函数或者与构造函数的原型属性之间没有关系,也就是说,构造函数返回的对象与在构造函数外部创建的对象没有什么不同。为此建议能使用其他模式的情况下不要使用这种模式

七、稳妥构造函数模式
所谓稳妥指的是没有公共属性,而且其方法也不引用this对象。稳妥构造函数遵循与寄生构造函数类似的模式,但有两点不同:一是新创建的对象实例方法不引用this;而是不使用new操作符调用构造函数。

function Person(name,age,job){   
 var o = new Object();    
   o.sayName = function(){     
      alert(name)
    }; 
       return o;
}
var person1 = Person("Joy",29,"Software Engineer");
Nach dem Login kopieren

这样,变量person1中保存的是一个稳妥的对象,而除了sayName()方法外,没有别的方式可以访问其数据成员。即使有其他代码会给这个对啊ing添加方法或数据成员,但也不可能有别的办法访问传入到构造函数中的原始数据。

以上是七种JS面向对象之创建对象的方法的详细内容。更多信息请关注PHP中文网其他相关文章!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!