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 相关文章推荐
FusionCharts图表显示双Y轴双(多)曲线
Nov 22 Javascript
处理及遍历XML文档DOM元素属性及方法整理
Aug 23 Javascript
开发插件的两个方法jquery.fn.extend与jquery.extend
Nov 21 Javascript
jQuery中使用Ajax获取JSON格式数据示例代码
Nov 26 Javascript
探讨jQuery的ajax使用场景(c#)
Dec 03 Javascript
jQuery插件zoom实现图片全屏放大弹出层特效
Apr 15 Javascript
Angular2+如何去除url中的#号详解
Dec 20 Javascript
vue2.0获取鼠标位置的方法
Sep 13 Javascript
使用webpack构建应用的方法步骤
Mar 04 Javascript
element 中 el-menu 组件的无限极循环思路代码详解
Apr 26 Javascript
JS判断数组是否包含某元素实现方法汇总
Jun 24 Javascript
详解如何在Javascript中使用Object.freeze()
Oct 18 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
改造一台复古桌面收音机
2021/03/02 无线电
PHP实现将视频转成MP4并获取视频预览图的方法
2015/03/12 PHP
javascript eval函数深入认识
2009/02/21 Javascript
Ext JS 4官方文档之三 -- 类体系概述与实践
2012/12/16 Javascript
JQueryEasyUI datagrid框架的基本使用
2013/04/08 Javascript
js鼠标点击图片实现随机变换图片的方法
2015/02/16 Javascript
JavaScript中5种调用函数的方法
2015/03/12 Javascript
js实现常用排序算法
2016/08/09 Javascript
快速实现JS图片懒加载(可视区域加载)示例代码
2017/01/04 Javascript
JavaScript实现水平进度条拖拽效果
2017/01/18 Javascript
JavaScript中匿名函数的递归调用
2017/01/22 Javascript
JS实现常见的查找、排序、去重算法示例
2018/05/21 Javascript
vue定义全局变量和全局方法的方法示例
2018/08/01 Javascript
vue中watch和computed的区别与使用方法
2020/08/23 Javascript
python将文本转换成图片输出的方法
2015/04/28 Python
玩转python爬虫之爬取糗事百科段子
2016/02/17 Python
Python实现简单的多任务mysql转xml的方法
2017/02/08 Python
python批量复制图片到另一个文件夹
2018/09/17 Python
Python3 使用cookiejar管理cookie的方法
2018/12/28 Python
Python3.5模块的定义、导入、优化操作图文详解
2019/04/27 Python
python实现动态数组的示例代码
2019/07/15 Python
Django 在iframe里跳转顶层url的例子
2019/08/21 Python
Django跨域请求原理及实现代码
2020/11/14 Python
python 实现aes256加密
2020/11/27 Python
python 实现有道翻译功能
2021/02/26 Python
Bibloo奥地利:购买女装、男装、童装、鞋和配件
2018/10/18 全球购物
社区工作者先进事迹
2014/01/18 职场文书
秘书英文求职信范文
2014/01/31 职场文书
工程专业求职自荐书范文
2014/02/18 职场文书
幼儿园小班植树节活动方案
2014/03/04 职场文书
公司接待方案
2014/03/08 职场文书
2014领导班子四风问题对照检查材料思想汇报
2014/09/21 职场文书
聘用合同范本
2015/09/21 职场文书
python中的装饰器该如何使用
2021/06/18 Python
JS中如何优雅的使用async await详解
2021/10/05 Javascript
Android移动应用开发指南之六种布局详解
2022/09/23 Java/Android