Giới thiệu về cú pháp Spread trong JavaScript

bởi Ashay Mandwarya ?️??

Nó là gì và tại sao chúng ta cần nó?

kpPvb3XGdd7Dt04-ad26LV1wNB-YWlD5Uljn — Ảnh của Anton Darius | @theSollers trên Bapt

Cú pháp lây lan đã được giới thiệu trong đặc tả ES6 của JavaScript. Kể từ đó, nó đã được chứng minh là một đoạn mã có giá trị làm cho mã rõ ràng và dễ hiểu.

MDN định nghĩa … như:

cú pháp lây lan cho phép một lần lặp, chẳng hạn như một biểu thức mảng hoặc chuỗi được mở rộng ở những nơi không có hoặc nhiều đối số (đối với các lệnh gọi hàm) hoặc các phần tử (đối với các ký tự mảng) hoặc một biểu thức đối tượng được mở rộng ở những nơi không có hoặc nhiều key- các cặp giá trị (đối với nghĩa đen của đối tượng) được mong đợi.

Tất cả chúng ta hãy đồng ý rằng định nghĩa trên là một số ít và không ai trong chúng ta hiểu được một từ mà nó đang cố nói. Vì vậy, hãy bắt đầu với những điều cơ bản nhất về cú pháp lây lan.

Toán tử trải rộng chỉ là 3 dấu chấm ...
Nó có thể được sử dụng trên các lần lặp như một mảng hoặc một chuỗi.
Nó mở rộng một iterable cho các phần tử riêng lẻ của nó
Nó có thể cung cấp một lệnh gọi hàm với một mảng (hoặc bất kỳ khả năng lặp nào khác) trong đó có 0 hoặc nhiều đối số được mong đợi.

Đọc thêm Hàm bậc cao hơn trong JavaScript – Đạt đến tầm cao mới trong mã JS của bạn

Ví dụ

Đoạn mã dưới đây chứa một hàm có tên là tổng có 3 đối số x, y và z. Chúng tôi có một mảng có 3 phần tử và chúng tôi muốn chuyển các phần tử trong mảng làm đối số cho hàm.

Trước khi toán tử trải phổ được giới thiệu, điều này được thực hiện thông qua hàm áp dụng.

Sau khi giới thiệu toán tử trải rộng, nó có thể được thực hiện rất đơn giản:

Như có thể thấy từ đoạn mã trên với toán tử trải rộng, chúng ta không phải sử dụng hàm áp dụng. Điều này giúp chúng ta không phải viết thêm mã.

Ví dụ trên đưa ra một ý tưởng rất sơ bộ và ngắn gọn về toán tử trải rộng. Trước tiên, hãy tìm hiểu thêm chi tiết về điều tương tự, sau đó chúng ta sẽ xem thêm các ví dụ.

cú pháp

Toán tử trải phổ có thể được sử dụng theo nhiều cách và tình huống chẳng hạn như

Khi được sử dụng trong kịch bản trên, … được gọi là tham số còn lại. Chúng ta sẽ xem các ví dụ liên quan đến điều này trong phần ví dụ.

Tạo/Mở rộng một mảng/có thể lặp lại:

ví dụ

… được sử dụng làm đối số cho hàm biến thiên. Hàm biến thiên là một hàm có thể có một số tham số thay đổi.

Ở đây, khi chúng tôi trả về các đối số, chúng tôi thấy rằng chúng tôi lấy lại mảng mà chúng tôi đã chuyển dưới dạng các giá trị riêng biệt trong lệnh gọi. Điều này cho thấy rằng toán tử còn lại thực sự hoạt động hoàn toàn ngược lại với cú pháp trải rộng. Một mở rộng và một cô đọng giá trị.

Đọc thêm Tại sao JavaScript là ngôn ngữ lập trình của tương lai

Một điều nữa cần chỉ ra là không có số lượng tham số cụ thể nào được đề cập trong định nghĩa hàm. Điều này có nghĩa là sử dụng… hàm có thể có n số đối số. Chúng ta không cần chỉ định trước các tham số.

Đây đặc biệt là một cách rất linh hoạt để nhận các đối số cho một hàm mà số lượng đối số cụ thể không được xác định như hàm Math.max và Math.min. Chúng là các hàm biến thiên vì số lượng đầu vào có thể là vô hạn đối với chúng.

Quay lại ví dụ, để lấy tổng của tất cả các đối số

Chúng ta phải lặp lại mảng và thêm tất cả các phần tử riêng lẻ để tạo ra kết quả.

Đẩy các phần tử trong một mảng

Hàm push() được sử dụng để đẩy các phần tử vào một mảng. Hạn chế với push là chúng ta phải đẩy từng phần tử một (push(1,2,3)). Nếu có một mảng có các phần tử sẽ được chèn vào mảng bằng cách sử dụng lệnh đẩy, chúng ta sẽ nhận được một mảng nhiều chiều mà chúng ta không yêu cầu.

Một lần nữa áp dụng để giải cứu

Như chúng ta có thể thấy rằng việc sử dụng apply trông không được thanh lịch cho lắm và chúng ta cần một cú pháp nhỏ và đơn giản để thực hiện điều đó. Hãy để chúng tôi sử dụng lây lan…

Đọc thêm 9 secrets to opening a crowded restaurant for beginners