Kaedah tatasusunan ES6 termasuk: "dari()", "daripada()", "copyWithin()", "fill()", "find()", "findIndex()", "includes( )", "entry()", "keys()", "values()", dsb.
Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.
修改原数组 | 不修改原数组 |
---|---|
push, pop | concat |
unshift,shift | join |
sort | slice |
reverse | indexOf(),lastIndexOf() |
splice | forEach |
copyWithin | map |
fill | filter |
some | |
every | |
reduce,reduceRight | |
includes | |
finde,findIndex | |
entries(),keys(),values() |
splice
Syntax
arrayObject.splice(index,howmany,item1,.....,itemX)
var arr = new Array(); arr[0] = "George"; arr[1] = "John"; arr[2] = "Thomas"; arr.splice(2,1); //"George", "John" arr.splice(1,0,"William"); //"George", "William", "John" arr.splice(2,1,"haha"); //"George", "William", "haha"
slice
Syntax
arrayObject.slice(start,end);
var arr = new Array(); arr[0] = "George"; arr[1] = "John"; arr[2] = "Thomas"; arr.slice(2,1); //[] arr.slice(1,2); //"William" arr.slice(-2,-1); //"William"
Tukar objek seperti tatasusunan (seperti argumen) kepada tatasusunan sebenar
Array.prototype.slice.call(arguments);
kaedah tidak mengubah suai tatasusunan asal
Kaedah indeks
indexOf
array.indexOf(searchElement[, fromIndex])
var data = [2, 5, 7, 3, 5]; console.log(data.indexOf(5, "x")); // 1 ("x"被忽略) console.log(data.indexOf(5, "3")); // 4 (从3号位开始搜索)
lastIndexOf
array.lastIndexOf(searchElement[, fromIndex])
var data = [2, 5, 7, 3, 5]; console.log(data.lastIndexOf(5)); // 4 console.log(data.lastIndexOf(5, 3)); // 1 (从后往前,索引值小于3的开始搜索) console.log(data.lastIndexOf(4)); // -1 (未找到)
Kedua-dua kaedah akan menggunakan operator kesamaan apabila membandingkan parameter pertama dengan setiap item dalam tatasusunan Mereka mesti sama sepenuhnya, jika tidak -1 akan dikembalikan.
Kaedah berulang
Setiap kaedah menerima dua parameter, parameter panggil balik pertama (fungsi panggil balik, diperlukan), parameter kedua Parameter pertama ialah parameter konteks pilihan.
Perlu diambil perhatian bahawa kecuali untuk kaedah forEach(), panggilan balik dalam kaedah lelaran lain perlu mempunyai nilai pulangan, jika tidak, ia akan kembali tidak ditentukan.
forEach
forEach() menggelung melalui tatasusunan dan menjalankan fungsi yang diberikan pada setiap item dalam tatasusunan Kaedah ini tidak mempunyai nilai pulangan.
[].forEach(function(value, index, array) { // ... }, [ thisObject]);
[1, 2, 3, 4].forEach(function (item, index, array) { console.log(array[index] == item); // true sum += item; }); alert(sum); // 10 var database = { users: ["张含韵", "江一燕", "李小璐"], sendEmail: function (user) { if (this.isValidUser(user)) { console.log("你好," + user); } else { console.log("抱歉,"+ user +",你不是本家人"); } }, isValidUser: function (user) { return /^张/.test(user); } }; // 给每个人法邮件 database.users.forEach( // database.users中人遍历 database.sendEmail, // 发送邮件 database // 使用database代替上面标红的this ); // 结果: // 你好,张含韵 // 抱歉,江一燕,你不是本家人 // 抱歉,李小璐,你不是本家
map
map() merujuk kepada "pemetaan". Ia menjalankan fungsi yang diberikan pada setiap item dalam tatasusunan dan mengembalikan tatasusunan yang terdiri daripada hasil setiap panggilan fungsi.
[].map(function(value, index, array) { // ... }, [ thisObject]);
var data = [1, 2, 3, 4]; var arrayOfSquares = data.map(function (item) { return item * item; }); alert(arrayOfSquares); // 1, 4, 9, 16
penapis
penapis(), "penapis", menjalankan fungsi yang diberikan pada setiap item dalam tatasusunan dan mengembalikan komposisi yang memenuhi tatasusunan keadaan penapisan.
array.filter(callback,[ thisObject]);
var arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; var flag = arr3.filter(function(value, index) { return value % 3 === 0; }); console.log(flag); // [3, 6, 9]
setiap
setiap(), menentukan sama ada setiap item dalam tatasusunan memenuhi syarat yang diberikan Apabila semua item memenuhi syarat, akan kembali benar.
Nota: Jika tatasusunan kosong, benar akan dikembalikan
array.every(callback,[ thisObject]);
var arr4 = [1, 2, 3, 4, 5]; var flag = arr4.every(function(value, index) { return value % 2 === 0; }); console.log(flag); // false
beberapa
some(), menentukan sama ada terdapat item dalam tatasusunan yang memenuhi syarat Selagi satu item memenuhi syarat, ia akan kembali benar.
Nota: Jika tatasusunan kosong, false akan dikembalikan
array.some(callback,[ thisObject]);
var arr5 = [1, 2, 3, 4, 5]; var flag = arr5.some(function(value, index) { return value % 2 === 0; }); console.log(flag); // true
Kaedah gabungan
这两个方法相比前面可能稍微复杂一些,它们都会迭代数组中的所有项,然后生成一个最终返回值。这两个方法接收两个参数。
reduce
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。 reduce() 对于空数组是不会执行回调函数的。
array. reduce(function(total, currentValue, currentIndex, array) {<br/> // ...<br/>});
var arr9 = [1, 2, 3, 4]; var sum9 =arr9.reduce(function (total, curr, index, array) { return total * curr; }); console.log(sum9); // 24 var sum9_1 =arr9.reduce(function (total, curr, index, array) { return total * curr; }, 10); console.log(sum9_1); // 240
reduceRight
reduceRight()和reduce()相比,用法类似,差异在于reduceRight是从数组的末尾开始实现的。
array.reduceRight(callback,[ thisObject]);
var arr9 = [2, 45, 30, 80]; var flag = arr9.reduceRight(function (total, curr, index) { return total - curr; }); var flag_1 = arr9.reduceRight(function (total, curr, index) { return total - curr; },200); console.log(flag); // 3 console.log(flag_1); // 43
Array方法
isArray
判断参数是否是”Array”返回true或false。
var a = [1,2,3]; Array.isArray(a); //true
Array方法
Array.from()
用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)。
let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3 }; let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']
Array.from还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组。
Array.from(arrayLike, x => x * x); // 等同于 Array.from(arrayLike).map(x => x * x); Array.from([1, 2, 3], (x) => x * x) // [1, 4, 9]
Array.of()
用于将一组值,转换为数组。
Array.of(3, 11, 8) // [3,11,8] Array.of(3) // [3]
实例方法
会改变原数组
copyWithin()
在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组。
array. copyWithin(target, start = 0, end = this.length);
// 将3号位复制到0号位 [1, 2, 3, 4, 5].copyWithin(0, 3, 4) // [4, 2, 3, 4, 5] // -2相当于3号位,-1相当于4号位 [1, 2, 3, 4, 5].copyWithin(0, -2, -1) // [4, 2, 3, 4, 5]
fill()
使用给定值,填充一个数组。
['a', 'b', 'c'].fill(7); // [7, 7, 7] let arr = new Array(3).fill([]); arr[0].push(5); // [[5], [5], [5]]
不会改变原数组
find()
用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。
find方法的回调函数可以接受三个参数,依次为当前的值、当前的位置和原数组。
[1, 4, -5, 10].find((n) => n < 0) // -5 [1, 5, 10, 15].find(function(value, index, arr) { return value > 9; }) // 10
findIndex()
findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。
[1, 5, 10, 15].findIndex(function(value, index, arr) { return value > 9; }) // 2
includes()
返回一个布尔值,表示某个数组是否包含给定的值。
[1, 2, 3].includes(2) // true
entries(),keys() 和 values()
ES6提供了三个新方法:entries()、keys()和values(),用来遍历数组。它们都返回一个遍历器对象,可以用for...of循环进行遍历,唯一的区别是keys()是对数组的键名的遍历、values()是对数组键值的遍历,entries()方法是对数值的键值对的遍历。
for (let index of ['a', 'b'].keys()) { console.log(index); } // 0 // 1 for (let elem of ['a', 'b'].values()) { console.log(elem); } // 'a' // 'b' for (let [index, elem] of ['a', 'b'].entries()) { console.log(index, elem); } // 0 "a" // 1 "b"
如果不使用for...of循环,可以手动调用遍历器对象的next方法,进行遍历。
let letter = ['a', 'b', 'c']; let entries = letter.entries(); console.log(entries.next().value); // [0, 'a'] console.log(entries.next().value); // [1, 'b'] console.log(entries.next().value); // [2, 'c']
【推荐学习:javascript高级教程】
Atas ialah kandungan terperinci Apakah kaedah tatasusunan es6?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!