javascript对象的使用和属性操作示例详解


Posted in Javascript onMarch 02, 2014

JavaScript 中所有变量都是对象,除了两个例外 null 和 undefined。

false.toString(); // 'false'
[1, 2, 3].toString(); // '1,2,3'function Foo(){}
Foo.bar = 1;
Foo.bar; // 1

一个常见的误解是数字的字面值(literal)不是对象。这是因为 JavaScript 解析器的一个错误, 它试图将点操作符解析为浮点数字面值的一部分。

2.toString(); // 出错:SyntaxError

有很多变通方法可以让数字的字面值看起来像对象。

2..toString(); // 第二个点号可以正常解析
2 .toString(); // 注意点号前面的空格
(2).toString(); // 2先被计算
 

对象作为数据类型

JavaScript 的对象可以作为哈希表使用,主要用来保存命名的键与值的对应关系。

使用对象的字面语法 - {} - 可以创建一个简单对象。这个新创建的对象从Object.prototype 继承下面,没有任何自定义属性。

var foo = {}; // 一个空对象// 一个新对象,拥有一个值为12的自定义属性'test'
var bar = {test: 12};

访问属性

有两种方式来访问对象的属性,点操作符或者中括号操作符。

var foo = {name: 'kitten'}
foo.name; // kitten
foo['name']; // kittenvar get = 'name';
foo[get]; // kitten
foo.1234; // SyntaxError
foo['1234']; // works

两种语法是等价的,但是中括号操作符在下面两种情况下依然有效 - 动态设置属性 - 属性名不是一个有效的变量名(译者注:比如属性名中包含空格,或者属性名是 JS 的关键词)

译者注:在 JSLint 语法检测工具中,点操作符是推荐做法。

 

删除属性

删除属性的唯一方法是使用 delete 操作符;设置属性为 undefined 或者null 并不能真正的删除属性, 而仅仅是移除了属性和值的关联。

14
var obj = {
    bar: 1,
    foo: 2,
    baz: 3
};
obj.bar = undefined;
obj.foo = null;
delete obj.baz;for(var i in obj) {
    if (obj.hasOwnProperty(i)) {
        console.log(i, '' + obj[i]);
    }
}

上面的输出结果有 bar undefined 和 foo null - 只有 baz 被真正的删除了,所以从输出结果中消失。

 

属性名的语法

var test = {
    'case': 'I am a keyword so I must be notated as a string',
    delete: 'I am a keyword too so me' // 出错:SyntaxError
};

对象的属性名可以使用字符串或者普通字符声明。但是由于 JavaScript 解析器的另一个错误设计, 上面的第二种声明方式在 ECMAScript 5 之前会抛出SyntaxError 的错误。

这个错误的原因是 delete 是 JavaScript 语言的一个关键词;因此为了在更低版本的 JavaScript 引擎下也能正常运行, 必须使用字符串字面值声明方式。

Javascript 相关文章推荐
jquery的ajax和getJson跨域获取json数据的实现方法
Feb 04 Javascript
jQuery html()方法使用不了无法显示内容的问题
Aug 06 Javascript
jQuery实现向下滑出的平滑下拉菜单效果
Aug 21 Javascript
jquery实现网页的页面平滑滚动效果代码
Nov 02 Javascript
node.js中的事件处理机制详解
Nov 26 Javascript
Angular.js与node.js项目里用cookie校验账户登录详解
Feb 22 Javascript
angular框架实现全选与单选chekbox的自定义
Jul 06 Javascript
laydate日历控件使用方法详解
Nov 20 Javascript
webstorm添加*.vue文件支持
May 08 Javascript
JS 实现获取验证码 倒计时功能
Oct 29 Javascript
JavaScript使用表单元素验证表单的示例代码
Aug 20 Javascript
开发一个封装iframe的vue组件
Mar 29 Vue.js
使用js显示当前时间示例
Mar 02 #Javascript
jquery实现背景墙聚光灯效果示例分享
Mar 02 #Javascript
jquery制作弹窗提示窗口代码分享
Mar 02 #Javascript
jquery中ajax函数执行顺序问题之如何设置同步
Feb 28 #Javascript
JavaScript获取当前页面上的指定对象示例代码
Feb 28 #Javascript
jquery获取当前点击对象的value方法
Feb 28 #Javascript
经过绑定元素时会多次触发mouseover和mouseout事件
Feb 28 #Javascript
You might like
PHP读取目录下所有文件的代码
2008/01/07 PHP
php记录日志的实现代码
2011/08/08 PHP
PHP删除数组中特定元素的两种方法
2013/07/02 PHP
PHP利用func_get_args和func_num_args函数实现函数重载实例
2014/11/12 PHP
跟我一起学写jQuery插件开发方法(附完整实例及下载)
2010/04/01 Javascript
jQuery prev ~ siblings选择器使用介绍
2013/08/09 Javascript
js自动生成的元素与页面原有元素发生堆叠的解决方法
2013/10/24 Javascript
jquery的clone方法应用于textarea和select的bug修复
2014/06/26 Javascript
JavaScript使用replace函数替换字符串的方法
2015/04/06 Javascript
JavaScript中setter和getter方法介绍
2016/07/11 Javascript
React Native中导航组件react-navigation跨tab路由处理详解
2017/10/31 Javascript
深入研究React中setState源码
2017/11/17 Javascript
微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法
2017/12/14 Javascript
这应该是最详细的响应式系统讲解了
2019/07/22 Javascript
基于JavaScript伪随机正态分布代码实例
2019/11/07 Javascript
24个ES6方法解决JS实际开发问题(小结)
2020/05/31 Javascript
Javascript节流函数throttle和防抖函数debounce
2020/12/03 Javascript
[57:22]2018DOTA2亚洲邀请赛 4.7总决赛 LGD vs Mineski 第五场
2018/04/10 DOTA
python操作MongoDB基础知识
2013/11/01 Python
Python实现读取机器硬件信息的方法示例
2018/06/09 Python
flask框架路由常用定义方式总结
2019/07/23 Python
PyTorch中Tensor的拼接与拆分的实现
2019/08/18 Python
Python Matplotlib绘图基础知识代码解析
2020/08/31 Python
使用Python解析Chrome浏览器书签的示例
2020/11/13 Python
英国男士时尚购物网站:Stuarts London
2017/10/22 全球购物
美国高档百货Nordstrom的折扣店:Nordstrom Rack
2017/11/13 全球购物
英国PC组件和在线电脑商店:SCAN
2019/04/18 全球购物
逻辑链路控制协议
2016/10/01 面试题
介绍一下JNDI的基本概念
2013/07/26 面试题
写求职信有什么意义
2014/02/17 职场文书
个人四风问题对照检查材料思想汇报
2014/10/06 职场文书
采购员岗位职责
2015/02/03 职场文书
民事诉讼答辩状范文
2015/05/21 职场文书
2016年秋季运动会通讯稿
2015/11/25 职场文书
Django cookie和session的应用场景及如何使用
2021/04/29 Python
python图像处理基本操作总结(PIL库、Matplotlib及Numpy)
2021/06/08 Python