JavaScript中对象property的读取和写入方法介绍


Posted in Javascript onDecember 30, 2014

JavaScript中,可以通过点号操作符”.”或者中括号操作符”[]“来对对象的property进行读取和写入:

var o = {x:1, y:2};

console.log(o.x);//1

console.log(o["y"]);//2

o.y = 7;

console.log(o["y"]);//7

值得注意的是,如果使用中括号操作符,则操作符内的值类型必须是string,或者能够转换成string的表达式:

console.log(o[y]);//ReferenceError: y is not defined

var v = "y";

console.log(o[v]);//7

与Java语言不同的是,JavaScript中对象的property可以动态添加或删除。当对某个property进行赋值操作时,如果该property不存在,JavaScript会在对象中动态添加此property:

o.z = 99;

console.log(o);//Object {x=1, y=7, z=99}

 

原型继承链中property的读取

 

JavaScript中所有的对象均有一个prototype原型对象,并从该原型对象中继承property;因此,JS中一个对象的property分成两大类:

1.对象自身所拥有的property(“Own Property”)。
2.从原型对象处继承而来的property。

当读取对象的property时,所遵循的规则如下:

1.从对象自身的property集合(“Own Property”)中搜索需要读取的property;如果可以搜索到,则直接读取该property并返回其值。
2.如果无法从对象自身的property集合(“Own Property”)中搜索到该property,那么则从对象的prototype原型链中继续进行搜索,直至搜索到该property并返回其值。
3.如果无法从对象自身的property集合(“Own Property”)中搜索到该property,也无法从对象的所有prototype对象中搜索到该property,则返回undefined。

原型继承链中property的写入

在对JavaScript对象的property进行写入时,所遵循的规则如下:

1.如果对象自身有该property,且该property可写,则将新值写入该property。如果该property只读,则报错。
2.如果对象自身没有该property,且其所有的prototype对象中也不存在该property,则将此property添加到该对象中。
3.如果对象自身没有该property,但其prototype对象中存在该property且可写,那么JS会在对象中新建这个property;也就是说,该对象覆写了其prototype对象中的这个property。prototype对象中此property值不变。
4.如果对象自身没有该property,但其prototype对象中存在该property且只读,则报错。
5.如果对象自身没有该property,但其prototype对象中存在该property的setter方法,那么JS会调用该prototype对象中的setter方法。值得注意的是,在运行setter方法时,如果涉及到变量赋值,那么赋值操作将作用在对象自身上,而prototype对象不会有任何改动。对于这一行为,可以理解为:对象从prototype处继承了setter函数并加以执行。

从上述规则中可以发现,如果对property的赋值操作成功,那么最后被修改的永远是对象自身,其prototype原型对象不会有任何改动。

Javascript 相关文章推荐
javascript 一些用法小结
Sep 11 Javascript
javascript 模式设计之工厂模式学习心得
Apr 27 Javascript
JavaScript与Div对层定位和移动获得坐标的实现代码
Sep 08 Javascript
jquery中post方法用法实例
Oct 21 Javascript
jQuery实现判断滚动条到底部
Jun 23 Javascript
JS+CSS实现大气清新的滑动菜单效果代码
Oct 22 Javascript
canvas绘制多边形
Feb 24 Javascript
jQuery绑定事件方法及区别(bind,click,on,live,one)
Aug 14 jQuery
js实现关闭网页出现是否离开提示
Dec 07 Javascript
layui实现动态和静态分页
Apr 28 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
Sep 28 Javascript
windows下create-react-app 升级至3.3.1版本踩坑记
Feb 17 Javascript
jQuery中:last选择器用法实例
Dec 30 #Javascript
JavaScript中对象property的删除方法介绍
Dec 30 #Javascript
JavaScript中检查对象property的存在性方法介绍
Dec 30 #Javascript
JavaScript中遍历对象的property的3种方法介绍
Dec 30 #Javascript
JavaScript语言对Unicode字符集的支持详解
Dec 30 #Javascript
JavaScript中的对象的extensible属性介绍
Dec 30 #Javascript
JavaScript中的对象序列化介绍
Dec 30 #Javascript
You might like
十天学会php之第二天
2006/10/09 PHP
浅析php变量修饰符static的使用
2013/06/28 PHP
函数中使用require_once问题深入探讨 优雅的配置文件定义方法推荐
2014/07/02 PHP
JavaScript几种形式的树结构菜单
2010/05/10 Javascript
js parseInt("08")未指定进位制问题
2010/06/19 Javascript
JQuery切换显示的效果实例代码
2013/02/27 Javascript
JS关闭窗口与JS关闭页面的几种方法小结
2013/12/17 Javascript
查找Oracle高消耗语句的方法
2014/03/22 Javascript
jQuery横向擦除焦点图特效代码分享
2015/09/06 Javascript
jQuery动画效果相关方法实例分析
2015/12/31 Javascript
BootStrap table表格插件自适应固定表头(超好用)
2016/08/24 Javascript
JS定时器实现数值从0到10来回变化
2016/12/09 Javascript
jquery实现文字单行横移或翻转(上下、左右跳转)
2017/01/08 Javascript
SVG描边动画
2017/02/23 Javascript
Angular中使用$watch监听object属性值的变化(详解)
2017/04/24 Javascript
微信小程序 实例开发总结
2017/04/26 Javascript
JavaScript数据结构与算法之队列原理与用法实例详解
2017/11/22 Javascript
JavaScript之实现一个简单的Vue示例
2019/01/17 Javascript
JavaScript中变量提升和函数提升的详解
2020/08/07 Javascript
[05:26]2014DOTA2西雅图国际邀请赛 iG战队巡礼
2014/07/07 DOTA
[08:04]TI4西雅图DOTA2前线报道 海涛探访各路人马
2014/07/09 DOTA
Pycharm 实现下一个文件引用另外一个文件的方法
2019/01/17 Python
浅谈Python的条件判断语句if/else语句
2019/03/21 Python
python 监控服务器是否有人远程登录(详细思路+代码)
2020/12/18 Python
IE9下html5初试小刀
2010/09/21 HTML / CSS
香港最新科技与优质家居产品购物网站:J SELECT
2018/08/21 全球购物
CAT鞋加拿大官网:CAT Footwear加拿大
2020/08/05 全球购物
考试不及格检讨书
2014/01/09 职场文书
运动会入场词200字
2014/02/15 职场文书
师恩难忘教学反思
2014/04/27 职场文书
银行主办会计岗位职责
2014/08/13 职场文书
2015大学生党员自我评价范文
2015/03/03 职场文书
入党自传范文2015
2015/06/26 职场文书
2015年酒店销售部工作总结
2015/07/24 职场文书
大学生创业计划书
2019/06/24 职场文书
浅谈JS和Nodejs中的事件驱动
2021/05/05 NodeJs