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 相关文章推荐
URI、URL和URN之间的区别与联系
Dec 20 Javascript
js类中获取外部函数名的方法与代码
Sep 12 Javascript
jquery自动填充勾选框即把勾选框打上true
Mar 24 Javascript
JavaScript 实现完美兼容多浏览器的复制功能代码
Apr 28 Javascript
JS实现仿腾讯微博无刷新删除微博效果代码
Oct 16 Javascript
AngularJS入门教程之迭代器过滤详解
Aug 18 Javascript
十大热门的JavaScript框架和库
Mar 21 Javascript
js实现多张图片延迟加载效果
Jul 17 Javascript
js处理包含中文的字符串实例
Oct 11 Javascript
axios进阶实践之利用最优雅的方式写ajax请求
Dec 20 Javascript
createObjectURL方法实现本地图片预览
Sep 30 Javascript
前端性能优化建议
Sep 17 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
PHP简单预防sql注入的方法
2016/09/27 PHP
tp5 sum某个字段相加得到总数的例子
2019/10/18 PHP
jquery实现心算练习代码
2010/12/06 Javascript
jQuery模拟原生态App上拉刷新下拉加载更多页面及原理
2015/08/10 Javascript
JS+CSS实现带有碰撞缓冲效果的竖向导航条代码
2015/09/15 Javascript
JQuery异步加载PartialView的方法
2016/06/07 Javascript
微信小程序 详解页面跳转与返回并回传数据
2017/02/13 Javascript
Bootstrap3下拉菜单的实现
2017/02/22 Javascript
Vue2.0父子组件传递函数的教程详解
2017/10/16 Javascript
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
2018/09/04 Javascript
2019年度web前端面试题总结(主要为Vue面试题)
2020/01/12 Javascript
VUE实现Studio管理后台之鼠标拖放改变窗口大小
2020/03/04 Javascript
Js生成随机数/随机字符串的方法小结【5种方法】
2020/05/27 Javascript
解决Echarts 显示隐藏后宽度高度变小的问题
2020/07/19 Javascript
python类和继承用法实例
2015/07/07 Python
Python实现配置文件备份的方法
2015/07/30 Python
Python中的字符串替换操作示例
2016/06/27 Python
Python中模块string.py详解
2017/03/12 Python
Python tkinter模块中类继承的三种方式分析
2017/08/08 Python
Python+tkinter使用40行代码实现计算器功能
2018/01/30 Python
python中join()方法介绍
2018/10/11 Python
python将控制台输出保存至文件的方法
2019/01/07 Python
基于python中__add__函数的用法
2019/11/25 Python
python标准库os库的函数介绍
2020/02/12 Python
Python tkinter 下拉日历控件代码
2020/03/04 Python
python tkinter GUI绘制,以及点击更新显示图片代码
2020/03/14 Python
Python利用Xpath选择器爬取京东网商品信息
2020/06/01 Python
Python3 requests模块如何模仿浏览器及代理
2020/06/15 Python
HTML5 3D书本翻页动画的实现示例
2019/08/28 HTML / CSS
整个世界的设计师家具在哈恩:Designathome
2019/03/25 全球购物
可以使用抽象函数重写基类中的虚函数吗
2013/06/02 面试题
数控专业大学生的自我鉴定
2013/11/13 职场文书
幼儿园万圣节活动总结
2015/05/05 职场文书
2015年卫生院健康教育工作总结
2015/07/24 职场文书
python flappy bird小游戏分步实现流程
2022/02/15 Python
python使用torch随机初始化参数
2022/03/22 Python