Mảng từ phương thức trong JavaScript là gì?

Trong JavaScript, mảng là một cấu trúc dữ liệu chứa danh sách các phần tử lưu trữ nhiều giá trị trong một biến duy nhất. Sức mạnh của mảng JavaScript nằm ở các phương thức mảng. Các phương thức mảng là các hàm được tích hợp sẵn trong JavaScript mà chúng ta có thể áp dụng cho các mảng của mình — Mỗi phương thức có một hàm duy nhất thực hiện thay đổi hoặc tính toán cho mảng của chúng ta và giúp chúng ta không phải viết các hàm phổ biến từ đầu

Phương thức mảng JavaScript

1. bản đồ[ ]

Phương thức này tạo một mảng mới với kết quả gọi một hàm được cung cấp trên mọi phần tử trong mảng này

Cách thêm phần tử vào mảng trong JS

Sử dụng phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.push['🥜'];
8 để chèn phần tử vào mảng. Phương thức
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.push['🥜'];
8 thêm một phần tử vào cuối mảng. Hay là chúng ta thêm một ít đậu phộng vào món salad, như thế này

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.push['🥜'];

Bây giờ mảng salad là

["🍅", "🍄", "🥦", "🥒", "🌽", "🥕", "🥑", "🥜"]

Lưu ý rằng phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.push['🥜'];
8 thêm một phần tử vào cuối mảng. Nếu bạn muốn thêm một phần tử vào đầu mảng, bạn sẽ cần sử dụng phương thức
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
1

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];

Bây giờ mảng salad là

["🥜", "🍅", "🍄", "🥦", "🥒", "🌽", "🥕", "🥑"]

Cách xóa phần tử khỏi mảng trong JS

Cách dễ nhất để xóa một phần tử khỏi mảng là sử dụng phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
2. Mỗi khi bạn gọi phương thức
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
2, nó sẽ loại bỏ một phần tử ở cuối mảng. Sau đó, nó trả về phần tử đã loại bỏ và thay đổi mảng ban đầu

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.pop[]; // 🥑

console.log[salad]; // ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕']

Sử dụng phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
4 để xóa một phần tử khỏi đầu mảng. Giống như phương thức
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
2,
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
4 trả về phần tử đã loại bỏ và thay đổi mảng ban đầu

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
0

Cách sao chép và sao chép một mảng trong JS

Bạn có thể sao chép và sao chép một mảng sang một mảng mới bằng cách sử dụng phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
7. Lưu ý rằng phương thức
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.unshift['🥜'];
7 không thay đổi mảng ban đầu. Thay vào đó, nó tạo ra một bản sao nông mới của mảng ban đầu

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
1

Ngoài ra, bạn có thể sử dụng toán tử

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.push['🥜'];
3 để tạo một bản sao của mảng. Chúng ta sẽ tìm hiểu về điều đó ngay sau đây

Cách xác định xem Giá trị có phải là một mảng trong JS không

Bạn có thể xác định xem một giá trị có phải là một mảng hay không bằng cách sử dụng phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.pop[]; // 🥑

console.log[salad]; // ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕']
0. Phương thức trả về true nếu giá trị truyền vào là một mảng

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
2Phá hủy mảng trong JavaScript

Với ECMAScript 6 [ES6], chúng tôi có một số cú pháp mới để trích xuất nhiều thuộc tính từ một mảng và gán chúng cho các biến trong một lần. Nó rất hữu ích để giúp bạn giữ cho mã của mình sạch sẽ và ngắn gọn. Cú pháp mới này được gọi là cú pháp phá hủy

Dưới đây là một ví dụ về trích xuất các giá trị từ một mảng bằng cách sử dụng cú pháp phá hủy

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
3

Bây giờ bạn có thể sử dụng các biến trong mã của mình

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
4

Để làm điều tương tự mà không phá hủy, nó sẽ trông như thế này

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
5

Vì vậy, cú pháp phá hủy giúp bạn không phải viết nhiều mã. Điều này mang lại cho bạn một sự gia tăng lớn về năng suất

Cách gán giá trị mặc định cho một biến

Bạn có thể gán một giá trị mặc định bằng cách hủy khi không có giá trị hoặc

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.pop[]; // 🥑

console.log[salad]; // ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕']
1 cho phần tử mảng

Trong ví dụ dưới đây, chúng tôi gán giá trị mặc định cho biến nấm

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
6

Cách bỏ qua một giá trị trong một mảng

Với tính năng hủy, bạn có thể bỏ qua một phần tử mảng để ánh xạ tới một biến. Ví dụ, bạn có thể không quan tâm đến tất cả các phần tử trong một mảng. Trong trường hợp đó, bỏ qua một giá trị có ích

Trong ví dụ bên dưới, chúng ta bỏ qua phần tử nấm. Lưu ý khoảng trắng trong khai báo biến ở phía bên trái của biểu thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
7

Phá hủy mảng lồng nhau trong JS

Trong JavaScript, các mảng có thể được lồng vào nhau. Điều này có nghĩa là một mảng có thể có một mảng khác làm phần tử. Việc lồng mảng có thể đi đến bất kỳ độ sâu nào

