day30 js数组 及 常用方法

数组所有方法继承于Array.prototype

创建数组方式

1、数组字面量

var arr = [1,2,3]; 
var arr1 = [1,,2];//稀松数组 空的索引位依旧计入数组长度

2、系统构造数组

var arr = new Array(1,2,3); //传两位参数及以上，和数组字面量一样
var arr1 = new Array(10); //传一位参数，相当于创建指定长度的稀松数组
var arr2 = new Array(10.2); //会警告报错，不影响执行

数组的读写

数组几乎不报错
1、可溢出读数组
js的数组是基于对象的，当访问一个没有的属性时打印undefined

var arr = []; 
arr[10] // undefined

2、可溢出写入数组

var arr = []; 
arr[10] = 1;  // arr.length == 11

数组常用方法

1. 可改变原数组的方法

1) arr.push()

       加在数组末端，可传一位或多位参数，但括号里不能像创建数组一样传空参数，在谷歌控制台调用会返回push后的数组长度。

var arr = [1];
arr.push(2);

封装arr.push()方法

Array.prototype.push = function () {
	for(var i = 0; i < arguments.length; i++){
		this[this.length] = arguments[i]; 
	}     
	return this.length;
}

2) arr.pop()

       剪切数组最后一位，不需要传参,系统默认只能剪切一位(可封装方法剪切任意位)

var arr = [1,2,3]; 
var num = arr.pop(); // num == 3, arr == [1,2]

封装arr.pop()方法

Array.prototype.pop = function(){
	var num = this[this.length-1];
	delete this[this.length-1];
	this.length -= 1;
	return num;
}

封装arr.mypop(n) 剪切n位方法

Array.prototype.mypop = function(n){
	var arr = [];
	if(n==1){
		var num = this[this.length-1];
		this.length -= 1;
		return num; 
	}else{
		for(var i = n; i >= 1; i--){
			arr.push(this[this.length-i]);
		}
		this.length -= n;
		return arr;
	}
}

3) arr.unshift( );

       与push相反，只是在数组最前端添加，可传一位或多位参数，但括号里不能像创建数组一样传空参数，在谷歌控制台调用会返回unshift后的数组长度。

var arr = [1,2,3];
arr.unshift(-1,0); // arr == [-1,0,1,2,3]

封装arr.unshift()方法

Array.prototype.unshift= function () {
    var arr = this.reverse();
	for(var i = arguments.length;i > 0; i--){
        arr.push(arguments[i-1]);
    }     
    return arr.reverse();
}

4) arr.shift( );

       与pop相反，剪切数组第一位，不需要传参，系统默认只能剪切一位(可封装方法剪切任意位)

var arr = [1,2,3]; 
var num = arr.shift(); // num == 1, arr == [2,3]

封装arr.shift()方法

Array.prototype.shift= function () {
    var arr = this.reverse();
    var num = arr.pop();
    arr.reverse();
    return num;
}

5) arr.reverse();

逆转数组成员

var arr = [1,2,3]; 
arr.reverse(); // arr =[3,2,1]

封装arr.reverse()方法

Array.prototype.reverse= function () {
   var arr = [];
   for(var i = this.length-1; i >= 0; i--){
        arr.push(this[i]);
   }
   return arr;
}

6) arr.splice()

       arr.splice(从第几位开始（可填负数），截取长度，在切口处插入新成员（可插入0个及以上）) ，会返回剪切的数组项

var arr = [1,2,3,5];
arr.splice(0,1,-1); //  arr=[-1, 2, 3, 5]

封装arr.splice()方法，在已有arr.mypop(n)剪切多位数组项封装方法的基础上，粗糙地尝试：

Array.prototype.splice = function(pos,len){
	pos += pos > 0? 0 : this.length;
	len = len > (this.length - pos) ? (this.length - pos) : len;
	if(pos >= 0 || pos <= this.length){
		var pop = this.mypop(this.length - pos - len);
		var num = this.mypop(len);
		for(var j = 2; j <= arguments.length-1; j++){
 			 this.push(arguments[j]);
		}
		for(var i = 0; i <= pop.length-1;i++){
			 this.push(pop[i]);
		}
	}
	return num;
}

7) arr.sort()

