菜鸟笔记-数组基础

一 创建方法

1. 空数组 var Obj = new Array();

2. 指定长度数组 var Obj = new Array(size);

3. 制定元素数组 var Obj = new Array(元素1， 元素2， 元素3，.....元素N)

4. 单维数组 var Obj = new Array(元素1， 元素2， 元素3，.....元素N)

5. 多维数组 var Obj = new Array([数组序列1]，[数组序列2]，.....[数组序列N])

 

二 基本操作

1. 存取数组元素

(1) 单维数组 -- arr[index]

(2) 多维数组 -- arr[外层数组下标][内层数组下标]

(3) 特性：

a. 数组长度是弹性的，可自由伸缩
b. 数组下标从0开始
c. 下标类型--- 数值
--- 非数值(转为字符串||生成关联数组||下标将作为对象属性的名字)

 1               // 转为字符串 
 2                 var mycars = new Array()
 3                 mycars["aa"] = ["宝马",12];
 4                 mycars[1] = "奔驰"
 5                 mycars[2] = "宾利"
 6 
 7                 for (x in mycars){
 8                     document.write(mycars[x] + "<br />");
 9                     document.write(x + "<br />");
10                 }

 

// Javascript的数组其实不像PHP或者其他一些语言一样拥有真正的字符串下标，当我们试图为一个js数组添加字符串下标的时候，其实就相当于为该数组对象添加了一个属性，属性名称就是我们所谓的“字符串下标”。由于为数组对象添加属性不会影响到同为该对象属性的length的值，因此该值将始终为零。同样地，.pop()和.shift()等作用于数组元素的方法也不能够作用于这些对象属性。因此，如果要使用的是一个完全由“字符串下标”组成的数组，那还是将其声明为一个Object类型的对象要更好一些。

 1 var array = [];
 2 array["a"] = "hello";
 3 array["b"] = "world";
 4 array["c"] = "yes";
 5 console.log("length: " + array.length);// length:0
 6 
 7 var array = [];
 8 array["a"] = "hello";
 9 array["b"] = "world";
10 array["c"] = "yes";
11 array["10"] = "no";
12 console.log("length: " + array.length);// length:11
13 console.log(array);//[undefined*10, 'no']

 

d. 数组元素可添加到对象中去

 1 //普通做法-------------------------------------
 2 
 3 var obj = {};
 4 
 5 var pusharr = [11,3,4,5,6,7];
 6 
 7 for (var i = 0; i < pusharr.length; i++) {
 8 obj[i] = pusharr[i]
 9 }
10 
11 console.log(obj)
12 
13 //简单做法---------------------------------------
14 
15 var obj1 = {};
16 
17 [].push.apply(obj1, [1,6,8,0,86])
18 
19 console.log(obj1)

2. 增加数组 使用“[]”运算符指定一个新下标

3. 删除数组 delete 数组名[下标]

4. 遍历数组 for (var 数组元素 in 数组)

 

三 数组属性

1. constructor 引用数组对象的构造函数

 1 var arr = new Array();
 2 arr[0] = '11';
 3 arr[1] = '9994';
 4 arr[2] = '678';
 5 
 6 if (arr.constructor == Array){
 7 document.write('这是一个数组')
 8 }
 9 
10 function Person(name, job, born){
11 this.name = name;
12 this.job = job;
13 this.born = born
14 }
15 
16 var abby = new Person('anna', 'work', 'shanghai');
17 document.write(abby.constructor)

 

2. length 返回数组的长度

3. prototype 通过增加属性和方法扩展数组定义

 1 function person(name, job, born){
 2 this.name = name;
 3 this.job = job;
 4 this.born = born;
 5 }
 6 
 7 var bill = new person('andy', 'work', 'shanghai')
 8 
 9 person.prototype.salary = null;
10 
11 document.write(bill.salary)//null

 

四 ES3方法

1.添加

(1) push()向数组的末尾添加一个或多个元素，并返回新的长度。

1 var arr = [1,4,5,6,8,90];
2 document.write(arr.push('James'));// 返回数组长度 6

 

(2) unshift() 向数组的开头添加一个或更多元素，并返回新的长度。

1 var arr = new Array()
2 arr[0] = "George"
3 arr[1] = "John"
4 arr[2] = "Thomas"
5 
6 document.write(arr + "<br />") //George,John,Thomas
7 document.write(arr.unshift("William") + "<br />")//4
8 document.write(arr)//William,George,John,Thomas

 

(3)concat() //用于连接两个或多个数组。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

 1 --------------------
 2 var a = [1,2,3];
 3 document.write(a.concat(4,5));//1,2,3,4,5
 4 --------------------------
 5 var arr = new Array(3)
 6 arr[0] = "George"
 7 arr[1] = "John"
 8 arr[2] = "Thomas"
 9 
10 var arr2 = new Array(3)
11 arr2[0] = "James"
12 arr2[1] = "Adrew"
13 arr2[2] = "Martin"
14 
15 var arr3 = new Array(2)
16 arr3[0] = "William"
17 arr3[1] = "Franklin"
18 
19 document.write(arr.concat(arr2,arr3))//George,John,Thomas,James,Adrew,Martin,William,Franklin

 

2. 删除

(1) pop()删除 arrayObject 的最后一个元素，把数组长度减 1，并且返回它删除的元素的值。如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。

1 var arr = new Array(3)
2 arr[0] = "George"
3 arr[1] = "John"
4 arr[2] = "Thomas"
5 
6 document.write(arr.pop())//Thomas

 

(2) shift()用于把数组的第一个元素从其中删除，并返回第一个元素的值。

1 var arr = new Array(3)
2 arr[0] = "George"
3 arr[1] = "John"
4 arr[2] = "Thomas"
5 
6 document.write(arr.shift() + "<br />")//George

 

3. 子数组

(1) splice(index, 删除个数，增加元素) 方法向/从数组中添加/删除项目，然后返回被删除的项目。

1 var arr1 = ['jjj', 'lll', 'hhhh', 'oooo']
2 -------------------------------
3 console.log(arr1.splice(1));//如果只有一位数字，那么选取从第二位一直到最后一位
4 console.log(arr1) // jjj
5 -----------------------------
6 console.log(arr1.splice(2, 1, 'Anna'))//hhhh
7 console.log(arr1) //['jjj', 'lll', 'oooo']

 

(2) slice()方法可从已有的数组中返回选定的元素。此方法并不改变原来的数组.
slice(起始位置，结束位置-1)//如果数值是负数，则用数组长度加上该值确定位置

 1 ---------------------------------
 2 var arr = new Array(3)
 3 arr[0] = "George"
 4 arr[1] = "John"
 5 arr[2] = "Thomas"
 6 
 7 document.write(arr.slice(1) + "<br />")//John,Thomas 如果只有一位数字，那么选取从第二位一直到最后一位
 8 document.write(arr) //George,John,Thomas
 9 ---------------------------------
10 
11 var arr = new Array(6)
12 arr[0] = "George"
13 arr[1] = "John"
14 arr[2] = "Thomas"
15 arr[3] = "James"
16 arr[4] = "Adrew"
17 arr[5] = "Martin"
18 
19 document.write(arr + "<br />")
20 document.write(arr.slice(2,4) + "<br />")//Thomas,James 选取index为2到4之前的元素，及2-3
21 document.write(arr)
22 -----------------------------------------

 

4. 数组排序

(1) reverse()方法用于颠倒数组中元素的顺序。

1 var arr = [1,4,5,6,8,90];
2 console.log(arr.reverse())// [90,8,6,5,4,1]

 

(2) sort() 排序

//默认按字符编码排序
// 1. -----------------------
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
document.write(arr.sort())//Adrew,George,James,John,Martin,Thomas

