您的位置:首页 > Web前端 > JavaScript

JS 学习笔记--5---对象和数组

2014-01-02 10:23 405 查看
1、Object类型(引用类型) 不具备多少功能,但是对于在ECMAScript中存储和传递数据确实,确是很理想的选择。

  创建方式:(1)、使用new Object();方式创建对象,然后对对象进行设置属性及其值 eg:var box=new Object(); box.name='abc'; box.age=21;这样就创建了一个对象,并且具有两个属性,名为name和age,其值为'abc'和21;

   (2)、按照一种的方法 也可以省去关键字 new;即var box=Object();

   (3)、按照字面量创建,即 var box={name:'abc',age:21};这种方法来创建对象, 注意:对象的属性和值是以键值对形式出现;每一个属性的键值对之间必须是以逗号隔开,最后一个属性后面可有可无逗号。 (4)、在(3)的创建方法中属性名可以用引号给括起来

   (5)、使用方法(3)的字面量方法来创建对象,然后用方法(1)的形式来对对象进行属性的设置

  (6)、调用属性的两种方法:a:用对象名点的形式:box.name;这种不需要给属性名加引号 b:中括号形式,(注意引号):box['name'] ;这种方法访问属性是属性名必须加引号,否则 浏览器会把其中的属性名当做变量来处理

  (7)、注册和访问方法: 注册:同样是box.run=..;来给属性run注册成方法,run后面不能添加括号。即前面和属性是一样的;等号后面可以写上具体的方法名(可以带括号也可以不带括号),也可以写一个匿名函数;字面量形式定义对象的时候同样是run:function()...;一般是用匿名函数

  访问:如果写的是匿名函数或者是具体的方法名没有带(box.run=Run;Run是定义好的方法)括号,那么在调用的时候需要在run后面添加括号,即:box.run(); 否则返回的是以关键字function开头的整个的方法实体内容;如果注册的时候写的是方法名加括号【box.run=Run();】,那么在调用的时候是不需要加括号的(box.run;即可),否则会报错(box.run();//error)

  (8)、使用 delete 课以删除对象的属性(只是删除了属性的值): delete box.name;//删除属性

练习代码:

/* 对象中的方法
//转换方法,对象和数组都有 toString(),valueOf(),toLocaleString()方法
//toString(),valueOf()两种方法,无论重写了谁  都会返回相同的返回值,即等价的
//toLocaleString()方法是转换成本地的字符串形式显示

var box=['hexiong','hahha','abcd','erty'];
alert(box);//hexiong,hahha,abcd,erty    隐试的调用了 toString() 方法
alert(box.toString());//hexiong,hahha,abcd,erty
alert(box.valueOf());//hexiong,hahha,abcd,erty
alert(box.toLocaleString());//hexiong,hahha,abcd,erty

var age=['hexiong','hahha',new Date()];//创建了一个新的时间
alert(age);//hexiong,hahha,Wed Jan 01 2014 13:32:53 GMT+0800 (China Standard Time)
alert(age.toString());//hexiong,hahha,Wed Jan 01 2014 13:32:53 GMT+0800 (China Standard Time)
alert(age.valueOf());//hexiong,hahha,Wed Jan 01 2014 13:32:53 GMT+0800 (China Standard Time)
alert(age.toLocaleString());//hexiong, hahha, ‎2014‎-‎01‎-‎01‎ ‎13‎:‎34‎:‎08 本地字符串形式显示

//默认情况下  数组一般都是用逗号分隔输出数组还有一个方法 join()方法,使用不同分隔符构建输出字符串
var box=["ooii","uiui","qeqe","abcd"];
alert(box);//ooii,uiui,qeqe,abcd
alert(box.join('|'));//ooii|uiui|qeqe|abcd        将数组的元素,按照|连接输出,返回字符串
alert(typeof box.join('|'));//string    方法返回的是字符串
alert(box);//ooii,uiui,qeqe,abcd    上述方法处理后  元数组是没有变化的,说明处理的是拷贝数据

//栈方法    push(),pop()    先进后出,一次可以压栈多个元素  只能够出栈一个元素
var box=["四川","巴中","自贡"];
alert(box);//四川,巴中,自贡
alert(box.push('绵阳'));//4        入栈,即在数组的最后添加一个元素,然后返回数组的现在长度
alert(box);//四川,巴中,自贡,绵阳    看出push()方法是对数组引用进行操作
alert(box.push('宜宾','内江'));//6        一次按照顺序插入多个
alert(box.join(' '));//四川 巴中 自贡 绵阳 宜宾 内江

var box=["四川","巴中","自贡",'宜宾','内江'];
alert(box.join(' '));//四川 巴中 自贡 宜宾 内江
alert(box.pop());//内江        将数组的最后一个元素弹出,也就是删除,然后返回删除的对象的值
alert(typeof box.pop());//string
alert(box.join(' '));////四川 巴中 自贡
alert(box.push('宜宾','内江'));//5
alert(box.pop(2));//内江    pop()方法没有重载  一次只能够弹出一个元素
alert(box.length);//4

//队列方法    先进先出  push()(从后插入多个元素)  shift()(开头移除一个元素) unshift()(开头插入多个元素)
var box=["四川","巴中","自贡"];
alert(box.push('宜宾','内江'));//从数组后面添加两个元素,(队列的末尾添加元素),返回最新长度
alert(box.join(' '));//四川 巴中 自贡 宜宾 内江
alert(box.shift());//四川    弹出前面第一个元素
alert(box.join(' '));//巴中 自贡 宜宾 内江
alert(box.unshift('四川'));//从队列的开头(数组第0个元素)插入一个数据,返回数组的最新长度
alert(box.join(' '));//四川 巴中 自贡 宜宾 内江
alert(box.unshift('12','34'));//7    多个元素插入的时候是从后插入,和push()从前开始插入相反
alert(box.join(' '));//12 34 四川 巴中 自贡 宜宾 内江

//重新排序方法    reverse() 逆序输出    sort()从小到大排序  操作的是引用
//reverse() 方法是操作的数组的引用
var box=[3,4,5,6,7,5];
alert(box.join(' '));//3 4 5 6 7 5
alert(typeof box.reverse());//object
alert(box.reverse());//3 4 5 6 7 5    此处和上面一条语句进行了两次 reverse(),故原序输出
alert(box.join(' '));//3 4 5 6 7 5
var age=box.reverse();
alert(age.join(' '));//5 7 6 5 4 3

var box=[3,5,6,3,1];
alert(box);//3,5,6,3,1
alert(box.sort());//1,3,3,5,6
alert(box);//1,3,3,5,6        原数组也被排序了 说明操作的是引用

//之所以出现下面这种情况是 因为他是按照数值字符串形式来从小到大排序的
var box=[23,56,12,2,1];
alert(box);
alert(box.sort());//1,12,2,23,56

//比较数值的时候一般传递一个方法进去
//方法两个参数,如果第一个参数大于第二个返回整数,小于返回负数,等于返回0
function compare(value1,value2){
if(value1>value2){    //这个方法的返回值是规定的,如果想从大到小也最好不要修改返回值
return 1;
}else if(value1<value2){
return -1;
}else{
return 0;
}
}
var box=[23,56,12,2,1];
alert(box);
alert(box.sort(compare));//1,2,12,23,56
//如果要按照从大到小排序,则将从小到大排序的数组 在用一次reverse方法就OK
alert(box.reverse());

//操作方法  concat()基于当前数组创建一个新的数组  slice()基于当前数组获取自定区域并创建数组
splice()主要用途是插入元素,可以有删除元素的功能

//concat()函数时在当前数组后面插入元素,并且将得到的新的数组返回,是操作的原数组的数据
var box=['四川','巴中','自贡','绵阳','德阳'];
alert(box);//四川,巴中,自贡,绵阳,德阳
var age=box.concat(2);    //非引用操作
alert(age);//四川,巴中,自贡,绵阳,德阳,2
alert(box);//四川,巴中,自贡,绵阳,德阳
age=box.concat('4','3');
alert(age);//四川,巴中,自贡,绵阳,德阳,4,3

//slice(x,y) 从原数组的下标为x的元素开始取,取到下标为y的元素位置,不包含y,
var box=['四川','巴中','自贡','绵阳','德阳'];
alert(box);//四川,巴中,自贡,绵阳,德阳
var age=box.slice(2,4);
alert(age);//自贡,绵阳
alert(box);//四川,巴中,自贡,绵阳,德阳
alert(box.slice(2));//自贡,绵阳,德阳
var age=box.slice(2,-3);//输出为空

//splice() 方法操作的是引用
//splice()中的删除功能    只是需要传递两个参数,但是第二个参数为索引的元素也被截取
var box=['四川','巴中','自贡','绵阳','德阳'];
alert(box);//四川,巴中,自贡,绵阳,德阳
var age=box.splice(1,3);
alert(age);//巴中,自贡,绵阳
alert(box);//四川,德阳
alert(box.splice(1,-1));//输出为空

//插入功能        三个参数以上,第一次参数代表位置,第二个参数为0代表不截取,后面为插入的元素
var box=['四川','巴中','自贡','绵阳','德阳'];
alert(box);//四川,巴中,自贡,绵阳,德阳
var x=box.splice(1,0,'23','45');//第二个参数小于等于0(一般等于0),就是代表没有截取,然后从下标为1出插入两条数据
alert(box);//四川,23,45,巴中,自贡,绵阳,德阳
alert(x);//应该是返回的被截取的数据  但是此处是截取的0个元素 故为空
alert(typeof box.splice(1,0,'23','45'));//object

//替换功能        第一个参数为位置,第二个参数为要替换几个数,后面为替换后的参数
//返回被替换的数据        替换掉的参数的个数和替换后的参数个数没有任何关系,完全是挖一个大坑,再装东西
var box=['四川','巴中','自贡','绵阳','德阳'];
alert(box);//四川,巴中,自贡,绵阳,德阳
alert(box.splice(1,2,'34','34','34'));//巴中,自贡    参数二小于等于0就是插入
alert(box);//四川,34,34,34,绵阳,德阳

*/


View Code
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: