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 相关文章推荐
javascript 操作文件 实现方法小结
Jul 02 Javascript
基于jQuery制作迷你背词汇工具
Jul 27 Javascript
JS弹出可拖拽可关闭的div层完整实例
Feb 13 Javascript
最流行的Node.js精简型和全栈型开发框架介绍
Feb 26 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
Sep 26 Javascript
vue2滚动条加载更多数据实现代码
Jan 10 Javascript
jQuery滚动条美化插件nicescroll简单用法示例
Apr 18 jQuery
vue2.0使用v-for循环制作多级嵌套菜单栏
Jun 25 Javascript
关于layui flow loading占位图的实现方法
Sep 21 Javascript
微信小程序学习总结(三)条件、模板、文件引用实例分析
Jun 04 Javascript
Vue中使用Echarts仪表盘展示实时数据的实现
Nov 01 Javascript
适合后台管理系统开发的12个前端框架(小结)
Jun 29 Javascript
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生成EXCEL的东东
2006/10/09 PHP
用PHP读取flv文件的播放时间长度
2009/09/03 PHP
ThinkPHP的MVC开发机制实例解析
2014/08/23 PHP
用PHP生成excel文件到指定目录
2015/06/22 PHP
PHP入门教程之面向对象的特性分析(继承,多态,接口,抽象类,抽象方法等)
2016/09/11 PHP
PHP接收App端发送文件流的方法
2016/09/23 PHP
PHP实现正则表达式分组捕获操作示例
2018/02/03 PHP
PHP getID3类的使用方法学习笔记【附getID3源码下载】
2019/10/18 PHP
Javascript数组的排序 sort()方法和reverse()方法
2012/06/04 Javascript
javascript检查表单数据是否改变的方法
2013/07/30 Javascript
JavaScript splice()方法详解
2020/09/22 Javascript
javaScript如何生成xmlhttp
2013/12/16 Javascript
jquery 通过name快速取值示例
2014/01/24 Javascript
jQuery判断邮箱格式对错实例代码讲解
2017/04/12 jQuery
利用babel将es6语法转es5的简单示例
2017/12/01 Javascript
微信小程序 MinUI组件库系列之badge徽章组件示例
2018/08/20 Javascript
基于Vue-cli快速搭建项目的完整步骤
2018/11/03 Javascript
vue实现分页组件
2020/06/16 Javascript
Vue中的循环及修改差值表达式的方法
2019/08/29 Javascript
python计算一个序列的平均值的方法
2015/07/11 Python
python实现按长宽比缩放图片
2018/06/07 Python
Python发送邮件测试报告操作实例详解
2018/12/08 Python
python flask解析json数据不完整的解决方法
2019/05/26 Python
关于python pycharm中输出的内容不全的解决办法
2020/01/10 Python
通过自学python能找到工作吗
2020/06/21 Python
python 中的命名空间,你真的了解吗?
2020/08/19 Python
python类共享变量操作
2020/09/03 Python
Original Penguin美国官网:布拉德皮特、强尼德普喜爱的服装品牌
2016/10/25 全球购物
编码实现字符串转整型的函数
2012/06/02 面试题
千元咖啡店的创业计划书范文
2013/12/29 职场文书
汽车运用工程专业求职信
2014/06/18 职场文书
承租经营合作者协议书
2014/10/01 职场文书
交通事故协议书范文
2014/10/23 职场文书
装修公司管理制度
2015/08/05 职场文书
Python破解极验滑动验证码详细步骤
2021/05/21 Python
JavaScript实现贪吃蛇游戏
2021/06/16 Javascript