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 Validation实例代码 让验证变得如此容易
Oct 18 Javascript
同时使用n个window onload加载实例介绍
Apr 25 Javascript
js关闭浏览器窗口及检查浏览器关闭事件
Sep 03 Javascript
jquery 实现input输入什么div图层显示什么
Jun 15 Javascript
yui3的AOP(面向切面编程)和OOP(面向对象编程)
May 01 Javascript
微信小程序中用WebStorm使用LESS
Mar 08 Javascript
微信JS-SDK选取手机照片上传功能
Apr 21 Javascript
详解node.js中的npm和webpack配置方法
Jan 21 Javascript
JS实现匀速与减速缓慢运动的动画效果封装示例
Aug 27 Javascript
javascript实现点亮灯泡特效示例
Oct 15 Javascript
详解Vue的watch中的immediate与watch是什么意思
Dec 30 Javascript
js基础语法与maven项目配置教程案例
Jul 15 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版本常用的排序算法汇总
2015/12/20 PHP
iis6+javascript Add an Extension File
2007/06/13 Javascript
prototype 中文参数乱码解决方案
2009/11/09 Javascript
获得所有表单值的JQuery实现代码[IE暂不支持]
2012/05/24 Javascript
js中substring和substr的详细介绍与用法
2013/08/29 Javascript
javascript制作loading动画效果 loading效果
2014/01/14 Javascript
jquery easyui 对于开始时间小于结束时间的判断示例
2014/03/22 Javascript
Node.js 制作实时多人游戏框架
2015/01/08 Javascript
JavaScript页面模板库handlebars的简单用法
2015/03/02 Javascript
再次谈论React.js实现原生js拖拽效果引起的一系列问题
2016/04/03 Javascript
js图片上传的封装代码
2017/08/01 Javascript
jQuery UI Draggable + Sortable 结合使用(实例讲解)
2017/09/07 jQuery
JS实现百度搜索接口及链接功能实例代码
2018/02/02 Javascript
angular ng-model 无法获取值的处理方法
2018/10/02 Javascript
VueJS 组件参数名命名与组件属性转化问题
2018/12/03 Javascript
微信小程序如何调用新闻接口实现列表循环
2019/07/02 Javascript
jquery弹窗时禁止body滚动条滚动的例子
2019/09/21 jQuery
jsonp格式前端发送和后台接受写法的代码详解
2019/11/07 Javascript
js实现无缝轮播图插件封装
2020/07/31 Javascript
python 生成不重复的随机数的代码
2011/05/15 Python
python自动化测试之从命令行运行测试用例with verbosity
2014/09/28 Python
Python登录注册验证功能实现
2018/06/18 Python
python for和else语句趣谈
2019/07/02 Python
对python中return与yield的区别详解
2020/03/12 Python
Python ORM框架Peewee用法详解
2020/04/29 Python
华为消费者德国官方网站:HUAWEI德国
2020/11/03 全球购物
Linux如何为某个操作添加别名
2015/02/05 面试题
工程项目建议书范文
2014/03/12 职场文书
毕业生求职信
2014/06/10 职场文书
学生党员一帮一活动总结
2014/07/08 职场文书
纪念九一八事变演讲稿1000字
2014/09/14 职场文书
购房协议书范本
2014/10/02 职场文书
离婚协议书应该怎么写
2014/10/12 职场文书
会计专业求职信范文
2015/03/19 职场文书
安全教育第一课观后感
2015/06/17 职场文书
看完这篇文章获得一些java if优化技巧
2021/07/15 Java/Android