JavaScript 创建对象的六种常用方式详解

JavaScript 对象创建概述

前言：

随着 Web 2.0 时代的到来，以 Ajax 技术为代表的创新使得 JavaScript 摆脱了“玩具语言”的标签，成为 Web 开发的核心语言。尽管编程复杂度在降低，但用户对体验、性能、兼容性及可扩展性的要求日益严苛。在此背景下，Prototype、jQuery、ExtJs、Dojo 等优秀框架应运而生，极大地简化了 Web 开发流程。

越来越多的开发者深入钻研 JavaScript，企业对开发人员的技术要求也随之提高。回顾早期经历，仅能编写页面 UI 效果或表单验证已不足以体现竞争力。如今，若不了解 XMLHttpRequest、JSON 等核心技术，甚至不熟悉 JavaScript 的面向对象或基于对象的编程思想，很难被称为合格的 Web 程序员。无论是 Node.js 还是 MongoDB，其底层都离不开 JavaScript 的支持。

JavaScript 以其极高的灵活性著称，入门容易但精通困难。理解其面向对象（OOP）或基于对象的编程机制，是衡量开发者水平的重要分水岭。对于熟悉 Java、C#、C++ 等强类型面向对象语言的开发者而言，JavaScript 基于对象的编程方式往往令人困惑或难以适应。因此，本文将重点介绍 JavaScript 中几种常见的对象创建方式。

对象字面量创建法

1. 简单对象的创建：使用对象字面量 {} 是最简单、直观且推荐的方式。

var Cat = {};//JSON
Cat.name="kity";//添加属性并赋值
Cat.age=2;
Cat.sayHello=function(){
alert("hello "+Cat.name+",今年"+Cat["age"]+"岁了");//可以使用“.”的方式访问属性，也可以使用HashMap的方式访问
 }
Cat.sayHello();//调用对象的（方法）函数

构造函数创建法

2.1 创建一个对象，相当于 new 一个类的实例

function Person(){
}
var personOne=new Person();//定义一个function，如果有new关键字去"实例化",那么该function可以看作是一个类
personOne.name="dylan";
personOne.hobby="coding";
personOne.work=function(){
alert(personOne.name+" is coding now...");
}
personOne.work();

function Pet(name,age,hobby){
this.name=name;//this作用域：当前对象
this.age=age;
this.hobby=hobby;
this.eat=function(){
alert("我叫"+this.name+",我喜欢"+this.hobby+",也是个吃货");
   }
}
var maidou =new Pet("麦兜",5,"睡觉");//实例化/创建对象
maidou.eat();//调用eat方法(函数)

var wcDog =new Object();
wcDog.name="旺财";
wcDog.age=3;
wcDog.work=function(){
alert("我是"+wcDog.name+",汪汪汪......");
 }
wcDog.work();

function Dog(){
 }
Dog.prototype.name="旺财";
Dog.prototype.eat=function(){
alert(this.name+"是个吃货");
 }
var wangcai =new Dog();
wangcai.eat();

function Car(name,price){
this.name=name;
this.price=price;
}
Car.prototype.sell=function(){
alert("我是"+this.name+"，我现在卖"+this.price+"万元");
  }
var camry =new Car("凯美瑞",27);
camry.sell();

function Car(name,price){
this.name=name;
this.price=price;
if(typeof Car.sell=="undefined"){
Car.prototype.sell=function(){
alert("我是"+this.name+"，我现在卖"+this.price+"万元");
   }
Car.sell=true;
  }
}
var camry =new Car("凯美瑞",27);
camry.sell();

以上几种是 JavaScript 中最常用的对象创建方式。初学者可能会感到困惑或担忧，但实际上无需过度担心。掌握其中一两种即可，对其他方式理解其原理即可，这正是 JavaScript 灵活性的体现。每种方式均有其优缺点，并无绝对的最佳推荐，选择最适合自己理解和掌握的方式即可。此外，每个人的编码风格不同，未来若需研究 jQuery 源码或开发插件，理解他人的代码风格至关重要，而这些类库均建立在面向对象或基于对象的基础之上。