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

/*
//用new关键字来创建一个对象
var box=new Object();
box.name="qigang";
box.age=22;
box.height=175;
alert(box);//object Object
alert(typeof box);//object
alert(box.name);//qigang
alert(box.age);//22
alert(box['height']);//175
//alert(box[height]);//error height not undefiened
var height='height';
alert(box[height]);//175 说明上面的错误是因为 浏览器把height当成一个变量名 //不使用 new 关键字，同样可以创建一个对象
var box=Object();
box.name='abc';
alert(box["name"]);// abc //字面量创建对象的时，对象的属性和值是以键值对形式出现；里面不能够出现分号
//每一个属性的键值对之间必须是以逗号隔开，最后一个属性后面可有可无逗号
var box={
name:"abcd",
age:22,
he:175
}
alert(box.name);
alert(box.age);
alert(box["he"]); //使用字面量和传统的赋值形式来创建对象
var box ={};
box.name="abcd";
box.age="22";
box.height="175";
alert(box["name"]);
alert(box['age']);
alert(box.height); //给对象创建方法
//由于赋值的时候可能是直接赋值的匿名函数，那么在调用的时候需要加括号，否则输出的是函数的实体
//如果不是赋值的匿名函数 而是已经写好的函数，赋值的时候如果是写的函数名加括号，
//调用的时候就不需要在属性名后面添加括号，如果只是将方法名赋给了属性，
//那么调用的时候就需要添加括号，否则打印出来的是函数实体，因为这和匿名方法等价
var box=new Object();
box.name='abc';
//其实run也是一个属性，故下面的第一个打印方法输出是方法体，
box.run=function(){return '123'};
alert(box.run);//打印出的是方法 方法体 function(){return '123'};
alert(box.run());//123 function obc(){return 123;};
var box=new Object();
box.name='abc';
box.run=obc; //是赋值的方法名 古仔调用的时候需要添加括号
alert(box.run);//方法体 function obc(){return 123;};
alert(box.run());//123 function obc(){return 123;};
var box=new Object();
box.name='abc';
box.run=obc();//外部写好的函数在赋给属性的时候添加了括号，
alert(box.run);//123
//alert(box.run());//error 上面给属性赋值方法的时候，方法已经添加了括号，故此处就不需要括号 //下面的三个程序段 看出，给对象注册方法的时候，其实是属性指向方法，而不是真真的方法
//注册方法是 是不能够在属性名后面添加一个显示的括号表明是方法
function obc(){return 123;};
var box=new Object();
box.name='abc';
box.run()=obc;//error
alert(box.run);//
alert(box.run());// var box=new Object();
box.name='abc';
box.run()=function obc(){return 123;};//不能够够这样赋值
alert(box.run);
alert(box.run()); function obc(){return 123;};
var box=new Object();
box.name='abc';
box.run()=obc();//error
alert(box.run);//
alert(box.run());// //删除属性 其实不是删除属性 只是删除了属性的值
var box={
name:123
}
alert(box.name);
alert(typeof box.name);
delete box.name;
alert(box.name);
alert(typeof box.name); //一般开发中很多时候都是使用字面量创建方式 给人一种封装的感觉 而且代码少
//字面量也是传递大量参数的时候进行首选的方式
function Box(obj){
////当进行大量参数的传递的时候需要判断的 健壮的程序也是需要进过很多的判断
if(obj.name!=undefined)alert(obj.name);//qigang
if(obj.age)alert(obj.age);//22
alert(obj.height);//174
//等等下面还有很多参数
}; Box({ //定义一个字面量对象 直接传递大量的数据过去
name:'qignag',
age:22,
height:174,
weight:60,
love:'null'
});
*/

