几类javascript常用的创建对象方法

时间：2021-01-24 08:02:38

JavaScript的一个重要功能就是面向对象的功能，通过基于对象的程序设计，可以用更直观、模块化和可重复使用的方式进行程序开发。

一组包含数据的属性和对属性中包含数据进行操作的方法，称为对象。比如要设定网页的背景颜色，所针对的对象就是document，所用的属性名是bgcolor，如document.bgcolor="blue"，就是表示使背景的颜色为蓝色。

    JavaScript中的所有事物都是对象：字符串、数值、数组、函数此外，JavaScript允许自定义对象。所以javasript中的对象可以跟为内置对象和自定义对象两大类。javascript中的内置对象对于我们来说并不陌生，如Date(日期)对象、Array(数组)对象、Boolean(逻辑)对象、Global对象等。与之对应的是自定义对象的创建跟使用。在其他面向对象的语言中，对象的创建方式几乎都一致有一个统一的标准，然而由于javascript的灵活性，使得对象的定义跟创建都很灵活，没有统一的标准。正是由于没有标准，所以用起来稍不注意就会给代码带来隐患。

 

简单对象创建方式

  1. var Cat;
  2. Cat.name="tom";//添加属性并赋值
  3. Cat.age=2;
  4. Cat.sayHello=function(){
  5. alert("喵喵！");}
  6. Cat.sayHello();

工厂方式

  1. functionCreateCat(){
  2. var Cat=new object();
  3. Cat.name="Tom";//添加属性并赋值
  4. Cat.age=2;
  5. Cat.sayHello=function(){
  6. alert("喵喵！");
  7. }
  8. return Cat;
  9. }
  10. Cat.sayHello();//调用对象方法

每个对象都有自己的sayHello方法，所以开发者在此基础上有做了新的改进

  1. function say(){
  2. alert("喵喵！");
  3. }
  4. functionCreateCat(){
  5. var Cat=new object();
  6. Cat.name="Tom";//添加属性并赋值
  7. Cat.age=2;
  8. Cat.sayHello=say;
  9. return Cat;
  10. }

构造函数方式

  1. function Cat(name,age){
  2. this.name=name;//this当前对象
  3. this.age=age;
  4. this.sayHello=function(){
  5. alert("喵喵！");
  6. }
  7. }
  8. var cat =new Cat("Tom",5,);//实例化/创建对象
  9. cat.sayHello();//调用方法

缺点同最初工厂方法一样每个对象都有自己的方法或函数。

原型方式

  1. function Cat(){
  2. }
  3. Cat.prototype.name="Tom";
  4. Cat.prototype.sayHello=function(){
  5. alert("喵喵！");
  6. }
  7. var cat =new Cat();
  8. cat.sayHello();

    原型方式实现了属性和函数的共享，解决了工厂及构造函数的不能共享函数的问题，同时也带来了新的问题。原型方式不能通过构造函数初始化属性，当属性是常量或函数时没有问题，当属性为对象时此时多个对象就会共享此属性即所有对象的此属性指针指向同一对象。

 

例

  1. function Cat(){
  2. }
  3. Cat.prototype.name="Tom";
  4. Cat.prototype.legs=newArray("leftfront","leftbehind","rightfront","rightbehind");
  5. Cat.prototype.sayHello=function(){
  6. alert("喵喵！");
  7. }


此时Cat类型所有对象的legs属性都共享一个数组对象。

 

混合模式（原型和构造函数）

  1. function Cat(name,age){
  2. this.name=name;
  3. this.age=age;
  4. }
  5. Cat.prototype.sayHello=function(){
  6. alert("喵喵！");
  7. }
  8. var cat =new Cat("Tom",27);
  9. cat.sayHello();

动态原型

  1. function Cat(name,age){
  2. this.name=name;
  3. this.age=age;
  4. if(typeofCat.initialized=="undefined"){
  5. Cat.prototype.sayHello=function(){
  6. alert("喵喵！");
  7. }
  8. Cat._initialized=true;
  9. }
  10. }

该方法使用标志（_initialized）来判断是否已给原型赋予了任何方法。该方法只创建并赋值一次，与传统的OOP语言，这样的代码更像其它面向对象语言中的定义。

总结

javascript自定义对象主要解决的就是在创建对象时保证属性和方法的创建，并且该类型的所有都象都不共享属性而必须保证该类型的所有对象必须共享函数或方法。目前使用最广泛的是混合的构造函数/原型方式。此外，动态原型方式也很流行，在功能上与构造函数/原型方式等价。不过不要单独使用构造函数或原型模式，因为这两种方式往往会给代码引入问题。

相关文章