javascript对象的创建和访问


Posted in Javascript onMarch 08, 2016

JavaScript,很少能让人想到它面向对象的特性,甚至有人说它不是面向对象的语言,因为它没有类。没错, JavaScript 真的没有类,但 JavaScript 是面向对象的语言。 JavaScript 只有对象,对象就是对象,不是类的实例。
因为绝大多数面向对象语言中的对象都是基于类的,所以经常有人混淆类的实例与对象的概念。对象就是类的实例,这在大多数语言中都没错,但在 JavaScript 中却不适用。JavaScript 中的对象是基于原型的。

创建和访问

JavaScript 中的对象实际上就是一个由属性组成的关联数组,属性由名称和值组成,值的类型可以是任何数据类型,或者函数和其他对象。注意 JavaScript 具有函数式编程的特性,所以函数也是一种变量,大多数时候不用与一般的数据类型区分。

在 JavaScript 中,你可以用以下方法创建一个简单的对象:

var foo = {};
foo.prop_1 = 'bar';
foo.prop_2 = false;
foo.prop_3 = function() {
return 'hello world';
}
console.log(foo.prop_3());

以上代码中,我们通过 var foo = {}; 创建了一个对象,并将其引用赋值给 foo,
通过 foo.prop1 来获取它的成员并赋值,其中 {} 是对象字面量的表示方法,也可以用 var foo = new Object() 来显式地创建一个对象。
1. 使用关联数组访问对象成员
我们还可以用关联数组的模式来创建对象,以上代码修改为:

var foo = {};
foo['prop1'] = 'bar';
foo['prop2'] = false;
foo['prop3'] = function() {
return 'hello world';
}

在 JavaScript 中,使用句点运算符和关联数组引用是等价的,也就是说任何对象(包括
this 指针)都可以使用这两种模式。使用关联数组的好处是,在我们不知道对象的属性名称的时候,可以用变量来作为关联数组的索引。例如:

var some_prop = 'prop2';
foo[some_prop] = false;

2.使用对象初始化器创建对象
上述的方法只是让你对JavaScript对象的定义有个了解,真正在使用的时候,我们会采用下面这种更加紧凑明了的方法:

var foo = {
  'prop1': 'bar',
  prop2: 'false',
  prop3: function (){
  return 'hello world';
  }
};

这种定义的方法称为对象的初始化器。注意,使用初始化器时,对象属性名称是否加引号是可选的,除非属性名称中有空格或者其他可能造成歧义的字符,否则没有必要使用引号。

以上就是javascript创建和访问对象的实现方法,希望对大家的学习有所帮助。

Javascript 相关文章推荐
jquery获得keycode的示例代码
Dec 30 Javascript
深入理解JavaScript系列(19):求值策略(Evaluation strategy)详解
Mar 05 Javascript
javascript中SetInterval与setTimeout的定时器用法
Aug 24 Javascript
canvas实现探照灯效果
Feb 07 Javascript
Vue使用vue-cli创建项目
Sep 01 Javascript
让bootstrap的carousel支持滑动滚屏的实现代码
Nov 27 Javascript
Vue下滚动到页面底部无限加载数据的示例代码
Apr 22 Javascript
webstorm中vue语法的支持详解
May 09 Javascript
node app 打包工具pkg的具体使用
Jan 17 Javascript
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
Jun 10 jQuery
layui table 多行删除(id获取)的方法
Sep 12 Javascript
vue下的@change事件的实现
Oct 25 Javascript
js获取当前日期时间及其它日期操作汇总
Mar 08 #Javascript
使用JQuery实现智能表单验证功能
Mar 08 #Javascript
js表单处理中单选、多选、选择框值的获取及表单的序列化
Mar 08 #Javascript
JS实现设置ff与ie元素绝对位置的方法
Mar 08 #Javascript
Angularjs material 实现搜索框功能
Mar 08 #Javascript
jQuery控制frames及frame页面JS的方法
Mar 08 #Javascript
三种Node.js写文件的方式
Mar 08 #Javascript
You might like
通俗易懂的php防注入代码
2010/04/07 PHP
Codeigniter上传图片出现“You did not select a file to upload”错误解决办法
2014/06/12 PHP
PHP中生成UUID自定义函数分享
2015/06/10 PHP
php多线程实现方法及用法实例详解
2015/10/26 PHP
解决PHP 7编译安装错误:cannot stat ‘phar.phar’: No such file or directory
2017/02/25 PHP
js null undefined 空区别说明
2010/06/13 Javascript
JavaScript高级程序设计(第3版)学习笔记6 初识js对象
2012/10/11 Javascript
向当前style sheet中插入一个新的style实现方法
2013/04/01 Javascript
一个支持任意尺寸的图片上下左右滑动效果
2014/08/24 Javascript
一个JavaScript操作元素定位元素的实例
2014/10/29 Javascript
javascript进行四舍五入方法汇总
2014/12/16 Javascript
JQuery自动触发事件的方法
2015/06/13 Javascript
jQuery Validate插件实现表单强大的验证功能
2015/12/18 Javascript
jQuery中判断对象是否存在的方法汇总
2016/02/24 Javascript
jQuery基础的工厂函数以及定时器的经典实例分析
2016/05/20 Javascript
关于JS 预解释的相关理解
2016/06/28 Javascript
如何检测JavaScript的各种类型
2016/07/30 Javascript
php简单数据库操作类的封装
2017/06/08 Javascript
JavaScript定义函数的三种实现方法
2017/09/23 Javascript
微信小程序网络请求封装示例
2018/07/24 Javascript
JavaScript如何把两个数组对象合并过程解析
2019/10/10 Javascript
[49:15]DOTA2-DPC中国联赛 正赛 CDEC vs XG BO3 第二场 1月19日
2021/03/11 DOTA
python做量化投资系列之比特币初始配置
2018/01/23 Python
python占位符输入方式实例
2019/05/27 Python
django框架两个使用模板实例
2019/12/11 Python
基于Python实现简单学生管理系统
2020/07/24 Python
简洁自适应404页面HTML好看的404源码
2020/12/16 HTML / CSS
ABOUT YOU匈牙利:500个最受欢迎的时尚品牌
2019/07/19 全球购物
客服服务心得体会
2013/12/30 职场文书
学校安全生产承诺书
2014/05/23 职场文书
开展党的群众路线教育实践活动总结报告
2014/10/31 职场文书
七年级之家长会发言稿范文
2019/09/04 职场文书
redis 限制内存使用大小的实现
2021/05/08 Redis
React Native项目框架搭建的一些心得体会
2021/05/28 Javascript
详解gantt甘特图可拖拽、编辑(vue、react都可用 highcharts)
2021/11/27 Vue.js
vue css 相对路径导入问题级踩坑记录
2022/06/05 Vue.js