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

短命女 2022-07-14 02:47 11阅读 0赞

要点  
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()比较函数；

结果：（1）0 1 2 4 6 9  
           （2）9 6 4 2 1 0   
  
  
（5）操作方法  
有三种：concat()  
a、concat()——基于原来的数组创造一个新数组；  
b、slice()——指定作用范围域的数组；  
b-1：取元素