javascript动态添加、修改、删除对象的属性与方法详解


Posted in Javascript onJanuary 27, 2014

现在介绍如何为一个对象添加、修改或者删除属性和方法。在其他语言中,对象一旦生成,就不可更改了,要为一个对象添加修改成员必须要在对应的类中修改,并重新实例化,而且程序必须经过重新编译。JavaScript 中却非如此,它提供了灵活的机制来修改对象的行为,可以动态添加、修改、删除属性和方法。例如首先使用类Object来创建一个空对象user:
var user=new Object();

1.添加属性
这时user 对象没有任何属性和方法,显然没有任何用途。但可以为它动态的添加属性和方法,例如:
user.name=”jack”;
user.age=21;
user.sex=”male”;
通过上述语句,user 对象便具有了三个属性:name、age和sex。下面输出这三个语句:
alert(user.name);
alert(user.age);
alert(user.sex);
由代码运行效果可知,三个属性已经完全属于user 对象了。

2.添加方法
添加方法的过程和属性类似:
user.alert=function(){
alert(“my name is:”+this.name);
}
这就为user 对象添加了一个方法“alert”,通过执行它,可以弹出一个对话框显示自己的名字介绍:
user.alert();

3.修改属性
修改一个属性的过程就是用新的属性替换旧的属性,例如:
user.name=”tom”;
user.alert=function(){
alert(“hello,”+this.name);
}
这样就修改了user 对象name属性的值和alert方法,它从显示“my name is”变为了显示“hello”。

4.删除属性
删除一个属性的过程也很简单,就是将其置为undefined:
user.name=undefined;
user.alert=undefined;
这样就删除了name属性和alert方法。在之后的代码中,这些属性变的不可用。
在添加、修改或者删除属性时,和引用属性相同,也可以采用方括号([])语法:
user[“name”]=”tom”;
使用这种方式还有一个额外的特点,就是可以使用非标识符字符串作为属性名称,例如
标识符中不允许以数字开头或者出现空格,但在方括号([])语法中却可以使用:
user[“my name”]=”tom”;
需要注意,在使用这种非标识符作为名称的属性时,仍然要用方括号语法来引用:
alert(user[“my name”]);
而不能写为:
alert(user.my name);
利用对象的这种性质,甚至可以很容易实现一个简单的哈希表,在本书的后面将会看到其应用。此可见,JavaScript中的每个对象都是动态可变的,这给编程带来了很大的灵活性,也和其他语言产生了很大的区别,读者可以体会这种性质。

Javascript 相关文章推荐
jquery dialog键盘事件代码
Aug 01 Javascript
滚动图片效果 jquery实现回旋滚动效果
Jan 08 Javascript
Ext JS 4实现带week(星期)的日期选择控件(实战一)
Aug 21 Javascript
JavaScript的常见兼容问题及相关解决方法(chrome/IE/firefox)
Dec 31 Javascript
用JavaScript实现类似于ListBox功能示例代码
Mar 09 Javascript
Node.js与PHP、Python的字符处理性能对比
Jul 06 Javascript
jQuery中toggle()函数的使用实例
Apr 17 Javascript
javascript的变量、传值、传址、参数之间关系
Jul 26 Javascript
javascript简单实现类似QQ头像弹出效果的方法
Aug 03 Javascript
JavaScript记录光标在编辑器中位置的实现方法
Apr 22 Javascript
json的使用小结
Jun 08 Javascript
layui实现鼠标移动到单元格上显示数据的方法
Sep 11 Javascript
javascript中定义私有方法说明(private method)
Jan 27 #Javascript
用javascript替换URL中的参数值示例代码
Jan 27 #Javascript
jquery选择器之基本过滤选择器详解
Jan 27 #Javascript
jquery选择器之层级过滤选择器详解
Jan 27 #Javascript
jquery选择器之内容过滤选择器详解
Jan 27 #Javascript
jquery选择器之属性过滤选择器详解
Jan 27 #Javascript
jQuery自定义事件的简单实现代码
Jan 27 #Javascript
You might like
yii2利用自带UploadedFile实现上传图片的示例
2017/02/16 PHP
PHP实现QQ、微信和支付宝三合一收款码实例代码
2018/02/19 PHP
Laravel框架源码解析之入口文件原理分析
2020/05/14 PHP
使用Javascript和DOM Interfaces来处理HTML
2006/10/09 Javascript
js png图片(有含有透明)在IE6中为什么不透明了
2010/02/07 Javascript
JavaScript截取字符串的Slice、Substring、Substr函数详解和比较
2014/03/20 Javascript
JS实现判断滚动条滚到页面底部并执行事件的方法
2014/12/18 Javascript
Bootstrap每天必学之基础排版
2015/11/20 Javascript
JavaScript仿支付宝密码输入框
2015/12/29 Javascript
JavaScript中的跨浏览器事件操作的基本方法整理
2016/05/20 Javascript
Angular 应用技巧总结
2016/09/14 Javascript
JQuery遍历元素的父辈和祖先的方法
2016/09/18 Javascript
JS字符串长度判断,超出进行自动截取的实例(支持中文)
2017/03/06 Javascript
微信小程序中input标签详解及简单实例
2017/05/18 Javascript
Bootstrap Table使用整理(五)之分页组合查询
2017/06/09 Javascript
AngularJS监听ng-repeat渲染完成的方法
2018/03/20 Javascript
详解微信小程序框架wepy踩坑记录(与vue对比)
2019/03/12 Javascript
从零到一详聊创建Vue工程及遇到的常见问题
2019/04/25 Javascript
使用JavaScript获取扫码枪扫描得到的条形码的思路代码详解
2020/06/10 Javascript
Python实现excel转sqlite的方法
2017/07/17 Python
python的mysqldb安装步骤详解
2017/08/14 Python
Python探索之ModelForm代码详解
2017/10/26 Python
关于Tensorflow中的tf.train.batch函数的使用
2018/04/24 Python
Python面向对象之静态属性、类方法与静态方法分析
2018/08/24 Python
Python分析彩票记录并预测中奖号码过程详解
2019/07/09 Python
Python结合Window计划任务监测邮件的示例代码
2020/08/05 Python
Python通过len函数返回对象长度
2020/10/22 Python
python爬取youtube视频的示例代码
2021/03/03 Python
Paradigit比利时电脑卖场:购买笔记本、电脑、平板和外围设备
2016/11/28 全球购物
Dr. Martens马汀博士澳大利亚官网:马丁靴鼻祖
2019/07/02 全球购物
兰蔻俄罗斯官方网站:Lancome俄罗斯
2019/12/09 全球购物
国际贸易专业个人求职信格式
2014/02/02 职场文书
房展策划方案
2014/06/07 职场文书
一年级语文下册复习计划
2015/01/17 职场文书
幼儿园毕业典礼家长致辞
2015/07/29 职场文书
Python快速实现一键抠图功能的全过程
2021/06/29 Python