关于javascript:JavaScript引用类型Array实例分析

4次阅读

共计 5459 个字符,预计需要花费 14 分钟才能阅读完成。

1、ECMAScript 数组的特点

ECMAScript 数组的每一项能够保留任何类型的数据。
ECMAScript 数组的大小是能够动静调整的。

2、创立数组

(1)应用 Array 构造函数(new 操作符可省略)

var arr1 = new Array();
var arr2 = new Array(3);
var arr3 = new Array("teacher", 3, true);

(2)应用数组字面量表示法

var arr1 = [];
var arr2 = ["teacher", 3, true];

3、length 属性

ECMAScript 数组的 length 属性不是只读的,通过设置这个属性能够从数组开端移除项或向数组中增加新项。

eg1:从数组开端移除项

var arr = ["teacher", 3, true];
arr.length = 1;
alert(arr[2]);//undefined

eg2:如果将 length 设置为大于以后数组长度的值,则新增的每一项都会获得 undefined 值

var arr = ["teacher", 3, true];
arr.length = 4;
alert(arr[3]);//undefined

eg3:向数组中增加新项

var arr = ["teacher", 3, true];
arr[arr.length] = "doctor";

eg4:当一个值放在超出以后数组大小的地位上时,数组会从新计算其长度值,等于最初一项的索引加一。

var arr = ["teacher", 3, true];
arr[9] = "doctor";
alert(arr.length);//10

4、检测数组

(1)instanceof 操作符

if (value instanceof Array) {...}

问题:若网页中蕴含多个框架,则实际上存在两个以上不同的全局执行环境,从而存在两个以上不同版本的 Array 构造函数。若从一个框架向另一个框架传入一个数组,那么传入的数组在与第二个框架中原生创立的数组别离具备各自不同的构造函数。

(2)Array.isArray() 办法

if (Array.isArray(value)) {...}

用处:确定给定值是否是数组,无论它是在哪个全局执行环境中创立的。

5、转换方法

(1)toString(): 返回每一项的字符串模式拼接而成的一个以逗号分隔的字符串,为了获得每一项的值,调用的是每一项的 toString() 办法。

(2)valueOf(): 返回的还是数组

(3)toLocaleString(): 为了获得每一项的值,调用的是每一项的 toLocaleString() 办法,而不是 toString() 办法。

(4)join(): 应用指定的分隔符来构建字符串

阐明:alert() 办法要接管字符串参数,所以它会在后盾调用 toString() 办法。

eg1:

var friends = ["Alice","Bruce","Cindy"];
alert(friends.toString());//Alice,Bruce,Cindy
alert(friends.valueOf());//Alice,Bruce,Cindy
alert(friends.toLocaleString());//Alice,Bruce,Cindy
alert(friends);//Alice,Bruce,Cindy
alert(friends.join());//Alice,Bruce,Cindy
alert(friends.join("|"));//Alice|Bruce|Cindy

eg2:

var person1 = {toLocaleString: function() {return "Alice";},
 toString: function() {return "Bruce";}// 前端全栈开发交换圈:866109386
}// 帮忙 1 - 3 年前端人员,冲破技术瓶颈,晋升思维能力
var person2 = {toLocaleString: function() {return "Cindy";},
 toString: function() {return "David";}
}
var person = [person1, person2];
alert(person);//Alice,Bruce
alert(person.toString());//Alice,Bruce
alert(person.toLocaleString());//Cindy,David

6、栈办法

(1)push(): 接管任意数量的参数,一一增加到开端,返回批改后数组的长度。

(2)pop(): 从数组开端移除最初一项,数组的长度减一,返回移除的项。

var friends = new Array();
var len = friends.push("Alice","Bruce");
alert(len);//2
var friend = friends.pop();
alert(friend);//"Bruce"
alert(friends.length);//1

7、队列办法

(1)shift(): 移除数组的第一项,数组的长度减一,返回移除的项。

(2)unshift(): 在数组前端增加任意数量的项,返回批改后数组的长度。

var friends = new Array();
var len = friends.unshift("Alice","Bruce");
alert(len);//2
var friend = friends.shift();
alert(friend);//"Alice"
alert(friends.length);//1

8、重排序办法

(1)reverse(): 翻转数组项的程序

(2)sort(): 按升序排列数组项

sort() 办法会调用每项的 toString() 办法,而后比拟失去的字符串。

var items=[0,1,3,15,18];
items.sort();
alert(items);//0,1,15,18,3

sort() 办法能够接管一个比拟函数作为参数:比拟函数接管两个参数,若第一个参数应该位于第二个参数之前则返回一个正数;若两个参数相等则返回 0;若第一个参数应该位于第二个参数之后则返回一个负数。

function compare(item1, item2) {if (item1 < item2)
 return -1;
 else if (item1 > item2)
 return 1;
 else
 return 0;// 前端全栈学习交换圈:866109386
}// 帮忙 1 - 3 年前端人员,冲破技术瓶颈,晋升思维能力。var items=[0,1,3,15,18];
items.sort(compare);
alert(items);//0,1,3,15,18

对于数值类型或其 valueOf() 办法会返回数值类型的对象类型,能够简写比拟函数。

function compare(item1, item2) {return item1 - item2;}

