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 相关文章推荐
JS DOM 操作实现代码
Aug 01 Javascript
js创建对象的几种常用方式小结(推荐)
Oct 24 Javascript
基于jQuery的history历史记录插件
Dec 11 Javascript
javascript中length属性的探索
Jul 31 Javascript
JavaScript获取XML数据附示例截图
Mar 05 Javascript
jqeury-easyui-layout问题解决方法
Mar 24 Javascript
js带点自动图片轮播幻灯片特效代码分享
Sep 07 Javascript
JavaScript函数的一些注意要点小结及js匿名函数
Nov 10 Javascript
jquery把int类型转换成字符串类型的方法
Oct 07 Javascript
js canvas实现写字动画效果
Nov 30 Javascript
浅谈vue-router路由切换 组件重用挖下的坑
Nov 01 Javascript
微信小程序实现吸顶效果
Jan 08 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 获取MSN好友列表的代码(2009-05-14测试通过)
2009/09/09 PHP
在Windows系统上安装PHP运行环境文字教程
2010/07/19 PHP
开启CURL扩展,让服务器支持PHP curl函数(远程采集)
2011/03/19 PHP
php 目录遍历、删除 函数的使用介绍
2013/04/28 PHP
C# WinForm中实现快捷键自定义设置实例
2015/01/23 PHP
ThinkPHP5+UEditor图片上传到阿里云对象存储OSS功能示例
2019/08/05 PHP
JQuery 图片的展开和伸缩实例讲解
2013/04/18 Javascript
利用div+jquery自定义滚动条样式的2种方法
2013/07/18 Javascript
简单实用的反馈表单无刷新提交带验证
2013/11/15 Javascript
js获取表格的行数和列数的方法
2015/10/23 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
2015/11/18 Javascript
jQuery事件绑定用法详解(附bind和live的区别)
2016/01/19 Javascript
很全面的JavaScript常用功能汇总集合
2016/01/22 Javascript
JS实现pasteHTML兼容ie,firefox,chrome的方法
2016/06/22 Javascript
Highcharts学习之数据列
2016/08/03 Javascript
vue实现购物车功能(商品分类)
2020/04/20 Javascript
python妹子图简单爬虫实例
2015/07/07 Python
详解Python函数作用域的LEGB顺序
2016/05/14 Python
PyQt5利用QPainter绘制各种图形的实例
2017/10/19 Python
tensorflow学习笔记之mnist的卷积神经网络实例
2018/04/15 Python
python读取Excel实例详解
2018/08/17 Python
python保存字典和读取字典的实例代码
2019/07/07 Python
Flask框架重定向,错误显示,Responses响应及Sessions会话操作示例
2019/08/01 Python
python使用selenium爬虫知乎的方法示例
2020/10/28 Python
详解pandas赋值失败问题解决
2020/11/29 Python
python爬虫爬取淘宝商品比价(附淘宝反爬虫机制解决小办法)
2020/12/03 Python
python中xlutils库用法浅析
2020/12/29 Python
python中pivot()函数基础知识点
2021/01/03 Python
空字符串(“”)和null的区别
2012/11/13 面试题
毕业生自我推荐
2013/11/04 职场文书
师范应届毕业生自荐信
2013/11/18 职场文书
网页美工求职信范文
2014/04/17 职场文书
催款函范本大全
2015/06/24 职场文书
2015秋季幼儿园开学通知
2015/07/16 职场文书
毕业酒会致辞
2015/07/29 职场文书
导游词之宁夏贺兰山岩画
2019/11/08 职场文书