(1)直接使用{}创建对象
var Cat = {
name: "大毛",
makeSound: function(){ alert("喵喵喵"); }
};
alert(Cat.name);
对于直接使用{}创建对象..这种情况在创建极少数对象的情况下且不需要封装的情况下使用。{}可以算做一个单例(单例模式);
(2)Object.create()法
对直接使用{}的改进:
为了解决"构造函数法"的缺点,更方便地生成对象,Javascript的国际标准ECMAScript第五版(目前通行的是第三版),提出了一个新的方法Object.create()。
用这个方法,"类"就是一个对象,不是函数。
var Cat = {
name: "大毛",
makeSound: function(){ alert("喵喵喵"); }
};
然后,直接用Object.create()生成实例,不需要用到new。
var cat1 = Object.create(Cat);
alert(cat1.name); // 大毛
cat1.makeSound(); // 喵喵喵
目前,各大浏览器的最新版本(包括IE9)都部署了这个方法。如果遇到老式浏览器,可以用下面的代码自行部署。
if (!Object.create) {
Object.create = function (o) {
function F() {}
F.prototype = o;
return new F();
};
}
这种方法比"构造函数法"简单,但是不能实现私有属性和私有方法,实例对象之间也不能共享数据,对"类"的模拟不够全面。
(3)生成对象的原始模式
function Cat(name,color){
return {
name:name,
color:color
}
}
然后生成实例对象,就等于是在调用函数:
var cat1 = Cat("大毛","黄色");
var cat2 = Cat("二毛","黑色");
这种方法的问题依然是,cat1和cat2之间没有内在的联系,不能反映出它们是同一个原型对象的实例。
(4)极简主义法
1) 封装
这种方法不使用this和prototype,代码部署起来非常简单,这大概也是它被叫做"极简主义法"的原因。
首先,它也是用一个对象模拟"类"。在这个类里面,定义一个构造函数createNew(),用来生成实例。
var Cat = {
createNew: function(){
// some code here
}
};
然后,在createNew()里面,定义一个实例对象,把这个实例对象作为返回值。
var Cat = {
createNew: function(){
var cat = {};
cat.name = "大毛";
cat.makeSound = function(){ alert("喵喵喵"); };
return cat;
}
};
使用的时候,调用createNew()方法,就可以得到实例对象。
var cat1 = Cat.createNew();
cat1.makeSound(); // 喵喵喵
这种方法的好处是,容易理解,结构清晰优雅,符合传统的"面向对象编程"的构造,因此可以方便地部署下面的特性。
2) 继承
让一个类继承另一个类,实现起来很方便。只要在前者的createNew()方法中,调用后者的createNew()方法即可。
先定义一个Animal类。
var Animal = {
createNew: function(){
var animal = {};
animal.sleep = function(){ alert("睡懒觉"); };
return animal;
}
};
然后,在Cat的createNew()方法中,调用Animal的createNew()方法。
var Cat = {
createNew: function(){
var cat = Animal.createNew();
cat.name = "大毛";
cat.makeSound = function(){ alert("喵喵喵"); };
return cat;
}
};
这样得到的Cat实例,就会同时继承Cat类和Animal类。
var cat1 = Cat.createNew();
cat1.sleep(); // 睡懒觉
3) 私有属性和私有方法
在createNew()方法中,只要不是定义在cat对象上的方法和属性,都是私有的。
var Cat = {
createNew: function(){
var cat = {};
var sound = "喵喵喵";
cat.makeSound = function(){ alert(sound); };
return cat;
}
};
上例的内部变量sound,外部无法读取,只有通过cat的公有方法makeSound()来读取。
var cat1 = Cat.createNew();
alert(cat1.sound); // undefined
4)数据共享
有时候,我们需要所有实例对象,能够读写同一项内部数据。这个时候,只要把这个内部数据,封装在类对象的里面、createNew()方法的外面即可。
var Cat = {
sound : "喵喵喵",
createNew: function(){
var cat = {};
cat.makeSound = function(){ alert(Cat.sound); };
cat.changeSound = function(x){ Cat.sound = x; };
return cat;
}
};
然后,生成两个实例对象:
var cat1 = Cat.createNew();
var cat2 = Cat.createNew();
cat1.makeSound(); // 喵喵喵
这时,如果有一个实例对象,修改了共享的数据,另一个实例对象也会受到影响。
cat2.changeSound("啦啦啦");
cat1.makeSound(); // 啦啦啦
(5)构造函数的模式:
所谓"构造函数",其实就是一个普通函数,但是内部使用了this变量。对构造函数使用new运算符,就能生成实例,并且this变量会绑定在实例对象上。
比如,猫的原型对象现在可以这样写,
function Cat(name,color){
this.name = name;
this.color = color;
this.type = "猫科动物";
this.eat = function(){alert("吃老鼠");};
}
我们现在就可以生成实例对象了。
var cat1 = new Cat("大毛","黄色");
var cat2 = new Cat ("二毛","黑色");
alert(cat1.type); // 猫科动物
cat1.eat(); // 吃老鼠
这时cat1和cat2会自动含有一个constructor属性,指向它们的构造函数。
alert(cat1.constructor == Cat); //true
alert(cat2.constructor == Cat); //true
Javascript还提供了一个instanceof运算符,验证原型对象与实例对象之间的关系。
alert(cat1 instanceof Cat); //true
alert(cat2 instanceof Cat); //true
表面上好像没什么问题,但是实际上这样做,有一个很大的弊端。那就是对于每一个实例对象,type属性和eat()方法都是一模一样的内容,每一次生成一个实例,都必须为重复的内容,多占用一些内存。这样既不环保,也缺乏效率。
alert(cat1.eat == cat2.eat); //false
能不能让type属性和eat()方法在内存中只生成一次,然后所有实例都指向那个内存地址呢?回答是可以的。
(6)Prototype模式
Javascript规定,每一个构造函数都有一个prototype属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的实例继承。
这意味着,我们可以把那些不变的属性和方法,直接定义在prototype对象上。
function Cat(name,color){
this.name = name;
this.color = color;
}
Cat.prototype.type = "猫科动物";
Cat.prototype.eat = function(){alert("吃老鼠")};
然后,生成实例。
var cat1 = new Cat("大毛","黄色");
var cat2 = new Cat("二毛","黑色");
alert(cat1.type); // 猫科动物
cat1.eat(); // 吃老鼠
这时所有实例的type属性和eat()方法,其实都是同一个内存地址,指向prototype对象,因此就提高了运行效率。
alert(cat1.eat == cat2.eat); //true
总结:
对于直接使用{}创建对象..这种情况在创建极少数对象的情况下且不需要封装的情况下使用,对于需要批量创建对象的情况使用构造函数来实例化对象就非常方便 主要还是看具体的情况吧
这两种是完全不一样的东西。
{}可以算做一个单例(单例模式)
function(){} 这种返回一个对象。每次都NEW的时候返回都是一个不同的对象!
上面有同学也说了 {} 更效率了。而且不用new。{} 全局固定,可任意扩展。
一般来说{}确实效率高,使用简单随意,不过不想暴漏某些方法时候用 function 更好
函数定义
函数是由这样的方式进行声明的:关键字 function、函数名、一组参数,以及置于括号中的待执行代码。
函数的构造语法有这三种:
Js代码
复制代码 代码如下:
1.function functionName(arg0, arg1, ... argN) { statements }//function语句
2.var function_name = new Function(arg1, arg2, ..., argN, function_body);//Function()构造函数
3.var func = function(arg0, arg1, ... argN) { statements };//函数直接量
示例:
Js代码
复制代码 代码如下:
1.function f(x){return x*x};//function语句
2.var f = new Function("x","return x*x;");//Function()构造函数
3.var f = function(x){return x*x;};//函数直接量
分享到:
相关推荐
Javascript对象定义的几种方式
提起面向对象我们就能...javaScript中创建自己的类和对象,我们应该是必须掌握的,我们都知道javaScript中对象的属性可以在对象创建后动态定义,比如下面的代码: 代码如下:[removed] //定义 var oCar = new Objec
JAVASCRIPT中定义对象的几种方式.pdf
主要介绍了JS函数的几种定义方式,实例分析了JavaScript四种函数定义方式及具体的使用技巧,需要的朋友可以参考下
工厂方式 javaScript中创建自己的类和对象,我们应该是必须掌握的,我们都知道javaScript中对象的属性可以在对象创建后动态定义,比如下面的代码: 代码如下: [removed] //定义 var oCar = new Object();
本文实例讲述了JS定义函数的几种常用方法。分享给大家供大家参考,具体如下: 在 JavaScript 语言里,函数是一种对象,所以可以说函数是 JavaScript 里的一等公民(first-class citizens)。 之前我们这样定义过一个...
前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/
前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/
详解js创建对象的几种方式和对象方法 这篇文章是看js红宝书第8章,记的关于对象的笔记(第二篇)。 创建对象的几种模式: 工厂是函数的意思。工厂模式核心是定义一个返回全新对象的函数。 function getObj...
下面小编就为大家带来一篇js定义类的几种方法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
其实很简单,看一看JavaScript运行机制就会明白。我们可以把这种现象看做“预声明”。但是如果稍微深究一下,会明白得更透彻。 这里其实涉及到对象属性绑定机制。因为所有JavaScript函数都是一个对象。在函数里声明...
04 React事件 方法、 React定义方法的几种方式 获取数据 改变数据 执行方法传值
下面小编就为大家带来一篇浅谈几种常用的JS类定义方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