// 2. ---------------------------
var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(arr.sort())//1,10,1000,25,40,5

//请注意，上面的代码没有按照数值的大小对数字进行排序，要实现这一点，就必须使用一个排序函数：
function sortNumber(a,b)
{
return a - b
}

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(arr.sort(sortNumber))//1,5,10,25,40,1000

 

5. 数组转换

(1) toString()方法可把数组转换为字符串，并返回结果。

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr.toString())//George,John,Thomas

 

(2) toLocaleString 把数组转换为本地字符串。

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr.toLocaleString())//George, John, Thomas

 

//详细举例区别 toString() 和 toLocaleString()

---------------------------
var a=1234

a.toString()
"1234"

a.toLocaleString()
"1,234"
---------------------------
var sd=new Date()


sd
Wed Feb 15 2017 11:21:31 GMT+0800 (CST)


sd.toLocaleString()
"2017/2/15 上午11:21:31"


sd.toString()
"Wed Feb 15 2017 11:21:31 GMT+0800 (CST)"

------------------------------------------

 

(3) join 用数组的元素组成字符串

var arr = new Array();
arr[0] = 'Judy';
arr[1] = 'Anna';
arr[2] = 'back';

document.write(arr.join('.'));//Judy.Anna.back
document.write(arr.join('---'));//Judy---Anna---back

 

五 ES5方法

1. 位置方法

(1) indexOf()

//indexof(要查找的项， 查找起点位置的索引) 从左往右查找
var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.indexOf("Apple");
console.log(a)//2

 

(2) lastIndexOf()

//lastIndexOf(要查找的项， 查找起点位置的索引)从左往右查找
var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.indexOf("Apple");
console.log(a)//6

 

2. 迭代方法

(1) every()

//判断数组中每一项都是否满足条件，只有所有项都满足条件，才会返回true。
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.every(function(x) {
return x < 10;
}); 
console.log(arr2); //true
var arr3 = arr.every(function(x) {
return x < 3;
}); 
console.log(arr3); // false

 

(2)filter()

//“过滤”功能，数组中的每一项运行给定函数，返回满足过滤条件组成的数组。
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(x, index) {
return index % 3 === 0 || x >= 8;
}); 
console.log(arr2); //[1, 4, 7, 8, 9, 10]

 

(3)forEach()

//对数组进行遍历循环，对数组中的每一项运行给定函数。这个方法没有返回值。参数都是function类型，默认有传参，参数分别为：遍历的数组内容；第对应的数组索引，数组本身。
var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){
console.log(x + '|' + index + '|' + (a === arr));
});
// 输出为：
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true

 

(4)map()

//指“映射”，对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(function(item){
return item*item;
});
console.log(arr2); //[1, 4, 9, 16, 25]

(5)some()
//判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回true。
var arr = [1, 2, 3, 4, 5];
var arr2 = arr.some(function(x) {
return x < 3;
}); 
console.log(arr2); //true
var arr3 = arr.some(function(x) {
return x < 1;
}); 
console.log(arr3); // false

 

3.缩小方法

(1) reduce()

(2)reduceRight()

//这两个方法都会实现迭代数组的所有项，然后构建一个最终返回的值。reduce()方法从数组的第一项开始，逐个遍历到最后。而 reduceRight()则从数组的最后一项开始，向前遍历到第一项。

//这两个方法都接收两个参数：一个在每一项上调用的函数和（可选的）作为归并基础的初始值。

//传给 reduce()和 reduceRight()的函数接收 4 个参数：前一个值、当前值、项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在数组的第二项上，因此第一个参数是数组的第一项，第二个参数就是数组的第二项。

//下面代码用reduce()实现数组求和，数组一开始加了一个初始值10。

var values = [1,2,3,4,5];
var sum = values.reduceRight(function(prev, cur, index, array){
return prev + cur;
},10);
console.log(sum); //25

 

转载于:https://www.cnblogs.com/Anna-jia/p/9321007.html