Javascript高级程序设计——7.对象和数组

要点

1、Object类型

2、Array类型

3、对象中的方法

对象定义——

其实是一种类型，即引用类型。对象的值，即引用类型的实例。

ECMAScript中引用类型时一种数据结构，用于将数据和功能组织在一起，该引用类型常称为“类”，但并没这东西。

此外，虽说ECMAScript是一种面型对象的语言，但并不具备面向对象语言所支持的类和接口技术。

1、Object类型

作用：用于创建对象

方法1：采用new关键字
var box=new Object();
box.name='Zhao';
box.age=21;

方法2：不采用new关键字，仅有object()

var box=Object();
box.name='zhao';
box.age=21;

方法3：:采用字面量方式创建对象（封装对象）

var box={
name:'zhao',
age:21
};

（1）输出方式（2种）

alert(box.age);   //传统的；
alert(box['age']);  //数组的方式；

（2）对象包含两种元素

“方法+函数”

a、方法——与函数同义

var box={
name:'zhao',
age:21,
run:function(){   //匿名函数；
return '123';
}
};
alert(box.run()); //有括号才会有返回值，无括号返回整个函数；

b、对象——

b-1：给对象创建方法

var box={
run:function(){
return "运行";       //对象中的方法；
}
};

alert(box.run());  //调用对象中的方法；

b-2：delete删除对象属性

var box={
name:'zhao';
};
alert(box.name);
delete(box.name);
alert(box.name);

结果：先打印出“zhao”，其次返回“undefined”（由于delete删除了box.name属性）

b-3：采用字面量的声明——“封装”

该方式是函数传递大量可选参数的首选方式

function box(obj){
if(obj.name!=undefined)alert(obj.name);
if(obj.age!=undefined)alert(obj.age);
}

box({   //调用函数传递一个对象；
name:'zhao';
age:21;
});

2、Array类型

（1）创建方式有两种

a、new关键字

a-1：无参数

var box=new Array();  //创建一个空数组；
alert(box);      //null空；
alert(typeof box);   //object；

a-2：无参数

var box=new Array();  //创建一个空数组；
alert(box);      //null空；
alert(typeof box);   //object；

a-3：创建数组，10个元素

var box=new Array(10);  //默认传入10个元素；
box[2]='zhao';
alert(box);

  结果：“..zhao.......”（“.”表示默认的数字）

b、省略new关键字

var box=Array();
alert(box);   //null空
alert(typeof box);  //object；

c、字面量方式创建数组，并分配元素

var box=['zhao',21];
alert(box);

d、下列操作不允许，会造成不兼容问题

（1）“，”号使用造成IE

var box=[1,2,];
alert(box.length);
//IE会显示3

（2）一堆“.”也会出错
var  box=[....];

（2）数组下标的问题（索引下标0,1,2    非索引数字下标）

a、索引数字下标

var box=[];
box[0]='zhao';
box[1]=21;
alert(box);    //该表示为索引下标，所以可以在数组体现出来；

b、非数字下标

var box=[];
box['name']='zhao';
box['age']=21;
alert(box);  //会出错，不会直接在数组中体现出来；

（3）创建一个稍微复杂的数组

var box=[
{
name:'zhao';
age:21
},
[1,2,3,'shanghai',new Object()],
new Array(1,2,3)
];

alert(box);

结果：[object object] 1 2 3 shanghai object 1 2 3

注意：若要打印“zhao”，则需要

alert(box[0].name);

3、对象中的方法

（1）转换方法

内置方法——toString()、valueof()、toLocaleString()

注意：toLocaleString()表示本地格式区域字符串功能，一般在日期或时间使用居多

var box=['zhao',21,new Date()];
alert(box);
alert(box.toString());
alert(box.valueof());
alert(box.toLocaleString());  //本地格式区域字符串；

默认情况下，会以逗号隔开。

若采用join关键字，则可以采用不同的分隔符来构建字符串

var box=['zhao',21,'abc'];
alert(box.join('|'));  //以“|”分割开来；

结果：zhao|21|abc

（2）栈方法——“后进先出”

两种方法：pop() 、push()

a、push()：表示在数组的末尾进行添加任意元素，同时返回数组的最新长度

b、pop()：表示数组的末尾移出元素，移除末尾第一个，数组长度减1，返回移除的元素；

var box=['zhao',21];
alert(box.push('shanghai','beijing'));
alert(box);
alert(box.pop());   //移除数组最后的元素，并且返回移除的元素；
alert(box);

（3）队列方法——“先进先出”

shift()：表示移除数组开头的元素；

var box=['zhao',21];
alert(box.push('shanghai','beijing'));
alert(box);
alert(box.shift());   //移除数组开头的元素，并且返回移除的元素；
alert(box);

unshift()：表示在数组前端添加元素，并且返回最新的长度

（4）排序方法

a、reverse()——表示排序倒序

var box=[1,2,3,4,5];
alert(box.reverse());   //方法执行后返回一个逆序的；
alert(box); // 原数组也被反向排序，就说明被引用；

b、sort()——表示从小到大排序

var box=[2,5,3,1,4,8];
alert(box.sort());   //从小到大排序；
alert(box);

若排序的数字中有0时，可能会出现错误，需要借助compare()比较函数；

function compare(value1,value2){
if(value1>value2){
return 1;
}
else if(value1<value2){
return -1;
}
else{
return 0;
}
}

var box=[1,4,2,6,0,9];
alert(box.sort(compare));
alert(box.reverse());    //逆向排序；

结果：（1）0 1 2 4 6 9

           （2）9 6 4 2 1 0 

（5）操作方法

有三种：concat()

a、concat()——基于原来的数组创造一个新数组；

b、slice()——指定作用范围域的数组；

b-1：取元素

var box=['zhao',28,'zhengzhou'];
var box2=box.slice(1,3);
alert(box2);   //从第一个位置取到第三个位置；

结果：28 zhengzhou

b-2：替换元素

var box=['zhao',21,'zhengzhou'];
var box2=box.splice(1,1,'hangzhou','shanghai');//第2个“1”表示删除；
alert(box2);
alert(box);

结果：zhao  hangzhou  shanghai  zhengzhou

b-3：插入元素

var box=['zhao',21,'zhengzhou'];
var box2=box.splice(1,0,'hangzhou','shanghai');//第2个“0”表示不删除；
alert(box2);
alert(box);

结果：zhao hangzhou shanghai  21 zhengzhou