Js 创建对象的几种方式

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>create object</title>
<script type="text/javascript">
//the method to create object in js
//method 1
document.write('------------------method 1---------------------------------<br/>');
var myObj = {
    'id':1,
    'name':'zhangsan',
    'age':23,
    'getAge':function(){
            document.write(this.age);//在方法中调用对象中的其他属性时,要加this this.age = this['age']
            document.write(this['age']);
            document.write('<br/>');
        }
};
myObj.getAge();//调用对象中的函数属性时 函数要加括号  result:2323
var tempFun = myObj.getAge;// 这是一种赋值行为
tempFun();//方法的调用   result:undefinedundefined


//method 2 
document.write('------------------method 2---------------------------------<br/>');
function myClass(){
    var id = 1;
    var name = 'zhangsan';
    var age = 23;
    document.write(name+'myClass<br/>');
};
var my = new myClass();
myClass();// 仅是一个简单的函数 且其中的id name 属性都是局部变量,不能在外部调用

function _myClass(){
    this.id = 1;
    this.name = 'zhangsan';
    this.age = 23;
    this.getName = function(){
        document.write(this.name+'_myClass.getName<br/>');
        }
}
var myClazz = new _myClass();
myClazz.getName();
_myClass();
//总结:用function创建对象 
//要求:1.其中属性和方法要用this.限制 
//        2.声明调用时,普通的函数中var myClazz = new _myClass()和_myClass();的效果相同 推荐使用第二种方法
//                     在function声明的类中也可以使用上面的两种方法,但是只有用第一种方法草可以调用对象中的属性和方法,所以推荐使用第一种方法

//method 3 
document.write('------------------method 3---------------------------------<br/>');
function myClass_3(){
    var obj = {
        'id' :1,
        'name':'zhangsan'
            }
    return obj;
}

function myClass_4(){
    var obj = new Object();
    obj.id=1;
    obj.name='zhangsan';
    return obj;
}
var my_3 = new myClass_3();
document.write(my_3.id+'<br/>');
var my_4 = new myClass_4();
document.write(my_4.name+'<br/>');
//method 4
document.write('------------------method 4---------------------------------<br/>');
//工厂方式
var car = new Object();
car.color = 'red';
car.doors = 4;
car.getInfo = function(){
    document.write(this.color + '------'+this.doors);
}
car.getInfo();
//创建多个car 修改myClass_4 _myClass
function myClass_4(id,name){
    var obj = new Object();
    obj.id=id;
    obj.name=name;
    return obj;
}

function _myClass(id,name,age){
    this.id = id;
    this.name = name;
    this.age = age;
    this.getName = function(){
        document.write(this.name+'_myClass.getName<br/>');
        }
}
var my_4 = new myClass_4(12,'fancy');
document.write(my_4.name+'修改后的myclass4<br/>');
var my_5 = new _myClass(100,'fancy00',23);
document.write(my_5.name+'修改后的_myclass<br/>');
</script>
</head>
<body>

</body>
</html>

其他更多的可以参考 http://www.cnblogs.com/tiwlin/archive/2009/08/06/1540161.html

posted @ 2015-01-27 13:37  红竹无泪  阅读(162)  评论(0编辑  收藏  举报