Lặp lại mảng JavaScript – javascript cho mảng lặp lại

Bạn đang xem : javascript cho mảng lặp lại

Lặp lại mảng JavaScript

Phương thức lặp mảng hoạt động trên mọi mục của mảng.

Mảng JavaScript forEach ()

Phương thức forEach () gọi một hàm (một hàm gọi lại) một lần cho mỗi phần tử mảng.

Ví dụ

số const = [45, 4, 9, 16, 25];
let txt = “”;
number.forEach (myFunction);

hàm myFunction (giá trị, chỉ mục, mảng) {

txt + = value + “& lt; br & gt;”;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 3 đối số:

  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Ví dụ trên chỉ sử dụng tham số giá trị. Ví dụ có thể được viết lại
tới:

Ví dụ

số const = [45, 4, 9, 16, 25];
let txt = “”;
number.forEach (myFunction);

hàm myFunction (giá trị) {

txt + = value + “& lt; br & gt;”;
}

Hãy tự mình thử »

Bản đồ mảng JavaScript ()

Phương thức map () tạo một mảng mới bằng cách thực hiện một hàm trên mỗi phần tử mảng.

Phương thức map () không thực thi hàm cho mảng
các phần tử không có giá trị.

Phương thức map () không thay đổi mảng ban đầu.

Ví dụ này nhân mỗi giá trị mảng với 2:

Ví dụ

const number1 = [45, 4, 9, 16, 25];
const number2 = number1.map (myFunction);

hàm myFunction (giá trị, chỉ mục, mảng) {
trả về giá trị * 2;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 3 đối số:

  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Khi một hàm gọi lại chỉ sử dụng tham số giá trị, chỉ số và mảng
có thể bỏ qua các tham số:

Ví dụ

const number1 = [45, 4, 9, 16, 25];
const number2 = number1.map (myFunction);

hàm myFunction (giá trị) {
trả về giá trị * 2;
}

Hãy tự mình thử »

Bộ lọc mảng JavaScript ()

Phương thức filter () tạo một mảng mới với các phần tử của mảng vượt qua bài kiểm tra.

Ví dụ này tạo một mảng mới từ các phần tử có giá trị lớn hơn 18:

Ví dụ

số const = [45, 4, 9, 16, 25];
const over18 = number.filter (myFunction);

hàm myFunction (giá trị, chỉ mục, mảng) {
giá trị trả về & gt; 18;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 3 đối số:

  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Trong ví dụ trên, hàm gọi lại không sử dụng chỉ mục và mảng
nên có thể bỏ qua chúng:

Ví dụ

số const = [45, 4, 9, 16, 25];
const over18 =
number.filter (myFunction);

function myFunction (value) {
giá trị trả về & gt; 18;
}

Hãy tự mình thử »

JavaScript Array Reduce ()

Phương thức Reduce () chạy một hàm trên mỗi phần tử mảng để tạo (giảm nó thành) một giá trị duy nhất.

Phương thức Reduce () hoạt động từ trái sang phải trong mảng. Xem thêm ReduceRight () .

Phương thức Reduce () không giảm mảng ban đầu.

Ví dụ này tìm tổng của tất cả các số trong một mảng:

Ví dụ

số const = [45, 4, 9, 16, 25];
let sum = number.reduce (myFunction);

hàm myFunction (tổng số, giá trị, chỉ số, mảng) {
trả về tổng + giá trị;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 4 đối số:

  • Tổng (giá trị ban đầu / giá trị trả về trước đó)
  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Ví dụ trên không sử dụng các tham số chỉ mục và mảng. Nó có thể
được viết lại thành:

Ví dụ

số const = [45, 4, 9, 16, 25];
let sum = number.reduce (myFunction);

hàm myFunction (tổng số, giá trị) {
trả về tổng + giá trị;
}

Hãy tự mình thử »

Phương thức Reduce () có thể chấp nhận giá trị ban đầu:

Ví dụ

số const = [45, 4, 9, 16, 25];
let sum = number.reduce (myFunction,
100);

hàm myFunction (tổng, giá trị) {
trả về tổng + giá trị;
}

Hãy tự mình thử »

JavaScript Array ReduceRight ()

Phương thức ReduceRight () chạy một hàm trên mỗi phần tử mảng để tạo (giảm nó thành) một giá trị duy nhất.

ReduceRight () hoạt động từ phải sang trái trong mảng. Xem thêm Reduce () .

Phương thức ReduceRight () không giảm mảng ban đầu.

Ví dụ này tìm tổng của tất cả các số trong một mảng:

Ví dụ

số const = [45, 4, 9, 16, 25];
let sum = number.reduceRight (myFunction);

hàm myFunction (tổng số, giá trị, chỉ số, mảng) {
trả về tổng + giá trị;
}

Xem Thêm  Ví dụ và phương pháp phòng chống tấn công SQLI - ví dụ về tiêm sql là gì

Hãy tự mình thử »

Lưu ý rằng hàm có 4 đối số:

  • Tổng (giá trị ban đầu / giá trị trả về trước đó)
  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Ví dụ trên không sử dụng các tham số chỉ mục và mảng. Nó có thể
được viết lại thành:

Ví dụ

số const = [45, 4, 9, 16, 25];
let sum = number.reduceRight (myFunction);

hàm myFunction (tổng, giá trị) {
trả về tổng + giá trị;
}

Hãy tự mình thử »

Mảng JavaScript every ()

Phương thức every () kiểm tra xem tất cả các giá trị mảng có vượt qua kiểm tra hay không.

Ví dụ này kiểm tra xem tất cả các giá trị mảng có lớn hơn 18 hay không:

Ví dụ

số const = [45, 4, 9, 16, 25];
let allOver18 =
number.every (myFunction);

hàm myFunction (giá trị, chỉ mục, mảng) {
trở về
giá trị & gt; 18;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 3 đối số:

  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Khi một hàm gọi lại chỉ sử dụng tham số đầu tiên (giá trị), thì
có thể bỏ qua các tham số:

Ví dụ

số const = [45, 4, 9, 16, 25];
let allOver18 =
number.every (myFunction);

chức năng myFunction (giá trị) {
trả về
giá trị & gt; 18;
}

Hãy tự mình thử »

JavaScript Array some ()

Phương thức some () kiểm tra xem một số giá trị mảng có vượt qua kiểm tra hay không.

Ví dụ này kiểm tra xem một số giá trị mảng có lớn hơn 18 hay không:

Ví dụ

số const = [45, 4, 9, 16, 25];
let someOver18 =umbers.some (myFunction);

hàm myFunction (giá trị, chỉ số, mảng) {
trở về
giá trị & gt; 18;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 3 đối số:

  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

JavaScript Array indexOf ()

Phương thức indexOf () tìm kiếm một mảng cho một giá trị phần tử và trả về vị trí của nó.

Lưu ý: Mục đầu tiên có vị trí 0, mục thứ hai có vị trí 1, v.v.

Ví dụ

Tìm kiếm một mảng cho mục “Apple”:

const fruit = [“Apple”, “Orange”, “Apple”, “Mango”];
let position = fruit.indexOf (“Quả táo”) + 1;

Hãy tự mình thử »

Cú pháp

.indexOf (mục, bắt đầu)

mục
Yêu cầu. Mục cần tìm kiếm.

bắt đầu
Không bắt buộc. Bắt đầu tìm kiếm ở đâu. Giá trị âm sẽ bắt đầu ở vị trí đã cho đếm từ cuối và tìm kiếm đến cuối.

Array.indexOf () trả về -1 nếu không tìm thấy mục.

Nếu mục xuất hiện nhiều lần, nó sẽ trả về vị trí của mục đầu tiên
sự xuất hiện.

Mảng JavaScript lastIndexOf ()

Array.lastIndexOf () giống với Array.indexOf () , nhưng
trả về vị trí của lần xuất hiện cuối cùng của phần tử được chỉ định.

Ví dụ

Tìm kiếm một mảng cho mục “Apple”:

const fruit = [“Apple”, “Orange”, “Apple”, “Mango”];
let position = fruit.lastIndexOf (“Apple”) + 1;

Hãy tự mình thử »

Cú pháp

.lastIndexOf (mục, bắt đầu)

mục
Yêu cầu. Mục cần tìm kiếm

bắt đầu
Không bắt buộc. Bắt đầu tìm kiếm ở đâu. Các giá trị âm sẽ bắt đầu ở vị trí đã cho đếm từ cuối và tìm kiếm từ đầu

JavaScript Array find ()

Phương thức find () trả về giá trị của phần tử mảng đầu tiên vượt qua một
chức năng kiểm tra.

Ví dụ này tìm (trả về giá trị của) phần tử đầu tiên lớn hơn
trên 18 tuổi:

Ví dụ

số const = [4, 9, 16, 25, 29];
hãy để trước =
number.find (myFunction);

hàm myFunction (giá trị, chỉ mục, mảng) {
trả về
giá trị & gt; 18;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 3 đối số:

  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Hỗ trợ trình duyệt

find () là một tính năng ES6 (JavaScript 2015).

Nó được hỗ trợ trong tất cả các trình duyệt hiện đại:

Trình duyệt Chrome
Bờ rìa
Firefox
Cuộc đi săn
Opera

Đúng
Đúng
Đúng
Đúng
Đúng

find () không được hỗ trợ trong Internet Explorer.

Mảng JavaScript findIndex ()

Phương thức findIndex () trả về chỉ mục của phần tử mảng đầu tiên
vượt qua một chức năng kiểm tra.

Ví dụ này tìm chỉ mục của phần tử đầu tiên lớn hơn 18:

Ví dụ

số const = [4, 9, 16, 25, 29];
hãy để trước =
number.findIndex (myFunction);

Xem Thêm  Javascript Thêm kiểu vào phần tử - thêm kiểu vào phần tử javascript

hàm myFunction (giá trị, chỉ mục, mảng) {
trở về
giá trị & gt; 18;
}

Hãy tự mình thử »

Lưu ý rằng hàm có 3 đối số:

  • Giá trị mặt hàng
  • Chỉ mục mục
  • Bản thân mảng

Hỗ trợ trình duyệt

findIndex () là một tính năng ES6 (JavaScript 2015).

Nó được hỗ trợ trong tất cả các trình duyệt hiện đại:

Trình duyệt Chrome
Bờ rìa
Firefox
Cuộc đi săn
Opera

Đúng
Đúng
Đúng
Đúng
Đúng

findIndex () không được hỗ trợ trong Internet Explorer.

JavaScript Array.from ()

Phương thức Array.from () trả về một đối tượng Mảng từ bất kỳ đối tượng nào có độ dài
thuộc tính hoặc bất kỳ đối tượng có thể lặp lại nào.

Ví dụ

Tạo một mảng từ một chuỗi:

Array.from (“ABCDEFG”);

Hãy tự mình thử »

Hỗ trợ trình duyệt

from () là một tính năng ES6 (JavaScript 2015).

Nó được hỗ trợ trong tất cả các trình duyệt hiện đại:

Trình duyệt Chrome
Bờ rìa
Firefox
Cuộc đi săn
Opera

Đúng
Đúng
Đúng
Đúng
Đúng

from () không được hỗ trợ trong Internet Explorer.

Khóa mảng JavaScript ()

Phương thức Array.keys () trả về một đối tượng Array Iterator với các khóa của một mảng.

Ví dụ

Tạo một đối tượng Trình lặp lại mảng, chứa các khóa của mảng:

const trái cây = [“Chuối”, “Cam”, “Táo”, “Xoài”];
const key = fruit.keys ();

cho (để x trong số các phím) {
text + = x + “& lt; br & gt;”;
}

Hãy tự mình thử »

Hỗ trợ trình duyệt

key () là một tính năng của ES6 (JavaScript 2015).

Nó được hỗ trợ trong tất cả các trình duyệt hiện đại:

Trình duyệt Chrome
Bờ rìa
Firefox
Cuộc đi săn
Opera

Đúng
Đúng
Đúng
Đúng
Đúng

key () không được hỗ trợ trong Internet Explorer.

Mục nhập mảng ()

Ví dụ

Tạo một Trình lặp lại mảng, sau đó lặp lại các cặp khóa / giá trị:

const trái cây = [“Chuối”, “Cam”, “Táo”, “Xoài”];
const f = fruit.entries ();

for (let x of f) {
document.getElementById (“demo”). innerHTML + = x;
}

Hãy tự mình thử »

Phương thức entry () trả về đối tượng Trình lặp mảng với các cặp khóa / giá trị:

[0, “Banana”]
[1, “Orange”]
[2, “Apple”]
[3, “Mango”]

Phương thức entry () không thay đổi mảng ban đầu.

Hỗ trợ trình duyệt

entry () là một tính năng của ES6 (JavaScript 2015).

Nó được hỗ trợ trong tất cả các trình duyệt hiện đại:

Trình duyệt Chrome
Bờ rìa
Firefox
Cuộc đi săn
Opera

Đúng
Đúng
Đúng
Đúng
Đúng

entry () không được hỗ trợ trong Internet Explorer.

Mảng JavaScript bao gồm ()

ECMAScript 2016 đã giới thiệu Array.includes () cho các mảng.
Điều này cho phép chúng tôi kiểm tra xem một phần tử có trong một mảng hay không (bao gồm NaN, không giống như indexOf).

Ví dụ

const trái cây = [“Chuối”, “Cam”, “Táo”, “Xoài”];

Fruit.includes (“Xoài”); // là đúng

Hãy tự mình thử »

Cú pháp

.includes (tìm kiếm-mục)

Array.includes () cho phép kiểm tra các giá trị NaN. Không giống như Array.indexOf ().

Array.includes () không được hỗ trợ trong Internet Explorer và Edge 12/13.

Các phiên bản trình duyệt đầu tiên được hỗ trợ đầy đủ là:

Hỗ trợ trình duyệt

include () là một tính năng của ECMAScript 2016.

Nó được hỗ trợ trong tất cả các trình duyệt hiện đại:

Trình duyệt Chrome
Bờ rìa
Firefox
Cuộc đi săn
Opera

Đúng
Đúng
Đúng
Đúng
Đúng

include () không được hỗ trợ trong Internet Explorer.

Tham chiếu mảng hoàn chỉnh

Để tham khảo đầy đủ về Mảng, hãy truy cập:

Toàn bộ tham chiếu mảng JavaScript .

Tham chiếu chứa các mô tả và ví dụ về tất cả Mảng
thuộc tính và phương thức.


Xem thêm những thông tin liên quan đến chủ đề javascript cho mảng lặp lại

Learn JavaScript – Full Course for Beginners

  • Tác giả: freeCodeCamp.org
  • Ngày đăng: 2018-12-10
  • Đánh giá: 4 ⭐ ( 7419 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: This complete 134-part JavaScript tutorial for beginners will teach you everything you need to know to get started with the JavaScript programming language.

    ⭐️Curriculum⭐️
    This is a stand-alone video but it follows the JavaScript curriculum at freecodecamp.org. Access the curriculum here:
    🔗 Basic JavaScript: https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript
    🔗 ES6 JavaScript: https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6

    ⭐️Code⭐️
    This course was created using scrimba.com. Access the course there along with the code:
    🔗 Basic JavaScript: https://scrimba.com/playlist/pny4ghw
    🔗 ES6 JavaScript: https://scrimba.com/playlist/p7v3gCd

    🐦🐦 Follow course creator Beau Carnes on Twitter: https://www.twitter.com/BeauCarnes

    ⭐️Course Contents⭐️
    0:00:00 Introduction
    0:01:24 Running JavaScript
    0:04:23 Comment Your Code
    0:05:56 Declare Variables
    0:06:15 Storing Values with the Assignment Operator
    0:11:31 Initializing Variables with the Assignment Operator
    0:11:58 Uninitialized Variables
    0:12:40 Case Sensitivity in Variables
    0:14:05 Basic Math
    0:15:30 Increment and Decrement
    0:16:22 Decimal Numbers
    0:16:48 Multiply Two Decimals
    0:17:18 Divide Decimals
    0:17:33 Finding a Remainder
    0:18:22 Augmented Math Operations
    0:21:19 Declare String Variables
    0:22:01 Escaping Literal Quotes
    0:23:44 Quoting Strings with Single Quotes
    0:25:18 Escape Sequences
    0:26:46 Plus Operator
    0:27:49 Plus Equals Operator
    0:29:01 Constructing Strings with Variables
    0:30:14 Appending Variables to Strings
    0:31:11 Length of a String
    0:32:01 Bracket Notation
    0:33:27 Understand String Immutability
    0:34:23 Find the Nth Character
    0:36:28 Word Blanks
    0:40:44 Arrays
    0:41:43 Nest Arrays
    0:42:33 Access Array Data
    0:43:34 Modify Array Data
    0:44:48 Access Multi-Dimensional Arrays
    0:46:30 push()
    0:47:29 pop()
    0:48:33 shift()
    0:49:23 unshift()
    0:50:36 Shopping List
    0:51:41 Write Reusable with Functions
    0:53:41 Arguments
    0:55:43 Global Scope
    0:59:31 Local Scope
    1:00:46 Global vs Local Scope in Functions
    1:02:40 Return a Value from a Function
    1:03:55 Undefined Value returned
    1:04:52 Assignment with a Returned Value
    1:05:52 Stand in Line
    1:08:41 Boolean Values
    1:09:24 If Statements
    1:11:51 Equality Operators
    1:19:17 And / Or Operators
    1:21:37 Else Statements
    1:22:27 Else If Statements
    1:23:30 Logical Order in If Else Statements
    1:24:45 Chaining If Else Statements
    1:27:45 Golf Code
    1:32:15 Switch Statements
    1:41:11 Returning Boolean Values from Functions
    1:42:20 Return Early Pattern for Functions
    1:43:38 Counting Cards
    1:49:11 Build Objects
    1:50:46 Dot Notation
    1:51:33 Bracket Notation
    1:52:47 Variables
    1:53:34 Updating Object Properties
    1:54:30 Add New Properties to Object
    1:55:19 Delete Properties from Object
    1:55:54 Objects for Lookups
    1:57:43 Testing Objects for Properties
    1:59:15 Manipulating Complex Objects
    2:01:00 Nested Objects
    2:01:53 Nested Arrays
    2:03:06 Record Collection
    2:10:15 While Loops
    2:11:35 For Loops
    2:13:56 Odd Numbers With a For Loop
    2:15:28 Count Backwards With a For Loop
    2:17:08 Iterate Through an Array with a For Loop
    2:19:43 Nesting For Loops
    2:22:45 Do…While Loops
    2:24:12 Profile Lookup
    2:28:18 Random Fractions and Whole Numbers
    2:31:46 parseInt Function
    2:33:29 Ternary Operator
    2:34:57 Multiple Ternary Operators
    2:36:57 var vs let
    2:41:32 const Keyword
    2:43:40 Mutate an Array Declared with const
    2:44:52 Prevent Object Mutation
    2:47:17 Arrow Functions
    2:53:04 Default Parameters
    2:54:00 Rest Operator
    2:55:31 Spread Operator
    2:57:18 Destructuring Assignment
    3:06:39 Template Literals
    3:10:43 Simple Fields
    3:12:24 Declarative Functions
    3:12:56 class Syntax
    3:15:11 getters and setters
    3:20:25 import and export

    🎥 Want something shorter? Here’s a 63-second JavaScript course: https://www.youtube.com/watch?v=OXiyLaNo3NE

[Tự học Javascript] Lặp lại(Iterables) trong Javascript

  • Tác giả: cafedev.vn
  • Đánh giá: 5 ⭐ ( 1840 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Đối tượng lặp(Iterable) là một sự khái quát của mảng. Đó là một khái niệm cho phép chúng ta làm cho bất kỳ đối tượng nào có thể sử dụng được trong một vòng lặp for..of.

Hiểu Rõ Về Các Loại Vòng Lặp Trong Javascript Và Cấu Trúc Từng Loại Vòng Lặp

  • Tác giả: funix.edu.vn
  • Đánh giá: 4 ⭐ ( 2745 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Vòng lặp là một khái niệm rất quen thuộc trong lập trình. Với vòng lặp trong Javascript, chúng thường được dùng để xử lý đối tượng hoặc mảng.

6 cách loại bỏ phần tử lặp trong mảng

  • Tác giả: completejavascript.com
  • Đánh giá: 5 ⭐ ( 3576 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong con đường lập trình, có lẽ bạn sẽ phải ít nhất một lần đối mặt với bài toán Loại bỏ phần tử lặp trong mảng. Đây là bài toán cơ bản và khá hay. Sau đây mình sẽ giới thiệu thuật toán chung và triển khai 6 cách loại bỏ phần tử lặp trong mảng.

Lặp qua một mảng trong JavaScript

  • Tác giả: qastack.vn
  • Đánh giá: 5 ⭐ ( 6388 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: [Tìm thấy giải pháp!] Bạn có một vài lựa chọn: 1. forVòng lặp tuần tự : var myStringArray = [“Hello”,”World”];…

5 Loại Vòng lặp trong JavaScript

  • Tác giả: hanoiict.edu.vn
  • Đánh giá: 4 ⭐ ( 4641 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài viết này các bạn sẽ học được viết chương trình để lặp lại một hành động cụ thể bằng Vòng lặp trong JavaScript. 5 Loại vòng lặp và JS cung cấp

Trình lặp lại JavaScript và Trình lặp lại

  • Tác giả: vi.wiki-base.com
  • Đánh giá: 5 ⭐ ( 9852 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Tìm kiếm: getElement *, querySelector * - javascript tìm phần tử dom