JavaScript 创建对象


Posted in Javascript onJuly 17, 2009

第一种:JSON方式/对象直接量
格式:
var 对象名 = {
变量1: 变量1的值,
变量1: 变量1的值,
……,
函数1: function() {
函数体
},
函数2: function() {
函数体
}//Note:最后的逗号要去除为了和IE兼容。
};
说明:
(1) 大括号内直接填写变量或者函数;
(2) 对象的内容与值以冒号分隔,成对出现;
(3) 包含的变量或者函数之间以逗号分隔;
(4) 函数需要写在function(){}的大括号之内。
例子:
var 对象名 = {
name: “Vicky”,
age: 26,
eat: function() {
alert(‘I wanna eat meat');
},
sleep: function() {
alert(‘I wanna sleep');
}
};
注释:类似的方式也叫做匿名类
匿名类举例:
{
index: '//',
reg: new RegExp('^//.*$'),
css: "comment"
}
上面的方式创建了类,只是没赋给一个变量而已。
第二种:function方式
格式:
function data() {
this.变量1=变量1的值;
this.变量2=变量2的值;
……;
this.函数1= function() {
函数体
};
this.函数2= function() {
函数体
};
}
说明:
(1) 其内的变量或者函数前必需写上this关键字;
(2) 对象的内容与值以等号分隔,成对出现;
(3) 包含的变量或者函数之间以分号分隔。
(4) 函数需要写在function(){}的大括号之内。
例子:
function data() {
this.name=“Vicky””;
this.age=26;
this.eat=function() {
alert(‘I wanna eat meat');
};
this.sleep=function() {
alert(‘I wanna sleep');
};
}
第三种:原型方式
格式:
var 对象名 = {};
对象名.prototype.变量1=变量1的值;
对象名.prototype.变量2=变量2的值;
……;
对象名.prototype.函数1= function() {
函数体
};
对象名.prototype.函数2= function() {
函数体
};
……;
说明:
(1) 初始对象体内可以不定义任何东西;
(2) 在要定义的变量前加“对象名.prototype.”的格式;
(3) 对象的内容与值以等号分隔,成对出现;
(4) 包含的变量或者函数之间以分号分隔,也可以省去分号。
(5) 函数需要写在function(){}的大括号之内。
例子:
var data = {};
data.prototype. name ="Vicky”;
data.prototype. age =20;
data.prototype. eat = function() {
alert(‘I wanna eat meat');
};
data.prototype. sleep= function() {
alert(‘I wanna sleep');
};
第四种:create方式
该方式利用了Prototype JavaScript组件库。
格式:
var 对象名 = Class.create();
Object.extend(对象名.prototype, {
变量1: 变量1的值,
变量1: 变量1的值,
……,
函数1: function() {
函数体
},
函数2: function() {
函数体
},
……
});
说明:
(1) 对象的创建使用了Prototype库中的Class.create()函数;
(2) 对象的内容使用Prototype库中的Object.extend()函数来扩展;
(3) 被扩展的对象在传入Object.extend函数时一定要带上prototype,
(4) 扩展内容被大括号包含,其内与JSON方式的定义格式完全相同。
例子:
var data = Class.create();
Object.extend(dta.prototype, {
name: "Vicky",
age: 20,
eat: function() {
alert(‘I wanna eat meat');
},
sleep: function() {
alert(‘I wanna sleep');
}
});
其实,JS对象的定义还有其它的方式,你也可以用上面4种进行组合定义,这显出了JS作为动态语言的自由性。
JS对象的创建正规方法如下:
var d1 = new Data();
JS对象变量的引用方式有两种:
(1) 点号方式引用,如,data.name。
(2) 数组方式引用,如,data[‘name']。

Javascript 相关文章推荐
超级酷和最实用的jQuery实例收集(20个)
Apr 21 Javascript
Javascript+CSS实现影像卷帘效果思路及代码
Oct 20 Javascript
jquery实现的伪分页效果代码
Oct 29 Javascript
canvas学习之API整理笔记(一)
Dec 29 Javascript
vuejs使用$emit和$on进行组件之间的传值的示例
Oct 04 Javascript
vue使用keep-alive实现数据缓存不刷新
Oct 21 Javascript
利用ES6实现单例模式及其应用详解
Dec 09 Javascript
关于Google发布的JavaScript代码规范你要知道哪些
Apr 04 Javascript
JavaScript中将值转换为字符串的五种方法总结
Jun 06 Javascript
JS实现简单省市二级联动
Nov 27 Javascript
解决Vue 移动端点击出现300毫秒延迟的问题
Jul 21 Javascript
antd配置config-overrides.js文件的操作
Oct 31 Javascript
prototype 学习笔记整理
Jul 17 #Javascript
表单元素事件 (Form Element Events)
Jul 17 #Javascript
优化 JavaScript 代码的方法小结
Jul 16 #Javascript
Javascript 事件流和事件绑定
Jul 16 #Javascript
js 对象是否存在判断
Jul 15 #Javascript
js 实现无缝滚动 兼容IE和FF
Jul 15 #Javascript
兼容IE/Firefox/Opera/Safari的检测页面装载完毕的脚本Ext.onReady的实现
Jul 14 #Javascript
You might like
php生成随机数或者字符串的代码
2008/09/05 PHP
PHP 多维数组排序(usort,uasort)
2010/06/30 PHP
php实现根据身份证获取精准年龄
2020/02/26 PHP
Bootstrap教程JS插件弹出框学习笔记分享
2016/05/17 Javascript
jquery获取input type=text中的值的各种方式(总结)
2016/12/02 Javascript
Vue系列:通过vue-router如何传递参数示例
2017/01/16 Javascript
JS简单获取当前年月日星期的方法示例
2017/02/07 Javascript
Bootstrap模态窗口源码解析
2017/02/08 Javascript
React 子组件向父组件传值的方法
2017/07/24 Javascript
Vue中v-show添加表达式的问题(判断是否显示)
2018/03/26 Javascript
mpvue小程序循环动画开启暂停的实现方法
2019/05/15 Javascript
小程序实现锚点滑动效果
2019/09/23 Javascript
使用layer弹窗提交表单时判断表单是否输入为空的例子
2019/09/26 Javascript
详解如何在JS代码中消灭for循环
2019/12/11 Javascript
vue项目前端微信JSAPI与外部H5支付相关实现过程及常见问题
2020/04/14 Javascript
微信小程序之导航滑块视图容器功能的实现代码(简单两步)
2020/06/19 Javascript
python调用java的Webservice示例
2014/03/10 Python
Python实现SVN的目录周期性备份实例
2015/07/17 Python
python中pygame针对游戏窗口的显示方法实例分析(附源码)
2015/11/11 Python
Python使用win32com实现的模拟浏览器功能示例
2017/07/13 Python
Python对列表去重的多种方法(四种方法)
2017/12/05 Python
浅述python2与python3的简单区别
2018/09/19 Python
利用python和百度地图API实现数据地图标注的方法
2019/05/13 Python
Python之虚拟环境virtualenv,pipreqs生成项目依赖第三方包的方法
2019/07/23 Python
使用Python刷淘宝喵币(低阶入门版)
2019/10/30 Python
配置python的编程环境之Anaconda + VSCode的教程
2020/03/29 Python
python实现三壶谜题的示例详解
2020/11/02 Python
python+playwright微软自动化工具的使用
2021/02/02 Python
在使用非全零作为空指针内部表达的机器上, NULL是如何定义
2014/11/09 面试题
毕业生简单求职信
2013/11/19 职场文书
自我鉴定三原则
2014/01/13 职场文书
20年同学聚会感言
2014/02/03 职场文书
岗位职责风险点
2014/03/12 职场文书
公司爱心捐款倡议书
2014/05/14 职场文书
2014年干部作风建设总结
2014/10/23 职场文书
MySQL中CURRENT_TIMESTAMP的使用方式
2021/11/27 MySQL