sort()：按升序排列数组项——即最小的值位于最前面，最大的值排在最后面。

       在排序时，sort()方法会调用每个数组项的 toString()转型方法，然后比较得到的字符串，以确定如何排序。即使数组中的每一项都是数值， sort()方法比较的也是字符串，因此会按ACSII码排序，而并非我们理想的目标排序方式。

var arr = [1,5,4,2,3,10];
arr.sort(); //arr = [1, 10, 2, 3, 4, 5]; 按ASCII码升序排列
arr.sort().reverse(); //arr = [5, 4, 3, 2, 10, 1];按ASCII码降序排列

       sort()方法给我们留了一个编程接口，我们可以在括号里接收一个比较函数作为参数，让数组按我们的方法进行排序。
       这个函数需要传两个形参，规则：冒泡排序比较，当返回值为负数时，则第一个参数排在第二个参数前面；当返回值为正数时，则第二个参数排在第一个参数之前。

// 升序
arr.sort(function(a,b){
    if(a > b){
        return 1;
    }else{
        return -1;
    }
});

// 利用数学优化代码
arr.sort(function(a,b){
    if(a - b > 0 ){
        return a - b;
    }else{
        return a - b;
    }
});

// 由以上代码可看出最优版
arr.sort(function(a,b){
     return a - b; //升序
});
//同理降序方法为：
arr.sort(function(a,b){
     return b - a; //降序
});

几个应用的实例：
1、给一个有序的数组乱序

arr.sort(function(){
    return Math.random() - 0.5; // 随机返回一个 (-0.5 ~ 0.5 )的数
});

2、制定任意规则，给若干对象排序

var lee = {
	name : "gt",
	age : 21
}
var xin = {
	name : 'py',
	age : 20
}
var han = {
	name : 'JIAN',
	age : 19
}
var arr = [lee,xin,han];
arr.sort(function(a,b){
	return a.age -b.age; // 按年龄升序给对象排序
});

3、按字符串长度排序

var arr = ["technology","web","JavaScript","html","css"];
arr.sort(function(a,b){
    return a.length - b.length;
})

4、按字符串字节长度排序

var arr=["分享技术","前端web","csdn博客"];
function retByte(str){
	var count = str.length,
		len = str.length;
	for(var i = 0; i <= len; i++){
		if(str.charCodeAt(i)>255){
			count ++;
		}
	}
	return count;
}
arr.sort(function(a,b){
    return retByte(a) - retByte(b);
});

2. 不改变原数组的方法

1) arr.concat()

该方法起连接的作用，不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
括号里的参数可以是具体的值，也可以是数组对象，可以是任意多个。

var arr = [1,2,3];
var arr1 = [4,5,6];
var num1 = arr.concat(arr1); 

var arr2 = [4,[5,6]];
var num2 = arr.concat(arr2); 

var num3 = arr.concat(arr1,arr2);

2) arr.toString()

把数组变成字符串

3) arr.slice()

       arr.slice(pos,index)(从第几位开始截取，截取到第几位) ，返回剪切的数组项。
      在只有一个参数的情况下， slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。不传参的时候返回该数组的副本。

pos += pos > 0 ? 0 : this.length
index += index > 0 ? 0 : this.length

var arr = [1,2,3,4,5];
arr.slice(1,3); // [2,3]
arr.slice(1); //[2, 3, 4, 5]
arr.slice( ); //[1, 2, 3, 4, 5]
arr.slice(-4,-1); //  [2, 3, 4]

4) arr.join()

       join(separator): 将数组的元素组起一个字符串，以separator为分隔符，不传参的话则用默认用逗号为分隔符，该方法只接收一个参数：即分隔符。

var arr = [1,2,3,4,5];
arr.join("-"); // "1-2-3-4-5"
arr.join(); // "1,2,3,4,5"

• string.split()
  string.split(separator)将字符串按分隔符拆分成数组，这是与arr.join()互逆的字符串上的方法。

var arr = [1,2,3,4,5];
var str = arr.join("-");

字符串的拼接

var str = 'alibaba';
var str1 = 'baidu';
var str2 = 'tencent';
var str3 = 'wanda';
var arr = [str,str1,str2,str3];
arr.join('');