var box=[3,5,'abcd',//前面两个个元素是number类型，第三个元素是string类型
{
name:'qigang',run:function(){return 'run';}
},//第四个类型是Object类型
34+22,//第五个是算术表达式
[5,6,7,8],//第六个是字面量数组
new Array("mayun",'liyanhong','mahuateng')//第七个是数组
];
alert(box);//3,5,abcd,[object Object],56,5,6,7,8,mayun,liyanhong,mahuateng
alert(typeof box[0]);//number
alert(typeof box[2]);//string
alert(typeof box[3]);//object
alert(box[3].name);//qigang
alert(box[3].run());//run
alert(box[5][2]);//7
alert(box[6][2]);//mahuateng

/*
//使用new关键字 创建数组 当然下面三种创建方法 关键字new也是可以省略的
//创建数组
var box=new Array(); //创建一个数组
box[0]='abc'; //给数组添加第一个元素
box[2]='chd'; //给元素添加第三个元素，其中第二个元素为空
alert(box); //abc,,chd var box=new Array('qignag',22,'nan',175);//创建数组并对其进行初始化变量
alert(box);//qigang,22,nan,175 //在创建的时候，指定数组有几个元素，
var box=new Array(10);
alert(box);//,,,,,,,,,
box[5]='abc';
alert(box);//,,,,,abc,,,, //在创建数组的时候可以指定长度，但是括号中有且只能够有一个number类型的数据，
//否则会认为是创建一个数组 并且给数组赋值
var box=new Array(3);//创建一个数组 有三个元素
alert(box);// ,,
var age=new Array(3,4);//创建一个数组 包含两个元素
var he=new Array('3');//创建一个数组 包含一个字符串元素
alert(age);// 3,4
alert(he);// 3 //使用字面量创建数组
var box=[2,4,5,'bhc','45']; //和var box=new Array('qignag',22,'nan',175);创建方式差不多
alert(box);//2,4,5,bhc,45 //说明JS中的数组中的元素可以是不同类型的数据， var box=[];//创建一个空的数组 和var box=new Array();差不多
box[1]=24;
box[0]=12;
box[2]=89;
alert(box);//12,24,89 //var box;
//box[0]=78; //error
//box[1]=88;
//alert(box); var box=[4,6,];//最好不要这样 老版本的IE会识别为3个元素，
alert(box.length);//2
alert(box);//4,6
var age=[,,,,,,];
alert(age.length);//6 //length是数组的一个属性 获得数组的长度，元素的个数
alert(age);// ,,,,,, //数组是通过索引来读取和改变元素的值
var box=[3,5];
box[1]=14;//通过索引来修改元素的值
alert(box.length);//2
box[4]=45;//虽然数组在定义的时候只是声明了两个元素的长度，但是在JS中可以动态改变长度
alert(box);//3,14,,,45
alert(box.length);//5 //为了不错误的修改元素的值 以及在增加的时候动态的添加 多数采用下面方式
box[box.length]='length';//数组的索引是从0开始 最后一个元素的索引是长度减1，故要添加的元素的索引就是现在的数组的长度
alert(box); //前面说个，在JS中的数组是可以动态的修改长度，同时里面存储的数据的类型是可以各种各样的
var box=[3,5,'abcd',//前面两个个元素是number类型，第三个元素是string类型
{
name:'qigang',run:function(){return 'run';}
},//第四个类型是Object类型
34+22,//第五个是算术表达式
[5,6,7,8],//第六个是字面量数组
new Array("mayun",'liyanhong','mahuateng')//第七个是数组
];
alert(box);//3,5,abcd,[object Object],56,5,6,7,8,mayun,liyanhong,mahuateng
alert(typeof box[0]);//number
alert(typeof box[2]);//string
alert(typeof box[3]);//object
alert(box[3].name);//qigang
alert(box[3].run());//run
alert(box[5][2]);//7
alert(box[6][2]);//mahuateng
*/

//方法两个参数，如果第一个参数大于第二个返回整数，小于返回负数，等于返回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());

/* 对象中的方法
//转换方法，对象和数组都有 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,绵阳,德阳 */