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 对象的解释
Nov 24 Javascript
探讨jQuery的ajax使用场景(c#)
Dec 03 Javascript
javascript删除数组重复元素的方法汇总
Jun 24 Javascript
JavaScript继承学习笔记【新手必看】
May 10 Javascript
Wireshark基本介绍和学习TCP三次握手
Aug 15 Javascript
js仿百度音乐全选操作
Jan 13 Javascript
Vue学习笔记之表单输入控件绑定
Sep 05 Javascript
react脚手架如何配置less和ant按需加载的方法步骤
Nov 28 Javascript
微信小程序 image组件遇到的问题
May 28 Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
Sep 25 Javascript
JS数组方法slice()用法实例分析
Jan 18 Javascript
js轮播图之旋转木马效果
Oct 13 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
星际中一些鲜为人知的详细资料
2020/03/04 星际争霸
php Static关键字实用方法
2010/06/04 PHP
PHP实现对xml进行简单的增删改查(CRUD)操作示例
2017/05/19 PHP
特殊字符、常规符号及其代码对照表
2006/06/26 Javascript
jQuery+css实现图片滚动效果(附源码)
2013/03/18 Javascript
关于jQuery判断元素是否存在的问题示例探讨
2014/07/21 Javascript
javascript实现节点(div)名称编辑
2014/12/17 Javascript
牛叉的Jquery——Jquery与DOM对象的互相转换及DOM的三种操作
2015/10/29 Javascript
vue组件数据传递、父子组件数据获取,slot,router路由功能示例
2019/03/19 Javascript
Vue+Element实现表格编辑、删除、以及新增行的最优方法
2019/05/28 Javascript
微信小程序实现渐入渐出动画效果
2019/06/13 Javascript
详解Vue.js和layui日期控件冲突问题解决办法
2019/07/25 Javascript
layui checkbox默认选中,获取选中值,清空所有选中项的例子
2019/09/02 Javascript
[01:04:30]Fnatic vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
Python httplib,smtplib使用方法
2008/09/06 Python
Python通过websocket与js客户端通信示例分析
2014/06/25 Python
让 python 命令行也可以自动补全
2014/11/30 Python
使用Python脚本来获取Cisco设备信息的示例
2015/05/04 Python
Django中对通过测试的用户进行限制访问的方法
2015/07/23 Python
python实现外卖信息管理系统
2018/01/11 Python
Python3读取Excel数据存入MySQL的方法
2018/05/04 Python
Python RabbitMQ消息队列实现rpc
2018/05/30 Python
对python 通过ssh访问数据库的实例详解
2019/02/19 Python
通过实例学习Python Excel操作
2020/01/06 Python
Python类的动态绑定实现原理
2020/03/21 Python
Python自动化测试中yaml文件读取操作
2020/08/20 Python
欧洲著名的珠宝和手表网上商城:uhrcenter
2017/04/10 全球购物
Linux的主要特性
2014/10/06 面试题
单位在职证明范本
2014/01/09 职场文书
文明倡议书范文
2014/04/15 职场文书
年终考核实施方案
2014/05/26 职场文书
公司门卫岗位职责范本
2014/07/08 职场文书
结婚纪念日感言
2015/08/01 职场文书
Nginx 过滤静态资源文件的访问日志的实现
2021/03/31 Servers
HTML基础详解(下)
2021/10/16 HTML / CSS
详解gantt甘特图可拖拽、编辑(vue、react都可用 highcharts)
2021/11/27 Vue.js