引用类型(二)Array类型

来源:互联网 发布:java 泛型 class 参数 编辑:程序博客网 时间:2024/06/05 14:44

创建数组的基本方式有两种:

第一种使用Array构造函数var naiArr = new Array()var naiArr = Array()如果预先知道数组要保存的项目数量,也可以给构造函数传递该数量,而该数量会自动变成 length属性的值。例如,下面的代码将创建 length 值为 20 的数组。第二种数组字面量var naiArr =[]

检测数组

instanceof操作符

如果变量是给定引用类型(根据它的原型链来识别;),instanceof操作符就会返回true。如果使用instanceof操作符检测基本类型的值,instanceof操作符始终返回false,因为基本类型不是对象

var naiArr=[]var naiObj={}naiArr instanceof ArraytruenaiArr instanceof ObjecttruenaiObj instanceof ArrayfalsenaiObj instanceof Objecttrue

Array.isArray() 方法

var naiArr=[]var naiObj={}Array.isArray(naiArr)trueArray.isArray(naiObj)false

转换方法

所有对象都具有 toLocaleString() 、 toString() 和 valueOf() 方法。其中,调用 数组的 toString() 方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。而 调用 valueOf() 返回的还是数组

栈方法

ECMAScript 数组也提供了一种让数组的行为类似于其他数据结构的方法。具体说来,数组可以表 现得就像栈一样,后者是一种可以限制插入和删除项的数据结构。栈是一种 LIFO(Last-In-First-Out, 后进先出)的数据结构,也就是最新添加的项最早被移除。而栈中项的插入(叫做推入)和移除(叫做 弹出),只发生在一个位置——栈的顶部。ECMAScript 为数组专门提供了 push() 和 pop() 方法,以便 实现类似栈的行为。 push() 方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度。而 pop() 方法则从数组末尾移除最后一项,减少数组的 length 值,然后返回移除的项。

push()

pop()

队列方法

队列数据结构的访问规则是 FIFO(First-In-First-Out, 先进先出)。队列在列表的末端添加项,从列表的前端移除项。由于 push() 是向数组末端添加项的方法, 因此要模拟队列只需一个从数组前端取得项的方法。实现这一操作的数组方法就是 shift() ,它能够移 除数组中的第一个项并返回该项,同时将数组长度减 1。结合使用 shift() 和 push() 方法,可以像使 用队列一样使用数组。

shift()

var colors = new Array(); //创建一个数组var count = colors.push("red", "green"); //推入两项alert(count); //2count = colors.push("black"); //推入另一项alert(count); //3var item = colors.shift(); // 取得第一项alert(item); //"red"alert(colors.length); //2

重排序方法

reverse()

sort()

操作方法

ECMAScript为操作已经包含在数组中的项提供了很多方法:

concat()方法

concat() 方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。 将两个数组合并为一个新数组:

var nai01 = ['mi','sama'];var nainai = ['nana'];nainai.concat(nai01)(3) ["nana", "mi", "sama"]

将三个数组合并为一个新数组:

var nai01 = ['mi','sama'];var nai02 = ['o','hayou'];var nainai = ['nana'];nainai.concat(nai01,nai02)(5) ["nana", "mi", "sama", "o", "hayou"]

将值连接到数组

var nainai = ['nana'];nainai.concat(7,['is','nana'])(4) ["nana", 7, "is", "nana"]

合并嵌套数组

var nai01 = [['nana']];var nai02 = ['is',7,['so','ga']];var nainai = nai01.concat(nai02)(4)["nana"],"is",7,["so", "ga"]nainai[0].push(7)(4)["nana", 7],"is",7,["so", "ga"]

slice()

arrayObject.slice(start,end)start必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。end可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

slice() 方法返回一个从开始到结束(不包括结束)选择的数组的一部分浅拷贝到一个新数组对象。元是数组不会被修改。

var nainai = ['nana','is','nainai','it','is','me'];var nainaiSlice=nainai.slice(1,3);nainaiSlice(2) ["is", "nainai"]nainai(6) ["nana", "is", "nainai", "it", "is", "me"]

splice()