Ví dụ: hãy tạo một mảng lồng nhau cho các loại trái cây. Nó có một vài loại trái cây và một loạt các loại rau trong đó

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
8

Bạn sẽ truy cập '🥕' từ mảng trên bằng cách nào?

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
9

Ngoài ra, bạn có thể sử dụng cú pháp ngắn tay này

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
0

Bạn cũng có thể truy cập nó bằng cú pháp phá hủy, như thế này

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
1Cách sử dụng cú pháp trải rộng và tham số nghỉ trong JavaScript

Kể từ ES6, chúng ta có thể sử dụng

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.push['🥜'];
4 [vâng, ba dấu chấm liên tiếp] làm cú pháp trải rộng và tham số còn lại trong cấu trúc mảng

  • Đối với tham số còn lại,
    const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    salad.push['🥜'];
    4 xuất hiện ở phía bên trái của cú pháp phá hủy
  • Đối với cú pháp trải rộng,
    const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    salad.push['🥜'];
    4 xuất hiện ở bên phải của cú pháp phá hủy

Cách sử dụng Tham số còn lại trong JS

Với

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.pop[]; // 🥑

console.log[salad]; // ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕']
5, chúng ta có thể vạch ra các phần tử bên trái của một mảng trong một mảng mới. Tham số còn lại phải là biến cuối cùng trong cú pháp phá hủy

Trong ví dụ dưới đây, chúng tôi đã ánh xạ hai phần tử mảng đầu tiên tới các biến cà chua và nấm. Các phần tử còn lại được ánh xạ tới biến

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.pop[]; // 🥑

console.log[salad]; // ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕']
6 bằng cách sử dụng biến
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.push['🥜'];
4. Biến
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
salad.pop[]; // 🥑

console.log[salad]; // ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕']
6 là một mảng mới chứa các phần tử còn sót lại

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
2

Cách sử dụng Toán tử trải rộng trong JS

Với toán tử trải rộng, chúng ta có thể tạo một bản sao/bản sao của một mảng hiện có như thế này

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
3Phá hủy các trường hợp sử dụng trong JavaScript

Hãy xem xét một vài trường hợp sử dụng thú vị của việc phá hủy mảng, toán tử trải rộng và tham số còn lại

Cách hoán đổi giá trị với hủy cấu trúc

Chúng ta có thể hoán đổi giá trị của hai biến một cách dễ dàng bằng cú pháp hủy mảng

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
4

Cách hợp nhất các mảng

Chúng ta có thể hợp nhất hai mảng và tạo một mảng mới với tất cả các phần tử từ cả hai mảng. Hãy lấy hai mảng — một mảng có một vài khuôn mặt cười và mảng khác có một vài loại rau

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
5

Bây giờ, chúng ta sẽ hợp nhất chúng để tạo một mảng mới

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
6Phương thức mảng JavaScript

Cho đến nay, chúng ta đã thấy một vài thuộc tính và phương thức của mảng. Hãy tóm tắt nhanh những cái chúng ta đã xem xét

  • const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    salad.push['🥜'];
    8 – Chèn một phần tử vào cuối mảng
  • const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    salad.unshift['🥜'];
    1 – Chèn một phần tử vào đầu mảng
  • const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    salad.unshift['🥜'];
    2 – Xóa phần tử ở cuối mảng
  • const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    salad.unshift['🥜'];
    4 – Xóa phần tử ở đầu mảng
  • const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    salad.unshift['🥜'];
    7 – Tạo một bản sao nông của một mảng
  • const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    04 – Xác định xem một giá trị có phải là một mảng không
  • const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
    05 – Xác định kích thước của một mảng

Bây giờ chúng ta sẽ tìm hiểu về các phương thức mảng JS quan trọng khác với các ví dụ

Cách tạo, xóa, cập nhật và truy cập mảng trong JavaScript

Trong phần này, chúng ta sẽ tìm hiểu về các phương thức bạn có thể sử dụng để tạo một mảng mới, loại bỏ các phần tử để làm cho mảng trống, truy cập các phần tử, v.v.

Phương thức mảng
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
06

Phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
06 hợp nhất một hoặc nhiều mảng và trả về một mảng đã hợp nhất. Đó là một phương pháp bất biến. Điều này có nghĩa là nó không thay đổi [biến đổi] các mảng hiện có

Hãy nối hai mảng

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
7

Sử dụng phương pháp

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
06, chúng ta có thể hợp nhất nhiều hơn hai mảng. Chúng ta có thể hợp nhất bất kỳ số lượng mảng nào với cú pháp này

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
8

Đây là một ví dụ

const salad = new Array['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
9

Phương thức mảng
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
09

Phương thức

const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];
09 nối tất cả các phần tử của mảng bằng cách sử dụng dấu tách và trả về một chuỗi. Dấu phân cách mặc định được sử dụng để nối là
const salad = ['🍅', '🍄', '🥦', '🥒', '🌽', '🥕', '🥑'];

for[let i=0; i

Chủ Đề