JavaScript 数组迭代

ການອອກຮູບວິທະຍານວິທະຍາຂອງອັດຕາຂອງ JavaScript.

Array.forEach()

forEach() ການຈັດຕັ້ງເຮັດວຽກວ່າກັບການອອກຮູບວ່າກັບແຕ່ລະຫົວຂໍ້ຂອງອັດຕາ(ການອອກຮູບຮັບຜົນ).

ຄວາມຈິງ

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value, index, array) {
  txt = txt + value + "<br>";

ທີ່ຈະທົດລອງ

ຄວາມຄິດເຫັນ:ການຈັດຕັ້ງຍອມຮັບ 3 ການຈັດຕັ້ງ:

  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

ບົດການນີ້ພຽງແຕ່ໃຊ້ຄວາມສຳນວນ value. ບົດການນີ້ສາມາດຂຽນອີກຄື:

ຄວາມຈິງ

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value) {
  txt = txt + value + "<br>";

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.forEach()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

Array.map()

map() ການຈັດຕັ້ງສ້າງອັດຕາໃໝ່ຈາກການດຳເນີນການຈັດຕັ້ງວ່າກັບແຕ່ລະຫົວຂໍ້ຂອງອັດຕາ.

map() ການຈັດຕັ້ງຈະບໍ່ດຳເນີນການຈັດຕັ້ງວ່າກັບຫົວຂໍ້ອັດຕາທີ່ບໍ່ມີຄຸນຄ່າ.

map() ການຈັດຕັ້ງຈະບໍ່ປ່ຽນອັດຕາຕົ້ນໄປ.

ບົດການນີ້ຈຳນວນຄຸນຄ່າອັດຕາໃນອັດຕາ:

ຄວາມຈິງ

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value, index, array) {
  return value * 2;

ທີ່ຈະທົດລອງ

ບັງຄັບວ່າການຈັດຕັ້ງມີ 3 ການຈັດຕັ້ງ:

  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

ຖ້າການອອກຮູບຮັບຜົນພຽງພໍກັບຄວາມສຳນວນ value ສາມາດລາອກຄວາມສຳນວນ index ແລະ array:

ຄວາມຈິງ

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value) {
  return value * 2;

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.map()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

Array.filter()

filter() ການຈັດຕັ້ງສ້າງອັດຕາໃໝ່ທີ່ບັນທຶກຫົວຂໍ້ທີ່ຜ່ານການກວດສອບ.

ບົດການນີ້ສ້າງອັດຕາໃໝ່ຈາກຫົວຂໍ້ທີ່ມີຄຸນຄ່າຫຼາຍກວ່າ 18:

ຄວາມຈິງ

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value, index, array) {
  return value > 18;

ທີ່ຈະທົດລອງ

ສະແດງວ່າການຫາຫານັ້ນຕ້ອງມີ 3 ຄວາມຄິດ:

  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

ໃນບົດການນີ້ການອອກຮູບວ່າການອອກຮູບຮັບຜົນຈາກການອອກຮູບຮັບຜົນບໍ່ຕ້ອງໃຊ້ຄວາມສຳນວນ index ແລະ array:

ຄວາມຈິງ

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value) {
  return value > 18;

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.filter()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

Array.reduce()

reduce() ການຈັດຕັ້ງໃຊ້ການຈັດຕັ້ງວ່າກັບແຕ່ລະຫົວຂໍ້ຂອງອັດຕາເພື່ອຈຳນວນຄວາມສຸດທ້າຍ(ຫຼຸດມັນ).

reduce() ການຈັດຕັ້ງເຮັດວຽກຈາກທາງຫນັງຫາທາງຊ້າຍ. ບໍ່ລາອີກ reduceRight().

reduce() ການຈັດຕັ້ງຈະບໍ່ຫຼຸດອັດຕາຕົ້ນໄປ.

ບົດການນີ້ກຳນົດຄວາມສຸດທ້າຍຈາກອັດຕາສະເລ່ຍທັງໝົດໃນອັດຕາ:

ຄວາມຈິງ

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value, index, array) {
  return total + value;

ທີ່ຈະທົດລອງ

ບັງຄັບວ່າການຈັດຕັ້ງຕ້ອງຍອມຮັບ 4 ການຈັດຕັ້ງ:

  • 总数（初始值/先前返回的值）
  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

上例并未使用 index 和 array 参数。可以将它改写为：

ຄວາມຈິງ

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value) {
  return total + value;

ທີ່ຈະທົດລອງ

reduce() ການຈັດຕັ້ງສາມາດຍອມຮັບຄວາມສຸດທ້າຍເປັນພື້ນຖານ:

ຄວາມຈິງ

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction, 100);
function myFunction(total, value) {
  return total + value;

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.reduce()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

Array.reduceRight()

reduceRight() ການຈັດຕັ້ງໃຊ້ການຈັດຕັ້ງວ່າກັບແຕ່ລະຫົວຂໍ້ຂອງອັດຕາເພື່ອຈຳນວນຄວາມສຸດທ້າຍ(ຫຼຸດມັນ).

reduceRight() ການຈັດຕັ້ງເຮັດວຽກຈາກທາງຊ້າຍຫາທາງຫນັງ. ບໍ່ລາອີກ reduce().

reduceRight() ການຈັດຕັ້ງຈະບໍ່ຫຼຸດອັດຕາຕົ້ນໄປ.

ບົດການນີ້ກຳນົດຄວາມສຸດທ້າຍຈາກອັດຕາສະເລ່ຍທັງໝົດໃນອັດຕາ:

ຄວາມຈິງ

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value, index, array) {
  return total + value;

ທີ່ຈະທົດລອງ

ບັງຄັບວ່າການຈັດຕັ້ງຕ້ອງຍອມຮັບ 4 ການຈັດຕັ້ງ:

  • 总数（初始值/先前返回的值）
  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

上例并未使用 index 和 array 参数。可以将它改写为：

ຄວາມຈິງ

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value) {
  return total + value;

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.reduceRight()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

Array.every()

every() 方法检查所有数组值是否通过测试。

这个例子检查所有数组值是否大于 18：

ຄວາມຈິງ

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value, index, array) {
  return value > 18;

ທີ່ຈະທົດລອງ

ສະແດງວ່າການຫາຫານັ້ນຕ້ອງມີ 3 ຄວາມຄິດ:

  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

如果回调函数仅使用第一个参数（值）时，可以省略其他参数：

ຄວາມຈິງ

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value) {
  return value > 18;

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.every()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

Array.some()

some() ວິທະຍານຈະກວດກາບັນດາລາຍການຢ່າງໃດຈະຜ່ານການກວດກາ.

ບົດສະຫຼຸບນີ້ຈະກວດກາບັນດາລາຍການຢ່າງໃດຈະຫຼາຍກວ່າ 18:

ຄວາມຈິງ

var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);
function myFunction(value, index, array) {
  return value > 18;

ທີ່ຈະທົດລອງ

ສະແດງວ່າການຫາຫານັ້ນຕ້ອງມີ 3 ຄວາມຄິດ:

  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.some()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

Array.indexOf()

indexOf() ວິທະຍານມີການຄົ້ນຫາຄູກຄົນພາຍໃນບັນດາລາຍການແລະກັບຄືນຕຳແຫນ່ງຂອງມັນ.

ຄວາມຄິດເຫັນ:ຕຳແຫນ່ງບັນດາລາຍການທໍາອິດແມ່ນ 0, ຕຳແຫນ່ງບັນດາລາຍການທີສອງແມ່ນ 1, ດັ່ງນັ້ນແຕ່ງຕັ້ງ.

ຄວາມຈິງ

ຄົ້ນຫາບັນດາລາຍການ "Apple"：

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.indexOf()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

ຄຳນວຍຄວາມ

array.indexOf(ບັນດາລາຍການ, ເລີ່ມຕົ້ນ)
ບັນດາລາຍການ ຕ້ອງການຄົ້ນຫາບັນດາບັນດາລາຍການ
ເລີ່ມຕົ້ນ ຄຳຄວາມເລືອກຄືນ. ຈະເລີ່ມຈາກບ່ອນທີ່ຈະຄົ້ນຫາ. ຈະເລີ່ມຈາກທີ່ຫຼັງຖ້າມີຄວາມນັບບັນຫາທີ່ບໍ່ພົບ.

ຖ້າບັນດາລາຍການບໍ່ພົບ:Array.indexOf() ກັບຄືນ -1.

ຖ້າບັນດາລາຍການມີການປະກົດຢູ່ຫຼາຍຄັ້ງແລ້ວຈະກັບຄືນຕອນທຳອິດທີ່ພົບ.

Array.lastIndexOf()

Array.lastIndexOf() ກັບ Array.indexOf() ຄືກັນແຕ່ຈະຄົ້ນຫາຈາກທີ່ຫຼັງຂອງບັນດາລາຍການ.

ຄວາມຈິງ

ຄົ້ນຫາບັນດາລາຍການ "Apple"：

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");

ທີ່ຈະທົດລອງ

ບັນດາສາຍພິພາກວິທະຍາອອກລາຍການທັງໝົດ Array.lastIndexOf()ນອກຈາກ Internet Explorer 8 ຫຼືເກົ່າກວ່າ:

ໄດ້ 9.0 ໄດ້ ໄດ້ ໄດ້

ຄຳນວຍຄວາມ

array.lastIndexOf(ບັນດາລາຍການ, ເລີ່ມຕົ້ນ)
ບັນດາລາຍການ ຕ້ອງການຄົ້ນຫາບັນດາບັນດາລາຍການ
ເລີ່ມຕົ້ນ ທາງເລືອກ. ຈາກບ່ອນໃດເລີ່ມຄົ້ນຫາ. ຈາກຕອນຫຼັງມັນຈະຕິດຕາມບ່ອນທີ່ບໍ່ສາມາດຫາບາງບາງລາຍການຄົ້ນຫາ.

Array.find()

find() ການຫາຫານັ້ນຕ້ອງມີຄູ່ມູນທີ່ຫຼາຍກວ່າ 18.

ຄືວັນນີ້ຫານັງການຄົ້ນຫາຄູ່ມູນທີ່ຫຼາຍກວ່າ 18:

ຄວາມຈິງ

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;

ທີ່ຈະທົດລອງ

ສະແດງວ່າການຫາຫານັ້ນຕ້ອງມີ 3 ຄວາມຄິດ:

  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

ການບໍ່ສະໜັບສະໜູນຂອງບາຣເວີເຊີຍເກົ່າ Array.find()ລາຍການພາຍໃຕ້ນີ້ສະແດງການສະໜັບສະໜູນຂອງການນໍາໃຊ້ນັ້ນຄັ້ງທໍາອິດ:

45 12 25 8 32

Array.findIndex()

findIndex() ການຫາຫານັ້ນຕ້ອງມີດ້ານດັງຂອງອົງການທີ່ຫຼາຍກວ່າ 18.

ຄືວັນນີ້ຫານັງການຄົ້ນຫາດ້ານດັງຂອງອົງການທີ່ຫຼາຍກວ່າ 18:

ຄວາມຈິງ

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;

ທີ່ຈະທົດລອງ

ສະແດງວ່າການຫາຫານັ້ນຕ້ອງມີ 3 ຄວາມຄິດ:

  • ຄູ່ມູນ
  • ດ້ານດັງການ
  • ວັດຖຸອົງການ

ການບໍ່ສະໜັບສະໜູນຂອງບາຣເວີເຊີຍເກົ່າ Array.findIndex()ລາຍການພາຍໃຕ້ນີ້ສະແດງການສະໜັບສະໜູນຂອງການນໍາໃຊ້ນັ້ນຄັ້ງທໍາອິດ:

45 12 25 8 32