arrayObject.splice(index,howmany,item1,.....,itemX)index必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。howmany必需。要删除的项目数量。如果设置为 0,则不会删除项目。item1, ..., itemX可选。向数组添加的新项目。

splice() 方法可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。

删除

var nainai = ['nana','is','nainai','it','is','me'];nainai.splice(2,1)["nainai"]nainai(5) ["nana", "is", "it", "is", "me"]var nainai = ['nana','is','nainai','it','is','me'];nainai.splice(2,2)(2) ["nainai", "it"]nainai(4) ["nana", "is", "is", "me"]

插入

var nainai = ['nana','is','nainai','it','is','me'];nainai.splice(2,0,'sama','see')[]nainai(8) ["nana", "is", "sama", "see", "nainai", "it", "is", "me"]

替换

var nainai = ['nana','is','nainai','it','is','me'];nainai.splice(2,2,'sama','see')(2) ["nainai", "it"]nainai(6) ["nana", "is", "sama", "see", "is", "me"]var nainai = ['nana','is','nainai','it','is','me'];nainai.splice(2,2,'sama','see','new')(2) ["nainai", "it"]nainai(7) ["nana", "is", "sama", "see", "new", "is", "me"]

位置方法

ECMAScript5为数组实例添加了两个位置方法:indexOf()和lastIndexOf()。这两个方法都接收两个参数:要查找的项和表示查找起点位置的索引(可选)。其中, indexOf() 方法从数组的开头(位 置 0)开始向后查找, lastIndexOf() 方法则从数组的末尾开始向前查找。两种方法都区分大小写。

indexOf()

str.indexOf(searchValue[, fromIndex])searchvalue必需。规定需检索的字符串值。fromindex可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。 该方法将从头到尾地检索字符串 stringObject,看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的开头(没有指定 fromindex 时)。如果找到一个 searchvalue,则返回 searchvalue 的第一次出现的位置。stringObject 中的字符位置是从 0 开始的。 如果在数组中没找到字符串则返回 -1

"nainai is nana".indexOf("is")7"nainai is nana".indexOf("nainai")0"nainai is nana".indexOf(7)-1"nainai is nana".indexOf("is",0)7"nainai is nana".indexOf("is",8)-1"nainai is nana".indexOf("",6)6"nainai is nana".indexOf("",11)11"nainai is nana".indexOf("",12)12

使用 indexOf 统计一个字符串中某个字母出现的次数

var str = 'To be, or not to be, that is the question.';var count = 0;var pos = str.indexOf('e');while (pos !== -1) {  count++;  pos = str.indexOf('e', pos + 1);}console.log(count); // displays 4

lastIndexOf()

str.lastIndexOf(searchValue[, fromIndex])searchValue代表要搜索的值的字符串。如果  searchValue 是空字符串,则  fromIndex 返回。fromIndex 可选的在字符串中开始向后搜索的索引。从这个索引开始,字符串的左边部分将被搜索。它可以是任何整数。默认值是+Infinity。如果fromIndex >= str.length,整个字符串被搜索。如果fromIndex < 0,行为将会是相同的0。

lastIndexOf()方法返回String最后一次出现指定值的调用对象内的索引,从中往后查找 fromIndex。如果未找到该值,则返回-1。

"nainai".lastIndexOf("i")5"nainai".lastIndexOf("i",3)2"nainai".lastIndexOf("i",6)5"nainai".lastIndexOf("i",0)-1"nainai".lastIndexOf(7)-1"nainai".lastIndexOf("i",-3)-1"nainai".lastIndexOf("n",0)0"nainai".lastIndexOf("n",-3)0"nainai".lastIndexOf("")6"nainai".lastIndexOf("",3)3

迭代方法

ECMAScript5维数组定义了5个迭代方法。每个方法都接收两个参数:要在每一项上运行的函数和(可选的)运行该函数的作用域对象-影响this的值。

every() 方法

every() 方法测试数组的所有元素是否都通过了指定函数的测试。

arr.every(callback[, thisArg])callback用来测试每个元素的函数。如果该函数对每一项都返回 true ,则返回 truethisArg执行 callback 时使用的 this 值。

