Javascript 面向对象 对象(Object)


Posted in Javascript onMay 13, 2010

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 相关文章推荐
一个JS的日期格式化算法示例
Jul 31 Javascript
javascript 小数取整简单实现方式
May 30 Javascript
JavaScript简介
Feb 15 Javascript
使用AngularJS 应用访问 Android 手机的图片库
Mar 24 Javascript
基于jquery animate操作css样式属性小结
Nov 27 Javascript
如何使用headjs来管理和异步加载js
Nov 29 Javascript
JS完成画圆圈的小球
Mar 07 Javascript
webpack-dev-server远程访问配置方法
Feb 22 Javascript
浅谈angular表单提交中ng-submit的默认使用方法
Sep 30 Javascript
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
Jan 22 Javascript
微信小程序实现发微博功能的示例代码
Jun 24 Javascript
Ant Design Pro 之 ProTable使用操作
Oct 31 Javascript
Javascript 面向对象 命名空间
May 13 #Javascript
javascript 面向对象 function类
May 13 #Javascript
该如何加载google-analytics(或其他第三方)的JS
May 13 #Javascript
Javascript 面向对象 继承
May 13 #Javascript
Javascript 面向对象 重载
May 13 #Javascript
JavaScript 面向对象的 私有成员和公开成员
May 13 #Javascript
限制文本框输入N个字符的js代码
May 13 #Javascript
You might like
一些使用频率比较高的php函数
2008/10/03 PHP
在phpstudy集成环境下的nginx服务器下配置url重写
2019/12/02 PHP
jquery ajax abort()的使用方法
2010/10/28 Javascript
《JavaScript高级程序设计》阅读笔记(一) ECMAScript基础
2012/02/27 Javascript
基于jQuery的弹出框插件
2012/03/18 Javascript
Jquery修改页面标题title其它JS失效的解决方法
2014/10/31 Javascript
node.js中的buffer.slice方法使用说明
2014/12/10 Javascript
jQuery中复合属性选择器用法实例
2014/12/31 Javascript
javascript实现复选框超过限制即弹出警告框的方法
2015/02/25 Javascript
jQuery模拟新浪微博首页滚动效果的方法
2015/03/11 Javascript
Javascript中With语句用法实例
2015/05/14 Javascript
使用plupload自定义参数实现多文件上传
2016/07/19 Javascript
运用js教你轻松制作html音乐播放器
2020/04/17 Javascript
微信小程序 实战小程序实例
2016/10/08 Javascript
vue裁切预览组件功能的实现步骤
2018/05/04 Javascript
JS前后端实现身份证号验证代码解析
2020/07/23 Javascript
Vue 组件的挂载与父子组件的传值实例
2020/09/02 Javascript
[02:11]完美世界DOTA2联赛10月28日赛事精彩集锦:来吧展示实力强劲
2020/10/29 DOTA
python模拟登录百度代码分享(获取百度贴吧等级)
2013/12/27 Python
Python 26进制计算实现方法
2015/05/28 Python
Python常用数据类型之间的转换总结
2019/09/06 Python
完美解决keras 读取多个hdf5文件进行训练的问题
2020/07/01 Python
python将数据插入数据库的代码分享
2020/08/16 Python
加拿大花店:1800Flowers.ca
2016/11/16 全球购物
办公室打字员岗位职责
2014/04/16 职场文书
连带责任保证书
2014/04/29 职场文书
机电一体化毕业生自荐信
2014/06/19 职场文书
个人授权委托书样本
2014/09/13 职场文书
三严三实学习心得体会
2014/10/13 职场文书
作风建设年活动实施方案
2014/10/24 职场文书
收入证明申请书
2015/06/12 职场文书
党员身份证明材料
2015/06/19 职场文书
MySQL开启事务的方式
2021/06/26 MySQL
详解redis在微服务领域的贡献
2021/10/16 Redis
浅谈Python中对象是如何被调用的
2022/04/06 Python
联想win10摄像头打不开怎么办?win10笔记本摄像头打不开解决办法
2022/04/08 数码科技