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 相关文章推荐
javascript 清除输入框中的数据
Apr 13 Javascript
写出更好的JavaScript程序之undefined篇(中)
Nov 23 Javascript
jQuery建立一个按字母顺序排列的友好页面索引(兼容IE6/7/8)
Feb 26 Javascript
JS正则验证邮箱的格式详细介绍
Nov 19 Javascript
浅析JavaScript中两种类型的全局对象/函数
Dec 05 Javascript
Angular的事件和表单详解
Dec 26 Javascript
js生成随机数方法和实例
Jan 17 Javascript
让bootstrap的carousel支持滑动滚屏的实现代码
Nov 27 Javascript
js断点调试经验分享
Dec 08 Javascript
vue解决使用webpack打包后keep-alive不生效的方法
Sep 01 Javascript
详解react-refetch的使用小例子
Feb 15 Javascript
vue element 生成无线级左侧菜单的实现代码
Aug 21 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强制文件下载而非在浏览器打开的自定义函数分享
2014/05/08 PHP
smarty简单应用实例
2015/11/03 PHP
让AJAX不依赖后端接口实现方案
2012/12/03 Javascript
jQuery中removeClass()方法用法实例
2015/01/05 Javascript
jQuery实现鼠标经过事件的延时处理效果
2020/08/20 Javascript
解决jquery插件:TypeError:$.browser is undefined报错的方法
2015/11/21 Javascript
浅谈jquery中使用canvas的问题
2016/10/10 Javascript
VUE实现日历组件功能
2017/03/13 Javascript
从零开始学习Node.js系列教程之基于connect和express框架的多页面实现数学运算示例
2017/04/13 Javascript
为你的微信小程序体积瘦身详解
2017/05/20 Javascript
浅谈js闭包理解
2019/04/01 Javascript
详解async/await 异步应用的常用场景
2019/05/13 Javascript
微信小程序获取地理位置及经纬度授权代码实例
2019/09/18 Javascript
[22:59]VGJ.S vs VG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python list语法学习(带例子)
2013/11/01 Python
Scrapy-redis爬虫分布式爬取的分析和实现
2017/02/07 Python
python实现读Excel写入.txt的方法
2018/04/29 Python
Python图像处理之简单画板实现方法示例
2018/08/30 Python
python实现得到当前登录用户信息的方法
2019/06/21 Python
css3 仿写阿里云水纹效果的示例代码
2018/02/10 HTML / CSS
英国优质鞋类专家:Robinson’s Shoes
2017/12/08 全球购物
数据库的约束含义
2012/09/09 面试题
电子商务专业实习生自我鉴定
2013/09/24 职场文书
校长岗位职责
2013/11/26 职场文书
工程专业毕业生自荐信范文
2013/12/25 职场文书
销售内勤岗位职责
2014/04/15 职场文书
实习生评语
2014/04/26 职场文书
儿童生日会策划方案
2014/05/15 职场文书
酒后驾车标语
2014/06/30 职场文书
暑假安全教育广播稿
2014/09/10 职场文书
2016大学生党校学习心得体会
2016/01/06 职场文书
六年级语文教学反思
2016/03/03 职场文书
MYSQL 无法识别中文的永久解决方法
2021/06/03 MySQL
MySQL高级进阶sql语句总结大全
2022/03/16 MySQL
十大公认最好看的动漫:《咒术回战》在榜,《钢之炼金术师》第一
2022/03/18 日漫
零基础学java之方法的定义与调用详解
2022/04/10 Java/Android