JavaScript对象_动力节点Java学院整理


Posted in Javascript onJune 23, 2017

JavaScript的对象是一种无序的集合数据类型,它由若干键值对组成。

JavaScript的对象用于描述现实世界中的某个对象。例如,为了描述“小明”这个淘气的小朋友,我们可以用若干键值对来描述他:

var xiaoming = {
  name: '小明',
  birth: 1990,
  school: 'No.1 Middle School',
  height: 1.70,
  weight: 65,
  score: null
};

JavaScript用一个{...}表示一个对象,键值对以xxx: xxx形式申明,用,隔开。注意,最后一个键值对不需要在末尾加,,如果加了,有的浏览器(如低版本的IE)将报错。

上述对象申明了一个name属性,值是'小明',birth属性,值是1990,以及其他一些属性。最后,把这个对象赋值给变量xiaoming后,就可以通过变量xiaoming来获取小明的属性了:

xiaoming.name; // '小明'
xiaoming.birth; // 1990

访问属性是通过.操作符完成的,但这要求属性名必须是一个有效的变量名。如果属性名包含特殊字符,就必须用''括起来:

var xiaohong = {
  name: '小红',
  'middle-school': 'No.1 Middle School'
};

xiaohong的属性名middle-school不是一个有效的变量,就需要用''括起来。访问这个属性也无法使用.操作符,必须用['xxx']来访问:

xiaohong['middle-school']; // 'No.1 Middle School'
xiaohong['name']; // '小红'
xiaohong.name; // '小红'

也可以用xiaohong['name']来访问xiaohong的name属性,不过xiaohong.name的写法更简洁。我们在编写JavaScript代码的时候,属性名尽量使用标准的变量名,这样就可以直接通过object.prop的形式访问一个属性了。

实际上JavaScript对象的所有属性都是字符串,不过属性对应的值可以是任意数据类型。

如果访问一个不存在的属性会返回什么呢?JavaScript规定,访问不存在的属性不报错,而是返回undefined:

var xiaoming = {
  name: '小明'
};
xiaoming.age; // undefined

由于JavaScript的对象是动态类型,你可以自由地给一个对象添加或删除属性:

var xiaoming = {
  name: '小明'
};
xiaoming.age; // undefined
xiaoming.age = 18; // 新增一个age属性
xiaoming.age; // 18
delete xiaoming.age; // 删除age属性
xiaoming.age; // undefined
delete xiaoming['name']; // 删除name属性
xiaoming.name; // undefined
delete xiaoming.school; // 删除一个不存在的school属性也不会报错

如果我们要检测xiaoming是否拥有某一属性,可以用in操作符:

var xiaoming = {
  name: '小明',
  birth: 1990,
  school: 'No.1 Middle School',
  height: 1.70,
  weight: 65,
  score: null
};
'name' in xiaoming; // true
'grade' in xiaoming; // false

不过要小心,如果in判断一个属性存在,这个属性不一定是xiaoming的,它可能是xiaoming继承得到的:

'toString' in xiaoming; // true

因为toString定义在object对象中,而所有对象最终都会在原型链上指向object,所以xiaoming也拥有toString属性。

要判断一个属性是否是xiaoming自身拥有的,而不是继承得到的,可以用hasOwnProperty()方法:

var xiaoming = {
  name: '小明'
};
xiaoming.hasOwnProperty('name'); // true
xiaoming.hasOwnProperty('toString'); // false

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
IE8 引入跨站数据获取功能说明
Jul 22 Javascript
jquery制作搜狐快站页面效果示例分享
Feb 21 Javascript
js简单抽奖代码
Jan 16 Javascript
不同编码的页面表单数据乱码问题解决方法
Feb 15 Javascript
分享9点个人认为比较重要的javascript 编程技巧
Apr 27 Javascript
继续学习javascript闭包
Dec 03 Javascript
Vue.js仿微信聊天窗口展示组件功能
Aug 11 Javascript
Thinkphp5微信小程序获取用户信息接口的实例详解
Sep 26 Javascript
JS高级技巧(简洁版)
Jul 29 Javascript
小程序分享链接onShareAppMessage的具体用法
May 22 Javascript
vue实现打地鼠小游戏
Aug 21 Javascript
适合后台管理系统开发的12个前端框架(小结)
Jun 29 Javascript
JavaScript订单操作小程序完整版
Jun 23 #Javascript
详解vue模拟加载更多功能(数据追加)
Jun 23 #Javascript
JavaScript实现简单的树形菜单效果
Jun 23 #Javascript
AngularJS 限定$scope的范围实例详解
Jun 23 #Javascript
QRCode.js:基于JQuery的生成二维码JS库的使用
Jun 23 #jQuery
js实现城市级联菜单的2种方法
Jun 23 #Javascript
JS使用正则表达式验证身份证号码
Jun 23 #Javascript
You might like
PHP 定界符 使用技巧
2009/06/14 PHP
PHP中几个常用的魔术常量
2012/02/23 PHP
PHP上传图片进行等比缩放可增加水印功能
2014/01/13 PHP
PHP命名空间(Namespace)简明教程
2014/06/11 PHP
smarty的section嵌套循环用法示例
2016/05/28 PHP
thinkphp框架类库扩展操作示例
2019/11/26 PHP
PHP实现递归的三种方法
2020/07/04 PHP
discuz论坛更换域名,详细文件修改步骤
2020/12/09 PHP
NodeJS 模块开发及发布详解分享
2012/03/07 NodeJs
关于jquery css的使用介绍
2013/04/18 Javascript
javascript获得网页窗口实际大小的示例代码
2013/09/21 Javascript
JavaScript利用正则表达式去除日期中的-
2014/06/09 Javascript
使用jquery prev()方法找到同级的前一个元素
2014/07/11 Javascript
jquery中post方法用法实例
2014/10/21 Javascript
jQuery中$.each使用详解
2015/01/29 Javascript
jquery实现一个简单的表单验证实例
2016/03/30 Javascript
jQuery validate 验证radio实例
2017/03/01 Javascript
Ionic3 UI组件之autocomplete详解
2017/06/08 Javascript
详解基于Bootstrap+angular的一个豆瓣电影app
2017/06/26 Javascript
快速掌握jquery分页插件jqPaginator的使用方法
2017/08/09 jQuery
vue slot与传参实例代码讲解
2019/04/28 Javascript
JS中如何轻松遍历对象属性的方式总结
2019/08/06 Javascript
解决vue bus.$emit触发第一次$on监听不到问题
2020/07/28 Javascript
[04:40]2016国际邀请赛中国区预选赛全程TOP10镜头集锦
2016/07/01 DOTA
Python解决八皇后问题示例
2018/04/22 Python
Python代码缩进和测试模块示例详解
2018/05/07 Python
解决Pycharm出现的部分快捷键无效问题
2018/10/22 Python
如何通过雪花算法用Python实现一个简单的发号器
2019/07/03 Python
使用tensorflow框架在Colab上跑通猫狗识别代码
2020/04/26 Python
利用CSS3的线性渐变linear-gradient制作边框的示例
2016/06/02 HTML / CSS
加拿大最大的五金、家居装修和园艺产品商店:RONA
2017/01/27 全球购物
校运会广播稿100字
2014/01/27 职场文书
煤矿开采专业求职信
2014/07/08 职场文书
泰坦尼克号观后感
2015/06/04 职场文书
运动会广播稿50字
2015/08/19 职场文书
SQL Server删除表中的重复数据
2022/05/25 SQL Server