以下4种方式，是我在项目中最常见的JavaScript的面向对象的方式的开发。
测试一般在微软的工具：http://www.typescriptlang.org/Playground
进行测试，或者使用Firefox+FireBug 或者 WebStorm
。。。。。。。说了一大堆废话，我现在还是倾向使用typescript进行一般常规项目的开发了。。。。。。。。。。。。。。。。。。。
http://www.typescriptlang.org
1. （我在项目中最常用的）
基于 new 的方式创建
1 var Greeter = (function () {
2 function Greeter(message) {
3 this.greeting = message;
4 }
5 Greeter.prototype.greet = function () {
6 return "Hello, " + this.greeting;
7 };
8 return Greeter;
9 }());
10 var greeter = new Greeter("world");
11 var button = document.createElement(‘button‘);
12 button.textContent = "Say Hello";
13 button.onclick = function () {
14 alert(greeter.greet());
15 };
16 document.body.appendChild(button);
或者
1 function UserModel() {
2 this.username = ‘‘;
3 this.pwd = ‘‘;
4 return this;
5 }
6 var model = new UserModel();
7 model.username = ‘AAAAAAAA‘;
8 var button = document.createElement(‘button‘);
9 button.textContent = "Say Hello";
10 button.onclick = function () {
11 alert(model.username);
12 };
13 document.body.appendChild(button);
2. 基于工厂的方式：
1 function CreateUserModel(user, pwd) {
2 var obj = new Object(); //或者 var obj={};
3 obj.user = user;
4 obj.pwd = pwd;
5 obj.getNewInstance = function () {
6 return CreateUserModel(‘‘, ‘‘);
7 };
8 return obj;
9 }
10 var model = CreateUserModel(‘a‘, ‘bb‘);
11 var button = document.createElement(‘button‘);
12 button.textContent = "Say Hello";
13 button.onclick = function () {
14 alert(model.pwd);
15 };
16 document.body.appendChild(button);
3.基于动态注册属性的方式
1 function UserModel() {
2 }
3 UserModel.prototype.username = ‘aaaaaaaa‘;
4 UserModel.prototype.pwd = ‘gggggggggggg‘;
5 var model = new UserModel();
6 model.username = ‘AAAAAAAA‘;
7 var button = document.createElement(‘button‘);
8 button.textContent = "Say Hello";
9 button.onclick = function () {
10 alert(model.username);
11 };
12 document.body.appendChild(button);
4.基于Json的方式
1 var UserModel={
2 username:‘‘,
3 pwd:‘‘,
4 chids:[],
5 id:0,
6
7 createNew:function(){
8 var obj={};
9 //foreach 遍历普通属性
10 for(var p in UserModel){
11 if ( typeof(UserModel[p])!= "function" ){
12 var pname=p;
13 obj[pname]=UserModel[p];
14 }
15
16
17 }
18 }
19 };
20
21
22
23 var model= UserModel;
24 model.username=‘BBBBBBBB‘
25 var button = document.createElement(‘button‘);
26 button.textContent = "Say Hello";
27 button.onclick = function () {
28 alert(model.id);
29 };
30
31 document.body.appendChild(button);
javascript的强大两个关键词：this new
简单的说，js里面 所有的数据类型 都是Object派生的。Function类型也不例外。当调用一个funtion的时候，this 指向当前的funtion对象。
new 按照javascript语言精粹中所说，如果在一个函数前面带上new来调用该函数，那么将创建一个隐藏连接到该函数的prototype成员的新对象，同时this将被绑定到那个新对象上。
参考：http://www.cnblogs.com/RitaRichard/archive/2011/10/12/2208902.html
按照javascript语言精粹中所说，如果在一个函数前面带上new来调用该函数，那么将创建一个隐藏连接到该函数的prototype成员的新对象，同时this将被绑定到那个新对象上。这个话很抽象，我想用实例来让自己加深理解。
1.如果就一个函数，没有返回值，没有prototype成员，然后使用new,会是什么结果呢？如果一个函数没有返回值，那么如果不使用new来创建变量，那么该变量的值为undefined.如果用了new，那么就是Object.说明一个函数的默认的Prototype是Object.
function Test1(str) { this.a = str; } var myTest = new Test1("test1"); alert(myTest); //[object Object] function Test1WithoutNew(str) { this.a = str; } var myTestWithoutNew = Test1WithoutNew("test1"); alert(myTestWithoutNew); //undefined;
2.如果函数有返回值，但是返回值是基本类型。那么new出来的myTest还是object.因为基本类型的prototype还是Object. 而如果不使用new，那么返回值就是string的值。
function Test1(str) { this.a = str; return this.a; } var myTest = new Test1("test1"); alert(myTest); //Object function Test1WithoutNew(str) { this.a = str; return this.a; } var myTestWithoutNew = Test1WithoutNew("test1"); alert(myTestWithoutNew); //"test1"
3。如果函数的返回值为new出来的对象，那么myTest的值根据new出来的对象的prototype而定。
function Test1(str) { this.a = str; return new String(this.a); } var myTest = new Test1("test1"); alert(myTest); //String "test1"
4。接下来我们开始讨论new中的this。如果我们给Test1的prototype中加入一个方法叫get_string(),那么get_string()中的this指的就是这个新对象。能够得到在new时候赋予该对象的属性值。
var Test2 = function(str) { this.a = str; }Test2.prototype.get_string = function () { return this.a; };var myTest2 = new Test2("test2"); alert(myTest2.get_string()); //“test2” var Test2 = function(str) { this.a = str; }Test2.prototype.get_string = function () { return this.a; };var myTest2 = Test2("test2"); alert(myTest2）//undefined
5。如果我们修改了函数的prototype,又会发生什么样的情况呢？ 那么就会发生类似继承的功能，其实就是js的伪类实现。
function Test1(str) { this.b = str; } Test1.prototype.Get_Test1String = function () { return this.b; };var Test2 = function(str) { this.a = str; } Test2.prototype = new Test1("test1"); Test2.prototype.get_string = function () { return this.a; };var myTest2 = new Test2("test2"); alert(myTest2); //Object alert(myTest2.get_string()); //"test2" alert(myTest2.Get_Test1String()); //"test1"