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 相关文章推荐
JavaScript 数组循环引起的思考
Jan 01 Javascript
使用PHP+JQuery+Ajax分页的实现
Apr 23 Javascript
深入理解javascript中defer的作用
Dec 11 Javascript
jQuery实现鼠标滑过Div层背景变颜色的方法
Feb 17 Javascript
JS组件Bootstrap Table布局详解
May 27 Javascript
jquery ui sortable拖拽后保存位置
Apr 27 jQuery
vue实现2048小游戏功能思路详解
May 09 Javascript
vue2.0学习之axios的封装与vuex介绍
May 28 Javascript
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
Sep 04 Javascript
vue实现随机验证码功能的实例代码
Apr 30 Javascript
p5.js实现动态图形临摹
Oct 23 Javascript
JS实现拖动模糊框特效
Aug 25 Javascript
使用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网上商城购物车设计代码分享
2012/02/15 PHP
php开启与关闭错误提示适用于没有修改php.ini的权限
2014/10/16 PHP
php微信公众号开发之二级菜单
2018/10/20 PHP
PHP chunk_split()函数讲解
2019/02/12 PHP
浅谈php常用的7大框架的优缺点
2020/07/20 PHP
javascript Array.prototype.slice使用说明
2010/10/11 Javascript
js模拟点击事件实现代码
2012/11/06 Javascript
浅析Js中的单引号与双引号问题
2013/11/06 Javascript
css+js实现部分区域高亮可编辑遮罩层
2014/03/04 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记8)
2015/12/24 Javascript
Jquery实现$.fn.extend和$.extend函数
2016/04/14 Javascript
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
2016/04/18 Javascript
JS中判断null的方法分析
2016/11/21 Javascript
微信小程序开发之实现自定义Toast弹框
2017/06/08 Javascript
JS运动特效之完美运动框架实例分析
2018/01/24 Javascript
详解JSON和JSONP劫持以及解决方法
2019/03/08 Javascript
JS实现的字符串数组去重功能小结
2019/06/17 Javascript
JavaScript遍历数组和对象的元素简单操作示例
2019/07/09 Javascript
使用django-suit为django 1.7 admin后台添加模板
2014/11/18 Python
Python实现的简单hangman游戏实例
2015/06/28 Python
Python正则捕获操作示例
2017/08/19 Python
Pandas DataFrame 取一行数据会得到Series的方法
2018/11/10 Python
详解用Python练习画个美队盾牌
2019/03/23 Python
Python实现使用request模块下载图片demo示例
2019/05/24 Python
django 信号调度机制详解
2019/07/19 Python
基于pygame实现童年掌机打砖块游戏
2020/02/25 Python
Python+appium框架原生代码实现App自动化测试详解
2020/03/06 Python
Python基于进程池实现多进程过程解析
2020/04/30 Python
基于Python实现全自动下载抖音视频
2020/11/06 Python
升职自荐书范文
2013/11/28 职场文书
名人演讲稿范文
2013/12/28 职场文书
奠基仪式主持词
2014/03/20 职场文书
天猫某品牌专卖店运营计划书
2014/03/21 职场文书
平安建设汇报材料
2014/12/29 职场文书
《少年闰土》教学反思
2016/02/18 职场文书
Python使用pandas导入xlsx格式的excel文件内容操作代码
2022/12/24 Python