javascript中的对象创建 实例附注释


Posted in Javascript onFebruary 08, 2011

javascript中的对象创建声明:
var obj = {}; 或者 var obj = new Object(); 
为对象加入属性,方法:
//=====第一种写法====================================

obj.name = '小明'; //为对象加属性
obj.updateName = function(name){//为对象定义updateName方法
this.name = name;
}
alert(obj.name);
obj.updateName("小强"); //调用updateName修改obj对象的name属性值
alert(obj['name']);
第一次显示结果为:小明
第二次显示结果为:小强
//=====第二种写法====================================
obj['name'] = '张三'; //为对象加属性
obj['updateName'] = function(name){//为对象定义updateName方法
obj['name'] =name;
}; 
alert(obj.name);
obj.updateName('李四'); //调用updateName修改obj对象的name属性值
alert(obj['name']);
第一次显示结果为:张三
第二次显示结果为:李四
//=====第三种写法====================================
var obj = {
name: '王五', //为对象加属性
updateName: function(name){//为对象定义updateName方法
this.name = name;


}
};
alert(obj .name);
obj.updateName("赵六"); //调用updateName修改obj对象的name属性值
alert(obj .name);
第一次显示结果为:王五
第二次显示结果为:赵六
//=====分析=====================================
第一种写法是最普通的对象写法,因为javascript是动态语言,与Java和.Net不同,
在程序运行并创建对象后,还可以对该对象的内部结构进行修改,
比如添加属性和方法(java和.net中的反射机制做不到这点)。
(a): var obj = {} || new Object();
(b):obj.name = "张三";
(c):obj.updateName = function(name){ this.name = name};

当程序执行(a) 后,便创建了一个空对象(不包含任何方法和属性)obj,
当程序执行(b) 后,改变了obj的内部结构,加了一个属性name,
当程序执行(c) 后,改变了obj的内部结构,加了一个方法updateName ,
而这都是在运行的时候完成的动作

第二种写法像数组,但绝不是数组,区分是不是数组可以如此判断:
if(typeof(obj.length) == "undefined") {
alert("obj不是数组,数组都有length属性!");
}else{
alert("obj是数组!");
}
第二种写法更像一种数据结构:map ,如:obj[key] = value;
key是字符串,value可以是任何类型,变量,对象,函数等。
可以通过这种方式遍历对象内部结构:
for(var key in obj)
{
alert(key);
var value = obj[key];
alert(value);
}
通过alert可以显示出你所定义的内容。
第三种写法一看就是map的内部结构了,一个对象,内部完全用key : value键值对方式表示
JSON对象也是这种结构,只要对map或者JSON对象有所熟悉的就很容易理解了。

Javascript 相关文章推荐
jQuery asp.net 用json格式返回自定义对象
Apr 07 Javascript
javascript实现根据时间段显示问候语的方法
Jun 18 Javascript
js控制文本框输入的字符类型方法汇总
Jun 19 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
Jul 29 Javascript
jQuery实现带延时功能的水平多级菜单效果【附demo源码下载】
Sep 21 Javascript
javascript中活灵活现的Array对象详解
Nov 30 Javascript
javascript判断元素存在和判断元素存在于实时的dom中的方法
Jan 17 Javascript
js获取浏览器的各种属性
Apr 27 Javascript
AngularJs每天学习之总体介绍
Aug 07 Javascript
django中使用vue.js的要点总结
Jul 07 Javascript
react-router-dom 嵌套路由的实现
May 02 Javascript
Vue组件简易模拟实现购物车
Dec 21 Vue.js
kmock javascript 单元测试代码
Feb 06 #Javascript
一次失败的jQuery优化尝试小结
Feb 06 #Javascript
DOM_window对象属性之--clipboardData对象操作代码
Feb 03 #Javascript
基于jQuery的自动完成插件
Feb 03 #Javascript
jQuery初学:find()方法及children方法的区别分析
Jan 31 #Javascript
javascript event 事件解析
Jan 31 #Javascript
javascript getElementsByTagName
Jan 31 #Javascript
You might like
YII框架行为behaviors用法示例
2019/04/26 PHP
javascript数组使用调用方法汇总
2007/12/08 Javascript
javascript版的in_array函数(判断数组中是否存在特定值)
2014/05/09 Javascript
JavaScript 学习笔记之操作符(续)
2015/01/14 Javascript
jQuery 1.9.1源码分析系列(十)事件系统之绑定事件
2015/11/19 Javascript
js实现简单排列组合的方法
2016/01/27 Javascript
JS实现鼠标滑过显示边框的菜单效果
2016/09/21 Javascript
jQuery验证表单格式的使用方法
2017/01/10 Javascript
vue.js父组件使用外部对象的方法示例
2017/04/25 Javascript
BootStrap给table表格的每一行添加一个按钮事件
2017/09/07 Javascript
详解JS构造函数中this和return
2017/09/16 Javascript
jQuery length 和 size()区别总结
2018/04/26 jQuery
JS将时间秒转换成天小时分钟秒的字符串
2019/07/10 Javascript
js实现窗口全屏示例详解
2019/09/17 Javascript
react-native 实现购物车滑动删除效果的示例代码
2021/01/15 Javascript
[00:23]魔方之谜解锁款式
2018/12/20 DOTA
python中global与nonlocal比较
2014/11/21 Python
python使用多线程不断刷新网页的方法
2015/03/31 Python
python使用wxPython打开并播放wav文件的方法
2015/04/24 Python
python中self原理实例分析
2015/04/30 Python
利用python发送和接收邮件
2016/09/27 Python
Python爬虫实现网页信息抓取功能示例【URL与正则模块】
2017/05/18 Python
Python实现XML文件解析的示例代码
2018/02/05 Python
Python使用pyodbc访问数据库操作方法详解
2018/07/05 Python
Python开发网站目录扫描器的实现
2019/02/21 Python
Python中正则表达式的用法总结
2019/02/22 Python
Python django框架开发发布会签到系统(web开发)
2020/02/12 Python
Jupyter Notebook远程登录及密码设置操作
2020/04/10 Python
python 已知平行四边形三个点,求第四个点的案例
2020/04/12 Python
HTML5 中新的全局属性(整理)
2013/07/31 HTML / CSS
交通安全责任书范本
2014/07/24 职场文书
校长创先争优承诺书
2014/08/30 职场文书
树转促学习心得体会
2014/09/10 职场文书
2014年小学教研工作总结
2014/12/06 职场文书
装饰技术负责人岗位职责
2015/04/13 职场文书
优秀团员主要事迹范文
2015/11/05 职场文书