9、操作方法

(1)concat(): 基于以后数组中的所有项创立一个新数组。先创立以后数组的一个正本,而后将接管到的参数增加到这个正本的开端,最初返回新构建的数组。若没有给 concat() 传递参数,则只是复制以后数组并返回正本;若传递给 concat() 的是一或多个数组,则该办法会将这些数组中的每一项都增加到后果数组;若传递给 concat() 的不是数组,则这些值都简略地增加到后果数组的开端。

var friends = ["Alice", "Bruce"];
var newFriends = friends.concat("Cindy", ["David", "Emy"]);
alert(newFriends);//Alice,Bruce,Cindy,David,Emy

(2)slice(): 基于以后数组的一或多项创立一个新数组。接管一或两个参数,即要返回项的开始和完结地位(不包含完结地位)。slice() 办法不会影响原始数组。若参数中有正数,则用数组长度加上该正数来确定相应的地位。若完结地位小于开始地位,则返回空数组。

var friends = ["Alice", "Bruce", "Cindy"];
var friends1 = friends.slice(1);
alert(friends1);//Bruce,Cindy
var friends2 = friends.slice(1, 2);
alert(friends2);//Bruce

splice():主要用途是向数组的中部插入项,返回一个蕴含从原始数组中删除的项的数组,若没有删除任何项,则返回空数组。应用形式有 3 种:

1)删除: 能够删除任意数量的项,只需指定 2 个参数:要删除的第一项的地位和要删除的项数。

2)插入: 能够向指定地位插入任意数量的项,只需指定 3 个参数:起始地位、要删除的项数和要插入任意数量的项。

3)替换: 能够向指定地位插入任意数量的项,且同时删除任意数量的项,只需指定 3 个参数:起始地位、要删除的项数和要插入任意数量的项。插入的项数不用和删除的项数相等。

var friends = ["Alice", "Bruce", "Cindy"];
var friends1 = friends.splice(0, 1);
alert(friends1);//Bruce,Cindy
var friends2 = friends.slice(1, 0, "David", "Emy");
alert(friends2);//Bruce,David,Emy,Cindy
var friends3 = friends.slice(1, 1, "Fancy", "Gary");
alert(friends3);//Bruce,Fancy,Gary,Emy,Cindy

10、地位办法

(1)indexOf(): 接管两个参数——要查找的项和可选的查找终点地位的索引,从结尾开始查找,没找到则返回 -1。

(2)lastIndexOf(): 接管两个参数——要查找的项和可选的查找终点地位的索引,从开端开始查找,没找到则返回 -1。

在比拟第一个参数与数组中的每一项时,会应用全等操作符,也就是要求查找的项必须严格相等。

var person = {name : "Alice"};
var people1 = [{name : "Alice"}, person];
alert(people1.indexOf(person));//1,不是 0 

11、迭代办法

ECMAScript 数组有 5 个迭代办法。每个办法接管两个参数——要在每一项上运行的函数和可选的运行该函数的作用域对象(影响 this 的值)。传入的函数接管三个参数——数组项的值、该项在数组中的地位和数组对象自身。

(1)every(): 对数组中的每一项运行给定函数,若该函数对每一项都返回 true,则返回 true。

(2)some(): 对数组中的每一项运行给定函数,返回该函数会返回 true 的项组成的数组。

(3)filter(): 对数组中的每一项运行给定函数,若该函数对每一项都返回 true,则返回 true。

(4)foreach(): 对数组中的每一项运行给定函数,无返回值。

(5)map()`: 对数组中的每一项运行给定函数,若该函数对每一项都返回 true,则返回 true。

var nums = [1,2,3,4,1,2,3];
var every = nums.every(function(item, index, array) {return (item > 2); // 前端全栈学习交换圈:866109386
});// 帮忙 1 - 3 年教训前端人员,冲破技术瓶颈,晋升思维能力
alert(every);//false
var some = nums.some(function(item, index, array) {return (item > 2);
});
alert(some);//true
var filter = nums.filter(function(item, index, array) {return (item > 2);
});
alert(filter);//[3,4,3]
var map = nums.map(function(item, index, array) {return (item * 2);
});
alert(map);//[2,4,6,8,2,4,6]
nums.foreach(function(item, index, array) {...});

12、归并办法

迭代数组的所有项,而后构建一个最终返回的值。接管两个参数——一个在每一项上调用的函数和可选的作为归并根底的值。传入的函数接管四个参数——前一个值、以后值、项的索引和数组对象。函数返回的任何值都会作为第一个参数主动传给下一项。第一次迭代产生在数组的第二项上,因而第一个参数是数组的第一项,第二个参数是数组的第二项。

(1)reduce(): 从数组的第一项开始,一一遍历到最初。

var items = [1,2,3,4];
var sum = items.reduce(function(prev, cur, index, array) {return prev + cur;});
alert(sum);//10

(2)reduceRight(): 接管两个参数——一个在每一项上调用的函数和可选的作为归并根底的值。从数组的最初一项开始,向前遍历到第一项。

var items = [1,2,3,4];
var sum = items.reduceRight(function(prev, cur, index, array) {return prev + cur;});
alert(sum);//10
正文完
 0