every 方法为数组中的每个元素执行一次 callback 函数,直到它找到一个使 callback 返回 false(表示可转换为布尔值 false 的值)的元素。如果发现了一个这样的元素,every 方法将会立即返回 false。否则,callback 为每一个元素返回 true,every 就会返回 true。callback 只会为那些已经被赋值的索引调用。不会为那些被删除或从来没被赋值的索引调用。

callback 被调用时传入三个参数:元素值,元素的索引,原数组。

如果为 every 提供一个 thisArg 参数,则该参数为调用 callback 时的 this 值。如果省略该参数,则 callback 被调用时的 this 值,在非严格模式下为全局对象,在严格模式下传入 undefined。

every 不会改变原数组。

every 遍历的元素范围在第一次调用 callback 之前就已确定了。在调用 every 之后添加到数组中的元素不会被 callback 访问到。如果数组中存在的元素被更改,则他们传入 callback 的值是 every 访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。 下例检测数组中的所有元素是否都大于 10。

function isBigEnough(element, index, array) {  return (element >= 10);}var passed = [12, 5, 8, 130, 44].every(isBigEnough);// passed is falsepassed = [12, 54, 18, 130, 44].every(isBigEnough);// passed is true

filter()

var new_array = arr.filter(callback[, thisArg])callback用来测试数组的每个元素的函数。调用时使用参数 (element, index, array)。返回true表示保留该元素(通过测试),false则不保留。thisArg可选。执行 callback 时的用于 this 的值。

对数组中的每一项运行给定函数,返回该函数会返回 true 的项组成的数组

function isBigEnough(value) {  return value >= 10;}var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);// filtered is [12, 130, 44]// ES6 wayconst isBigEnough = value => value >= 10;let [...spraed]= [12, 5, 8, 130, 44];let filtered = spraed.filter(isBigEnough);// filtered is [12, 130, 44]

forEach()方法

