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 相关文章推荐
JQuery EasyUI 对话框的使用方法
Oct 24 Javascript
jQuery EasyUI API 中文文档 - ProgressBar 进度条
Sep 29 Javascript
让AJAX不依赖后端接口实现方案
Dec 03 Javascript
javascript动态创建及删除元素的方法
Dec 22 Javascript
javascript作用域链(Scope Chain)用法实例解析
Nov 30 Javascript
JavaScript Date对象详解
Mar 01 Javascript
JavaScript实现带播放列表的音乐播放器实例分享
Mar 07 Javascript
vue实现通讯录功能
Jul 14 Javascript
对Vue beforeRouteEnter 的next执行时机详解
Aug 25 Javascript
详解超简单的react服务器渲染(ssr)入坑指南
Feb 28 Javascript
Layui 解决表格异步调用后台分页的问题
Oct 26 Javascript
node 版本切换的实现
Feb 02 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_SELF的安全问题
2009/09/05 PHP
PHP数据库调用类调用实例(详细注释)
2012/07/12 PHP
PHP系列学习之日期函数使用介绍
2012/08/18 PHP
php微信浏览器分享设置以及回调详解
2016/08/01 PHP
在Laravel中使用DataTables插件的方法
2018/05/29 PHP
Prototype使用指南之base.js
2007/01/10 Javascript
基于datagrid框架的查询
2013/04/08 Javascript
文本框中禁止非数字字符输入比如手机号码、邮编
2013/08/19 Javascript
js动态移动滚动条至底部示例代码
2014/04/24 Javascript
jQuery新的事件绑定机制on()示例应用
2014/07/18 Javascript
JS简单实现多级Select联动菜单效果代码
2015/09/06 Javascript
JS基于面向对象实现的拖拽库实例
2015/09/24 Javascript
Bootstrap布局组件应用实例讲解
2016/02/17 Javascript
js实现(全选)多选按钮的方法【附实例】
2016/03/30 Javascript
Bootstrap登陆注册页面开发教程
2016/07/12 Javascript
jQuery动态改变多行文本框高度的方法
2016/09/07 Javascript
vue 子组件向父组件传值方法
2018/02/26 Javascript
javascript实现日历效果
2019/06/17 Javascript
JS代码检查工具ESLint介绍与使用方法
2020/02/04 Javascript
Python星号*与**用法分析
2018/02/02 Python
python 移除字符串尾部的数字方法
2018/07/17 Python
如何使用Python实现斐波那契数列
2019/07/02 Python
使用Matplotlib 绘制精美的数学图形例子
2019/12/13 Python
浅谈python 中的 type(), dtype(), astype()的区别
2020/04/09 Python
css3过渡_动力节点Java学院整理
2017/07/11 HTML / CSS
生物制药专业自我鉴定
2014/02/19 职场文书
法英专业大学生职业生涯规划范文:衡外情,量己力!
2014/09/23 职场文书
群众路线教育实践活动剖析材料
2014/09/30 职场文书
英语教师个人工作总结
2015/02/09 职场文书
个人催款函范文
2015/06/24 职场文书
幼儿园安全教育随笔
2015/08/14 职场文书
小学毕业教师寄语
2019/06/21 职场文书
慰问信的写作格式及范文!
2019/06/24 职场文书
长辈生日祝福语大全(72句)
2019/08/09 职场文书
为什么MySQL选择Repeatable Read作为默认隔离级别
2021/07/26 MySQL
Python利用zhdate模块实现农历日期处理
2022/03/31 Python