kaedah tatasusunan es6: 1. kaedah mencari; 9. kaedah untuk setiap; 10. kaedah kunci, dsb.
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.
Susun atur ialah himpunan data daripada jenis data yang sama yang disusun dalam susunan tertentu. Dalam versi baharu standard bahasa JavaScript ES6 (ECMAScript 6), ES6 menambahkan beberapa ciri baharu pada tatasusunan, dan ciri baharu ini mengembangkan keupayaan tatasusunan untuk memproses data Apabila berhadapan dengan pengumpulan data yang besar, pengumpulan dan penapisan selalunya boleh diselesaikan tanpa operasi gelung , penukaran dan kerja lain. Artikel ini akan meringkaskan cara menggunakan beberapa ciri baharu yang disediakan oleh ES6 untuk tatasusunan.
memproses setiap elemen dalam tatasusunan dengan merumuskan kaedah dan mengembalikan tatasusunan yang diproses.
console.clear();
var arr = [12,14,34,22,18];
var arr1 = arr.map((currentValue,index,arr) => {
console.log("当前元素"+currentValue);
console.log("当前索引"+index);
if (currentValue>20) {
return currentValue-10;
} else {
return currentValue-5;
}
})
console.log(arr1)
//另一种形式
let nums = [1, 2, 3];
let obj = {val: 5};
let newNums = nums.map(function(item,index,array) {
return item + index + array[index] + this.val;
//对第一个元素，1 + 0 + 1 + 5 = 7
//对第二个元素，2 + 1 + 2 + 5 = 10
//对第三个元素，3 + 2 + 3 + 5 = 13
}, obj);
console.log(newNums);//[7, 10, 13]dapatkan semula elemen dalam tatasusunan, kaedah cari mengembalikan elemen pertama yang memenuhi keperluan dan kaedah findIndex. mengembalikan yang pertama Subskrip elemen yang memenuhi keperluan.
console.clear();
var arr = [12,14,34,22,18];
var arr1 = arr.find((currentValue, index) => {
return currentValue>20;
})
var arr2 = arr.findIndex((currentValue, index) => {
return currentValue>20;
})
console.log(arr,arr1,arr2);
//数组元素为对象
var allPeple = [
{name: '小王', id: 14},
{name: '大王', id: 41},
{name: '老王', id: 61}
]
var PId = 14; //假如这个是要找的人的ID
var myTeamArr = [{name: '小王', id: 14}]
function testFunc(item){return item.id == PId ;}
//判断myteam里是不是有这个人，如果==-1 代表没有，在allPeople中找到他，添加入我的队伍
myTeamArr.findIndex(testFunc) == -1
? myTeamArr.push(allPeple.find(testFunc))
: console.log('已存在该人员');
//检索满足条件的对象
var stu = [
{name: '张三', gender: '男', age: 20},
{name: '王小毛', gender: '男', age: 20},
{name: '李四', gender: '男', age: 20}
]
var obj = stu.find((element) => (element.name == '李四'))
console.log(obj);
console.log(obj.name);
[1,2,3].findIndex(function(x) {x == 2;});
// Returns an index value of 1.
[1,2,3].findIndex(x => x == 4);
// Returns an index value of -1mendapatkan semula elemen dalam tatasusunan dan mengembalikan semua elemen yang memenuhi keperluan dalam bentuk tatasusunan.
console.clear();
var arr = [12,14,34,22,18];
var arr1 = arr.filter((currentValue, index) => {
return currentValue>20;
})
console.log(arr,arr1);
//逻辑属性的筛选
var arr = [
{ id: 1, text: 'aa', done: true },
{ id: 2, text: 'bb', done: false }
]
console.log(arr.filter(item => item.done))
// 保留奇数项
let nums = [1, 2, 3];
let oddNums = nums.filter(item => item % 2);
console.log(oddNums);mengesan sama ada setiap elemen dalam tatasusunan memenuhi syarat, ia mengembalikan benar, jika tidak, ia adalah palsu.
console.clear();
var arr = [12,14,34,22,18];
var arr1 = arr.every((currentValue, index) => {
return currentValue>20;
})
console.log(arr,arr1);mengesan sama ada terdapat unsur dalam tatasusunan yang memenuhi syarat, ia mengembalikan benar, jika tidak, ia adalah palsu.
console.clear();
var arr = [12,14,34,22,18];
var arr1 = arr.some((currentValue, index) => {
return currentValue>20;
})
console.log(arr,arr1);Terima fungsi sebagai penumpuk (akumulator), bermula dengan setiap nilai dalam tatasusunan (dari kiri ke kanan) Dikurangkan kepada satu nilai. reduce menerima fungsi, yang mempunyai empat parameter: nilai terakhir previousValue, nilai semasa currentValue, indeks nilai semasa dan tatasusunan.
Kaedah reduceRight adalah sama dengan kaedah reduce, kedua-duanya mencari nombor kumulatif tatasusunan. Perbezaannya ialah reduceRight() mengumpul item tatasusunan dalam tatasusunan dari hujung tatasusunan ke hadapan.
Apabila reduceRight() memanggil fungsi panggil balik callbackfn buat kali pertama, prevValue dan curValue boleh menjadi salah satu daripada dua nilai. Jika reduceRight() dipanggil dengan argumen initialValue, prevValue adalah sama dengan initialValue dan curValue adalah sama dengan nilai terakhir dalam tatasusunan. Jika parameter initialValue tidak disediakan, prevValue adalah sama dengan nilai terakhir dalam tatasusunan dan curValue adalah sama dengan nilai kedua hingga terakhir dalam tatasusunan.
console.clear();
var arr = [0,1,2,3,4];
var total = arr.reduce((a, b) => a + b); //10
console.log(total);
var sum = arr.reduce(function(previousValue, currentValue, index, array){
console.log(previousValue, currentValue, index);
return previousValue + currentValue;
});
console.log(sum);
//第二个参数为5，第一次调用的previousValue的值就用传入的第二个参数代替
var sum1 = arr.reduce(function(previousValue, currentValue, index){
console.log(previousValue, currentValue, index);
return previousValue + currentValue;
},5);
console.log(sum1);
var sum2 = arr.reduceRight(function (preValue,curValue,index) {
return preValue + curValue;
}); // 10
var sum3 = arr.reduceRight(function (preValue,curValue,index) {
return preValue + curValue;
}, 5); // 15
//计算数组arr的平方和
var arr1 = arr.map((oVal) => {return oVal*oVal;})
console.log(arr1);
var total1 = arr1.reduce((a, b) => a + b); //30
console.log(total1);
//计算指定数组和
let nums = [1, 2, 3, 4, 5];// 多个数的累加
let newNums = nums.reduce(function(preSum,curVal,array) {
return preSum + curVal;
}, 0);
console.log(newNums)//15gelung melalui elemen tatasusunan, yang bersamaan dengan gelung for dan tidak mempunyai nilai pulangan.
console.clear();
var arr = [12,14,34,22,18];
var arr1 = arr.forEach((currentValue, index) => {
console.log(currentValue, index);
})ES6 menyediakan tiga kaedah baharu, entri(), kunci() dan nilai(), dengan untuk. merentasi tatasusunan. Mereka semua mengembalikan objek traverser, yang boleh dilalui menggunakan gelung for...of Satu-satunya perbezaan ialah keys() melintasi nama kunci, values() melintasi nilai kunci dan entri() melintasi nilai kunci.
console.clear();
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"Kaedah Array.from() digunakan terutamanya untuk menggabungkan dua jenis objek (objek seperti array) object] dan objek iterable [iterable]) ke dalam tatasusunan sebenar.
console.clear();
//类似数组的对象转为真正的数组
let arrayLike = {
'0': 'a',
'1': 'b',
'2': 'c',
length: 3
}
console.log(Array.from(arrayLike)); // ["a","b","c"]
//字符转数组
let arr = Array.from('w3cplus.com') //字符转数组
console.log(arr); // ["w","3","c","p","l","u","s",".","c","o","m"]
//Set数据转数组
let namesSet = new Set(['a', 'b']) //new Set创建无重复元素数组
let arr2 = Array.from(namesSet); //将Set结构数据转为数组
console.log(arr2); //["a","b"]
//转换Map数据
let m = new Map([[1, 2], [2, 4], [4, 8]]);
console.log(Array.from(m)); // [[1, 2], [2, 4], [4, 8]]
//接受第二个参数为map转换参数
var arr = Array.from([1, 2, 3]); //返回一个原样的新数组
var arr1 = Array.from(arr, (x) => x * x)
console.log(arr1); // [1, 4, 9]
var arr2 = Array.from(arr, x => x * x);
console.log(arr2); // [1, 4, 9]
var arr3 = Array.from(arr).map(x => x * x);
console.log(arr3); // [1, 4, 9]
//大样本生成
var arr4 = Array.from({length:5}, (v, i) => i);
console.log(arr4); // [0, 1, 2, 3, 4]
//第三个参数为diObj对象，map函数中this指向该对象
//该功能实现由对象自带方法转换数据
let diObj = {
handle: function(n){
return n + 2
}
}
console.log(Array.from(
[1, 2, 3, 4, 5],
function (x){return this.handle(x)},
diObj
)) //[3, 4, 5, 6, 7]Kaedah copyWidthin boleh menyalin item tatasusunan pada kedudukan yang ditentukan ke kedudukan lain dalam tatasusunan semasa (ia akan menimpa yang asal array item) , dan kemudian mengembalikan tatasusunan semasa. Menggunakan kaedah copyWidthin akan mengubah suai tatasusunan semasa.
copyWidthin akan menerima tiga parameter [.copyWithin(target, start = 0, end = this.length)]:
console.clear(); var arr = [1, 2, 3, 4, 5]; //从下标3开始提取2个（5-3=2）元素到下标0 var arr = arr.copyWithin(0, 3, 5); console.log(arr);
Kaedah isian mengisi tatasusunan dengan nilai yang diberikan. Kaedah ini sangat mudah untuk memulakan tatasusunan kosong. Semua elemen sedia ada dalam tatasusunan akan dipadamkan. Kaedah pengisian
juga boleh menerima parameter kedua dan ketiga, yang digunakan untuk menentukan kedudukan permulaan dan penamat pengisian.
console.clear();
var arr = ['a', 'b', 'c',,,];
arr.fill(0, 2, 5);
console.log(arr); // ["a", "b", 0, 0, 0]
arr.fill(0, 2);
console.log(arr); // ["a", "b", 0, 0, 0]
arr = new Array(5).fill(0, 0, 3);
console.log(arr); // [0, 0, 0, empty × 2]
arr = new Array(5).fill(0, 0, 5);
console.log(arr); // [0, 0, 0, 0, 0]
console.log(new Array(3).fill({})); //[{…}, {…}, {…}]
console.log(new Array(3).fill(1)); //[1, 1, 1]ES6 menyediakan Set struktur data baharu. Ia serupa dengan tatasusunan, tetapi nilai ahli adalah unik dan tiada nilai pendua.
console.clear();
var s = new Set();
[2,3,5,4,5,2,2].forEach(x => s.add(x));
console.log(s); //{2, 3, 5, 4}
for(let i of s) {console.log(i);} //Set对象循环
var set = new Set([1,2,3,4,4]);
//符号”...“将一个数组转为用逗号分隔的参数序列
console.log([...set]); //[1, 2, 3, 4]
var items = new Set([1,2,3,4,5,5,5,5,]);
console.log(items.size); //5，元素个数
// add添加元素
var set = new Set();
set.add("a");
set.add("b");
console.log(set); //{"a", "b"}
var s = new Set();
s.add(1).add(2).add(2); //链式添加
console.log(s.size);
console.log(s.has(1)); //has判断元素1是否存在
console.log(s.has(2)); //true
console.log(s.has(3)); //false
s.delete(2); //删除第2个元素
console.log(s.has(2)); //false
// set转数组
var items = new Set([1,2,3,4,5]);
var array = Array.from(items);
console.log(array); //[1, 2, 3, 4, 5]
// 数组的 map 和 filter 方法也可以间接用于Set
var s = new Set([1,2,3]);
s = new Set([...s].map(x => x * 2));
console.log(s); //{2, 4, 6}
s = new Set([...s].filter(x => (x % 3) ==0));
console.log(s); //6，被3整除
// 实现并集、交集、差集
var a = new Set([1,2,3]);
var b = new Set([4,3,2]);
//并集
var union = new Set([...a, ...b]);
console.log(union);
//交集
var intersect = new Set([...a].filter(x => b.has(x)));
console.log(intersect);
//差集
var difference = new Set([...a].filter(x => !b.has(x)));
console.log(difference);
//遍历数据同步改变原来的Set结构
// 利用原Set结构映射出一个新的结构
var set1 = new Set([1,2,3]);
set1 = new Set([...set1].map(val => val *2));
console.log(set1);
// 利用Array.from
var set2 = new Set([1,2,3]);
set2 = new Set(Array.from(set2, val => val * 2));
console.log(set2);Objek peta untuk menyimpan pasangan nilai kunci, dan boleh mengingati susunan sisipan kunci yang asal. Sebarang nilai (objek atau primitif) boleh digunakan sebagai kunci atau nilai. Peta, sebagai satu set struktur pasangan nilai kunci, mempunyai kelajuan carian yang sangat pantas.
console.clear(); var names = ['Michael', 'Bob', 'Tracy']; var scores = [95, 75, 85]; //Map键值对的结构 var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]); console.log(m.get('Michael')); // 95 //初始化Map需要的二维数组 var m = new Map(); // 空Map m.set('Adam', 67); // 添加新的key-value m.set('Bob', 59); console.log(m.has('Adam')); // 是否存在key 'Adam': true m.get('Adam'); // 67 m.delete('Adam'); // 删除key 'Adam' console.log(m.get('Adam')); // undefined //key相同时，后面的值会把前面的值冲掉 var m = new Map(); m.set('Adam', 67); m.set('Adam', 88); console.log(m.get('Adam')) // 88
ES6新版本JavaScript语言给数组添加了许多面向大数据处理的新功能，使得JS在数据处理量和速度方面有了质的提升。需要提示的是，当我们处理的数据量较大时，建议使用Google Chrome浏览器。ES6数组+Chrome浏览器，使得JS在数据处理功能产生变革，完全可以媲美Python或R语言等数据处理软件。
提示：本页中JS脚本代码可复制粘贴到JS代码运行窗口调试体验； 文本编辑快捷键：Ctrl+A - 全选；Ctrl+C - 复制； Ctrl+X - 剪切；Ctrl+V - 粘贴
【推荐学习：javascript高级教程】
Atas ialah kandungan terperinci Apakah kaedah tatasusunan dalam javascript es6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