arr .forEach(函数回调(currentValue,index,array){    //你的迭代器} [,thisArg ]);callback为每个元素执行的函数有三个参数:currentValue正在数组中处理的当前元素的值。index数组中正在处理的元素的索引。arrayforEach()正在应用的数组  。thisArg 可选的执行时使用的值this(即参考Object)callback。

对数组中的每一项运行给定函数。这个方法没有返回值。

之前const items = ['item1', 'item2', 'item3'];const copy = [];for (let i=0; i<items.length; i++) {  copy.push(items[i])}const items = ['item1', 'item2', 'item3'];const copy = [];items.forEach(function(item){  copy.push(item)});

map()方法

var new_array = arr .map(函数回调(currentValue,index,array){    //返回new_array的元素} [,thisArg ])callback产生新数组元素的函数,带三个参数: currentValue正在数组中处理当前元素。index可选的数组中正在处理的元素的索引。array可选的数组map被调用。thisArg可选的this执行时使用的值callback。

对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。

var numbers = [1, 4, 9];var roots = numbers.map(Math.sqrt);undefinednumbers(3) [1, 4, 9]roots(3) [1, 2, 3]var kvArray = [{key: 1, value: 10},                {key: 2, value: 20},                {key: 3, value: 30}];var reformattedArray = kvArray.map(function(obj) {    var rObj = {};   rObj[obj.key] = obj.value;   return rObj;});kvArray(3) 0: {key: 1, value: 10}1: {key: 2, value: 20}2: {key: 3, value: 30}length: 3__proto__: Array(0)reformattedArray(3) 0: {1: 10}1: 10__proto__: Object1: {2: 20}2: {3: 30}length: 3__proto__: Array(0)

some()方法

array.some(function(currentValue,index,arr),thisValue)callback函数为每个元素测试,取三个参数:currentValue正在数组中处理当前元素。index数组中正在处理的元素的索引。array数组some()被调用。thisArg Optionalthis执行时使用的值callback。thisValue可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue ,"this" 的值为 "undefined"

some()方法测试数组中是否至少有一个元素通过了由提供的函数实现的测试

测试数组元素的值

以下示例测试数组中的任何元素是否大于10。

function isBiggerThan10(element, index, array) {  return element > 10;}[2, 5, 8, 1, 4].some(isBiggerThan10);  // false[12, 5, 8, 1, 4].some(isBiggerThan10); // true

使用箭头函数测试数组元素

箭头函数为同一个测试提供了一个更短的语法。

[2, 5, 8, 1, 4].some(x => x > 10);  // false[12, 5, 8, 1, 4].some(x => x > 10); // true

检查数组中是否存在值

为了模仿includes() 方法的功能,true如果元素存在于数组中,则此自定义函数将返回:

var fruits = ['apple', 'banana', 'mango', 'guava'];function checkAvailability(arr, val) {  return arr.some(function(arrVal) {    return val === arrVal;  });}checkAvailability(fruits, 'kela');   // falsecheckAvailability(fruits, 'banana'); // true

使用箭头函数检查值是否存在

var fruits = ['apple', 'banana', 'mango', 'guava'];function checkAvailability(arr, val) {  return arr.some(arrVal => val === arrVal);}checkAvailability(fruits, 'kela');   // falsecheckAvailability(fruits, 'banana'); // true

将任何值转换为布尔值

var TRUTHY_VALUES = [true, 'true', 1];function getBoolean(value) {  'use strict';     if (typeof value === 'string') {     value = value.toLowerCase().trim();  }  return TRUTHY_VALUES.some(function(t) {    return t === value;  });}getBoolean(false);   // falsegetBoolean('false'); // falsegetBoolean(1);       // truegetBoolean('true');  // true

归并方法

ECMAScript 5还新增了两个归并数组的方法:reduce()和reduceRight()。这两个方法都会迭代数组的所有项,然后构建一个最终返回的值。其中reduce()方法从数组的第一项开始,逐个遍历到最后。而reduceRight()则从数组的最后一项开始,向前遍历到第一项。

这两个方法都接收两个参数:一个在每一项上调用的函数和(可选的)作为归并并基础的初始值。传给 reduce() 和 reduceRight() 的函数接收 4 个参数:前一个值、当前值、项的索引和数组对象。这 个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在数组的第二项上,因此第 一个参数是数组的第一项,第二个参数就是数组的第二项。

reduce() 方法

array.reduce(function(previousValue, currentValue, currentIndex, arr), initialValue)previousValue上一次调用回调函数返回的值,或者是提供的初始值(initialValue)currentValue数组中当前被处理的元素currentIndex当前被处理元素在数组中的索引, 即currentValue的索引.如果有initialValue初始值, 从0开始.如果没有从1开始.array调用 reduce 的数组initialValue可选。传递给函数的初始值

reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值。 reduce是如何工作的

例如执行下面的代码

[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index, array){ return previousValue + currentValue; }); 回调被执行四次,每次的参数和返回值如下表:

previousValuecurrentValueindexarrayreturn value

first call 0 1 1 [0,1,2,3,4] 1 second call 1 2 2 [0,1,2,3,4] 3 third call 3 3 3 [0,1,2,3,4] 6 fourth call 6 4 4 [0,1,2,3,4] 10 reduce 的返回值是回调函数最后一次被调用的返回值(10)。

你也可以使用箭头函数替代上面的函数, 下面的代码有同样的输出结果:

[0, 1, 2, 3, 4].reduce( (prev, curr) => prev + curr ); 如果把初始值作为第二个参数传入 reduce,结果如下,结果如下:

[0,1,2,3,4].reduce( (previousValue, currentValue, currentIndex, array) => { return previousValue + currentValue; }, 10); previousValue currentValue index array return value first call 10 0 0 [0,1,2,3,4] 10 second call 10 1 1 [0,1,2,3,4] 11 third call 11 2 2 [0,1,2,3,4] 13 fourth call 13 3 3 [0,1,2,3,4] 16 fifth call 16 4 4 [0,1,2,3,4] 20 最后一次函数调用的返回值 (20) 作为reduce函数的结果被返回. 将数组所有项相加

var total = [0, 1, 2, 3].reduce(function(a, b) {    return a + b;}, 0);// total == 6

或者用箭头函数这样写:

var total = [ 0, 1, 2, 3 ].reduce( ( acc, cur ) => acc + cur, 0 );

扁平化一个二维数组

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {    return a.concat(b);}, []);// flattened is [0, 1, 2, 3, 4, 5]

原创粉丝点击