Javascript学习笔记之 对象篇(一) : 对象的使用和属性


Posted in Javascript onJune 24, 2014
false.toString(); // 'false'
[1, 2, 3].toString(); // '1,2,3'

function Foo(){}
Foo.bar = 1;
Foo.bar; // 1

一个经常容易被误解的就是数字常量不能视为对象,实际上数字常量仍然可以视为对象。这是因为 Javascript 解析器在解析点操作符时而将其视为浮点数特征而犯下的错误。

2.toString(); // raises SyntaxError

实际上,我们有很多方法可以使得数字常量表现为一个对象。

2..toString(); // the second point is correctly recognized
2 .toString(); // note the space left to the dot
(2).toString(); // 2 is evaluated first

对象作为数据类型

Javascript 中的对象可以当做哈希表使用,它们主要包含键与值的对应关系。
使用 {} 符号来创建一个简单的对象,这个新建的对象将从 Object.prototype 继承而来,并且不包含自己定义的属性。

var foo = {}; // a new empty object
// a new object with a 'test' property with value 12
var bar = {test: 12};

访问对象的属性

我们可以使用两种方式来访问 Javascript 的对象,分别是点操作符 . 和中括号操作符 [] 。

var foo = {name: 'kitten'}
foo.name; // kitten
foo['name']; // kitten

var get = 'name';
foo[get]; // kitten

foo.1234; // SyntaxError
foo['1234']; // works

两种操作符的效果几乎一样,唯一的不同是中括号操作符允许动态设置属性而且属性名可以有语法错误。(上例中的第三个情形已说明)

删除对象的属性

删除属性的唯一方法是使用 delete,将属性值设置为 undefined 或 null 只是移除了与属性相关的值,并没有真正删除属性本身。

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 真正被删除。
这里要说明一点,delete 只能删除属性,并不能删除变量。所以我们在定义变量时一定要养成写 var 的好习惯,任何时候,变量一定要使用 var 关键字才能声明。因为如果不写 var,变量会被误认给全局对象创建了一个新属性。

Javascript学习笔记之 对象篇(一) : 对象的使用和属性

这个例子相当清楚给出了答案,a 为变量,而 b 只是一个全局对象的属性而已。

命名对象的属性

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

对象的属性可以用普通字符或字符串来命名。同样也是由于 Javascript 解析器的一个错误设计,上例中的第二种表示方法在 ECMAScript 5 中将会抛出一个错误。
错误的原因是因为 delete 是一个关键词,所以必须使用一个字符串常量来命名来适应老版的 Javascript 解析器。

Javascript 相关文章推荐
背景音乐每次刷新都可以自动更换
Feb 01 Javascript
JavaScript Event事件学习第一章 Event介绍
Feb 07 Javascript
jquery 学习之二 属性(html()与html(val))
Nov 25 Javascript
JavaScript面向对象(极简主义法minimalist approach)
Jul 17 Javascript
jQuery获取Select选择的Text和Value(详细汇总)
Jan 25 Javascript
jQuery 浮动导航菜单适合购物商品类型的网站
Sep 09 Javascript
原生JS实现响应式瀑布流布局
Apr 02 Javascript
详解javascript遍历方式
Nov 11 Javascript
Vue结合原生js实现自定义组件自动生成示例
Jan 21 Javascript
详解Vue.js和layui日期控件冲突问题解决办法
Jul 25 Javascript
解决ant Design中this.props.form.validateFields未执行的问题
Oct 27 Javascript
Vue 3自定义指令开发的相关总结
Jan 29 Vue.js
jQuery学习笔记之 Ajax操作篇(三) - 过程处理
Jun 23 #Javascript
jquery 为a标签绑定click事件示例代码
Jun 23 #Javascript
a标签click和href执行顺序探讨
Jun 23 #Javascript
jquery trigger伪造a标签的click事件取代window.open方法
Jun 23 #Javascript
javascript将浮点数转换成整数的三个方法
Jun 23 #Javascript
jquery用data方法获取某个元素上的事件
Jun 23 #Javascript
如何正确使用javascript 来进行我们的程序开发
Jun 23 #Javascript
You might like
php UTF8 文件的签名问题
2009/10/30 PHP
php标签云的实现代码
2012/10/10 PHP
php中smarty区域循环的方法
2015/06/11 PHP
图片onload事件触发问题解决方法
2011/07/31 Javascript
基于JQuery的模拟苹果桌面Dock效果(稳定版)
2012/10/15 Javascript
php对mongodb的扩展(小试牛刀)
2012/11/11 Javascript
js setTimeout 参数传递使用介绍
2013/08/13 Javascript
JavaScript中json使用自己总结
2013/08/13 Javascript
ajax异步请求详解
2017/01/06 Javascript
javascript内存分配原理实例分析
2017/04/10 Javascript
详解微信小程序 template添加绑定事件
2017/06/23 Javascript
hammer.js实现图片手势放大效果
2017/08/29 Javascript
浅谈Emergence.js 检测元素可见性的 js 插件
2017/11/18 Javascript
Vue+SpringBoot开发V部落博客管理平台
2017/12/27 Javascript
解决angular2在双向数据绑定时[(ngModel)]无法使用的问题
2018/09/13 Javascript
详解为生产环境编译Angular2应用的方法
2018/12/10 Javascript
CKeditor4 字体颜色功能配置方法教程
2019/06/26 Javascript
解决Vue keep-alive 调用 $destory() 页面不再被缓存的情况
2020/10/30 Javascript
[00:33]2016完美“圣”典风云人物:BurNIng宣传片
2016/12/10 DOTA
Python映射拆分操作符用法实例
2015/05/19 Python
Python基础语法(Python基础知识点)
2016/02/28 Python
Python保存MongoDB上的文件到本地的方法
2016/03/16 Python
python3使用urllib模块制作网络爬虫
2016/04/08 Python
使用python的pandas库读取csv文件保存至mysql数据库
2018/08/20 Python
python使用wxpy实现微信消息防撤回脚本
2019/04/29 Python
Python中拆分字符串的操作方法
2019/07/23 Python
对Django 转发和重定向的实例详解
2019/08/06 Python
Python基于pip实现离线打包过程详解
2020/05/15 Python
python实现杨辉三角的几种方法代码实例
2021/03/02 Python
函授自我鉴定
2013/11/06 职场文书
主题教育活动总结
2014/05/05 职场文书
党员一帮一活动总结
2014/07/08 职场文书
2015年酒店年度工作总结
2015/05/23 职场文书
导游词之永济鹳雀楼
2020/01/16 职场文书
JavaScript流程控制(循环)
2021/12/06 Javascript
详解pytorch创建tensor函数
2022/03/22 Python