码迷,mamicode.com
首页 > 编程语言 > 详细

Javascript我学之五对象的创建与使用

时间:2015-07-24 23:54:24      阅读:137      评论:0      收藏:0      [点我收藏+]

标签:

本文是金旭亮老师网易云课堂的课程笔记,记录下来,以供备忘。

对象的创建

JavaScript对象有两种类型
 
1).Native:在ECMAScript标准中定义和描述,包括JavaScript内置对象(数组,日期对象等)和用户自定义对象。
 
2).Host:在主机环境(如浏览器)中实现并提供给开发者使用,比如windows对象和所有的DOM对象
 
 
 

对象的含义

Object is an unordered collection of properties each of which contains a primitive value, object, or function.
                                                                                                                                                                                    ——ECMA-262
 
技术分享
 
 
 

创建对象

1.)定义空对象之后再添加成员

      最简单的方法(称为object literal,对象字面量):
1 var myObject = {};

      之后便可以向它添加新成员:

1 myObject.name = "张三";
2 myObject.age = 29;

2).使用对象字面量

      对象字面量就是包围在一对花括号中的零或多个“name/value"对。

1         //通过对象字面量创建对象 属性的名字可以加也可以不加双引号
2         var person = {
3             "name": "张三",
4             age: 29
5         };

 嵌套的对象定义

使用对象字面量方式,定义嵌套的对象很容易

 1         //使用字面量创建嵌套的对象
 2         var embedObj = {
 3             info: "information",
 4             //内嵌的对象
 5             inner: {
 6                 id: 0,
 7                 value: 100
 8             },
 9             //内嵌的数组
10             arr: ["one", "two", "three"]
11         };

定义对象方法

 1).对象的方法,其实是一个“函数”类型的属性,可以使用对象字面量方式定义:
1         //定义对象方法
2         var obj = {
3             sayHello: function (name) {
4                 console.info("你好," + name + "!");
5             }
6         };
7         obj.sayHello("qiu");  //你好,qiu

2).也可以直接追加到现有对象中.

1         var obj2 = {};
2         obj2.sayHello = function (name) {
3             console.info("你好," + name + "!");
4         };

对象的使用

[].表示法访问对象属性.可以通过||指定默认值 
 
 1         //访问对象
 2         var exampleObj = {
 3             info: "information",
 4             //内嵌的对象
 5             inner: {
 6                 id: 0,
 7                 value: 100
 8             },
 9             //内嵌的数组
10             arr: ["one", "two", "three"],
11             //方法
12             sayHello: function (name) {
13                 console.info("你好," + name + "!");
14             }
15         };
16         //使用点表示法访问对象属性
17         console.info(exampleObj.info);  //information
18         console.info(exampleObj.inner.value);  //100
19         console.info(exampleObj.arr[0]); //one
20         //如果要访问的属性不存在,可以使用||指定默认值
21         console.info(exampleObj.notExist || "属性默认值"); //属性默认值
22         //使用[]访问对象属性
23         console.info(exampleObj[info]);   //information
24         //调用对象方法
25         exampleObj.sayHello(张三);        //你好,张三
26         exampleObj[sayHello](李四);      //你好,李四

枚举对象属性

 因为对象可看成是属性的集合,因此可以通过迭代的方式获取其所有属性:
1         //编程列出exampleObj对象的属性与方法
2         for (var p in exampleObj) {
3             console.info(p+ "类型:" + (typeof exampleObj[p]) );
4         }
5 //        info类型:string 
6 //        inner类型:object 
7 //        arr类型:object
8 //        sayHello类型:function

对象的属性可以随时添加与删除

1         //删除对象的属性与方法
2         delete exampleObj.info;
3         delete exampleObj.sayHello;

删除一个对象属性之后,再对它进行访问,将得到一个undefined。

1         //验证属性己删除
2         console.info(exampleObj.info);//undefined
3         console.info(exampleObj.sayHello === undefined); //true
4         //exampleObj.sayHello(‘张三‘); //TypeError

处理TypeError:

            当JavaScript引擎在解析JavaScript代码时,如果出现TypeError异常,它将中断解析工作,导致后面的代码不会被执行,为了避免出现这种情况,可以使用&&运算符提前“取消”本条语句的执行,继续执行后面的代码:
 
1 //使用&&避免出现TypeError导致后继代码无法执行
2 exampleObj.sayHello && exampleObj.sayHello(张三);
3 //尽管sayHello方法己被删除,上述代码得到一个undefined
4 //但后面的代码仍然可以继续执行

对象作为函数参数

示例:
 1         //作为函数参数的对象
 2         function displayPerson(person) {
 3             console.info(name= + (person.name || 无名氏));
 4             console.info(age= + (person.age || -1));
 5         };
 6         //使用对象字面量直接将对象传入
 7         displayPerson({
 8             "name": "张三",
 9             "age": 29
10         }); //name=张三 
11             //age = 29 
12         displayPerson({});  //name=无名氏 
13                             //age=-1 

 

 
 
 
 
 
 

 

Javascript我学之五对象的创建与使用

标签:

原文地址:http://www.cnblogs.com/xiaoguanqiu/p/4674919.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!