Spread Operator là gì? . Nhưng thực tế, có rất nhiều devj vẫn chưa khai thác hết khả năng hiểu quả của chức năng này. Khi nào sử dụng Spread Operator thì trong bài này chúng ta lướt qua 5 cách sử dụng biến phổ biến nhất
Spread Operator là gì?
"Toán tử trải rộng cho phép chuyển đổi một chuỗi thành nhiều đối số [trong trường hợp gọi với hàm] hoặc thành nhiều phần tử [cho mảng]. Add into other it also allow to destruction task. Toán tử này có cú pháp là 3 dấu chấm. , khá là dị hợm và khó hiểu nhỉ, nhưng nói thế chứ chứ cái splat bên Ruby cũng hơi dễ hiểu hơn cho người mới nhập môn. " - kipalog. com
Nếu thật sự bạn muốn hiểu kỹ hơn, có lẽ bạn nên dành thời gian cho bài viết này. "Ba chấm [. ]". Bây giờ chúng ta có thể vào nội dung chính của bài viết này, các bạn có thể đọc từ từ để hiểu rõ hơn
Sao chép một mảng
Có thể đây là một trong những cách sử dụng biến phổ biến nhất của Trình điều khiển lây lan javascript
let arr = [1,2,3,4] let copy = [...arr] // copy is [ 1, 2, 3, 4 ]
Lưu ý rằng sao chép không phải là một phương pháp "sao chép sâu"
Lời khuyên. Sao chép nông và sao chép sâu trong javascript
Điều quan trọng bạn đừng quên. , nếu bạn quên điều đó thì nó sẽ trở thành
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]
Nối các mảng
dựa trên ví dụ trước, bạn có thể tạo ra một mảng mới thông qua nhiều mảng cho trước
let arr1 = [1,2,3,4] let arr2 = [5,6,7,8] let concat = [...arr1, ...arr2] // concat is [ 1, 2, 3, 4, 5, 6, 7, 8 ]
Sao chép một đối tượng
Cũng giống như ví dụ về mảng ở phần 1 thì đối tượng cũng tương tự
let obj = {a: 1, b: 2, c: 3}
let copy = {...obj}
// copy is {a: 1, b: 2, c: 3}Và nếu lỗi sai sẽ trả giá nếu bạn quên đi "ba chấm". "
let obj = {a: 1, b: 2, c: 3}
let copy = {obj}
// copy is { {a: 1, b: 2, c: 3} }Hợp nhất đối tượng
Giờ đây khi Hợp nhất đối tượng chúng ta sẽ không cần đến cách sử dụng concat[] cũ. Bạn có thể thực hiện nhanh hơn với lan truyền trong javascript
let obj1 = {a: 1, b: 2, c: 3}
let obj2 = {d: 4, e: 5, f: 6}
let merge = {...obj1, ...obj2}
// merge is {a: 1, b: 2, c: 3, d: 4, e: 5, f: 6}Phần thưởng - Lỗi
Mặc dù thực tế rằng trải nghiệm toán tử đều hoạt động trên cả mảng và đối tượng, bạn không thể kết hợp và khớp các loại dữ liệu này với nhau. Như ví dụ dưới đây
Lập trình Front end hiện đại với ReactJS. Học làm chủ HTML, CSS, JS và thư viện JavaScript phổ biến nhất hiện nay. Sẵn sàng đi thực tập / đi làm ngay sau khóa học
Lập trình Java Web Nâng cao
Chương trình đào tạo chuyên sâu, nâng cao về Lập trình Java Web, do NIIT - ICT Hà Nội thiết kế Nhằm đáp ứng nhu cầu tuyển dụng của doanh nghiệp
Lập trình PHP với Laravel Framework
Khóa học Lập trình PHP với Laravel Framework được NIIT - ICT HÀ NỘI xây dựng Mục đích hoàn thiện kỹ năng lập trình web mà các bạn đã biết Lập trình Web PHP thuần
Key hoc Java Full stack [IJFD]
Học lập trình Java Fullstack với khóa học được xây dựng theo lộ trình bài bản, từ JAVA CƠ BẢN đến JAVA WEB và nâng cao về JAVA FRAMEWORK như. Khởi động mùa xuân, ngủ đông
Có một số thuộc tính các thuộc tính toán hợp và phương thức mảng [gọi là phương thức mảng] mà chúng ta có thể sử dụng bảng để thêm, xóa, lặp hoặc thao tác với tác vụ dữ liệu theo yêu cầu của mình
Và biết cách sử dụng các Array method có thể nâng cao kỹ năng lập trình Javascript của bạn lên rất nhiều
15 Array Method của Javascript bạn cần biết
Trong bài viết này, chúng ta sẽ cùng tìm hiểu về 15 Phương thức mảng của Javascript có thể giúp bạn thao tác với dữ liệu của mình đúng cách vào năm 2022
> Lưu ý. Trong bài viết này, chúng tôi sẽ đơn giản hóa chức năng được truyền dưới dạng tham số. Và các bạn nên HỌC JAVASCRIPT CƠ BẢN trước để có thể hiểu rõ các Array Method này
Ví dụ
// Thay vì viết như thế này
myAwesomeArray.some[test => {
if [test === "d"] {
return test
}
}]
// Chúng ta sẽ biết ngắn gọn thế này
myAwesomeArray.some[test => test === "d"]Started any
1. Phương thức some[]
Phương thức some[] này kiểm tra mảng với một hàm được truyền dưới dạng tham số
Nó sẽ trả lại
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueconst myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueconst myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueconst myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueTham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_some. asp
2. Phương thức reduce[]
Phương thức reduce[] này nhận một hàm có tích lũy là đối số đầu tiên và giá trị làm cho đối số thứ hai
Nó áp dụng chức năng cho tích lũy và mỗi giá trị trong mảng
- Có nghĩa là, nó lặp lại các giá trị trong mảng đã cho và áp dụng hàm, sau đó lưu vào đối số đầu tiên [bộ tích lũy]
- Nếu không có giá trị ban đầu, thì lần đầu tiên nó sẽ lấy phần tử thứ nhất và phần tử thứ hai của mảng
Cuối cùng, nó trả về một giá trị duy nhất
Ví dụ
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]1
Tham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_reduce. asp
3. Phương thức every[]
Phương thức every[] này kiểm tra mảng với một hàm được truyền dưới dạng tham số
Nó sẽ trả về
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueconst myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : truelet arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]4
Tham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_every. asp
4. Phương thức map[]
Phương thức map[] này nhận một hàm làm tham số. And return a new array has contain a image of each section of an array
- Phương thức map[] Không thể thay đổi mảng ban đầu
Và nó sẽ luôn trả lại cùng một số lượng phần tử
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]5
Tham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_map. asp
5. Phương thức phẳng[]
Phương thức flat[] này thường được sử dụng để tạo ra một mảng mới chứa các phần tử trong mảng [mà có chứa mảng con]
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]6
Tuy nhiên, nếu trong mảng con lại chứa một mảng con nữa thì nó sẽ thực hiện như sau
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]7
6. Phương thức filter[]
Phương thức filter[] this nhận một hàm làm tham số. Hàm này sẽ thực hiện lọc một lần như các phần tử của mảng, nếu
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueThis new new end of the end of the result is return
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]9
Tham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_filter. asp
7. Phương thức forEach[]
Phương thức forEach[] này áp dụng một hàm cho từng phần tử của mảng
let arr1 = [1,2,3,4] let arr2 = [5,6,7,8] let concat = [...arr1, ...arr2] // concat is [ 1, 2, 3, 4, 5, 6, 7, 8 ]0
Tham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_foreach. asp
8. Phương thức findIndex[]
Phương thức findIndex[] này nhận một hàm làm tham số và sẽ áp dụng nó cho mảng
Nó trả về chỉ mục của một phần tử được tìm thấy và hàm kiểm tra mãn tính được truyền dưới dạng đối số hoặc trả về
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]13 nếu không đáp ứng nó
let arr1 = [1,2,3,4] let arr2 = [5,6,7,8] let concat = [...arr1, ...arr2] // concat is [ 1, 2, 3, 4, 5, 6, 7, 8 ]2
Tham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_findindex. asp
9. Phương thức find[]
Phương thức find[] này nhận một hàm làm đối số và sẽ áp dụng nó cho mảng
Nó trả về giá trị của một phần tử được tìm thấy trong mảng và hàm kiểm tra. If not, it return
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]14
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueTham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_find. asp
10. Phương thức sort[]
Phương thức sort[] this got a function as a number. Nó sắp xếp các phần tử của một mảng, và trả về nó
> Lưu ý. Phương thức
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]15 thay đổi gốc
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : true> Lưu ý. Khi phương thức
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]15 so sánh hai giá trị, nó sẽ gửi các giá trị cho hàm so sánh và sắp xếp các giá trị theo giá trị trả về [Âm, 0, Dương]
Tham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_sort. asp
Phương thức concat[] này sẽ hợp nhất hai hoặc nhiều mảng / giá trị bằng cách ghép nó. Nó trả về một mảng mới
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueTham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_concat_array. asp
12. Phương thức fill[]
Phương thức fill[] này điền vào tất cả các phần tử của một mảng định sẵn có cùng giá trị, từ chỉ mục bắt đầu [default
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]17] đến endpoint index [default
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]18]
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueTham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_fill. asp
13. Phương thức bao gồm[]
Phương thức bao gồm [] này sẽ trả về
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueconst myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueconst myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueTham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_includes_array. asp
14. Phương thức đảo ngược[]
Reverse[] this method reverse a array
> Lưu ý. Phương thức
let arr = [1,2,3,4] let copy = [arr] // copy is [ [1, 2, 3, 4] ]41 này sẽ thay đổi mảng gốc
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : trueTham khảo thêm tại đây. https. //www. w3schools. com/jsref/jsref_reverse. asp
15. Phương thức flatMap[]
Phương thức flatMap[] áp dụng một hàm cho từng phần tử của mảng và sau đó làm cho kết quả phẳng thành một mảng. Nó là sự kết hợp của hai phương thức flat[] và map[]
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.some[test => test === "d"]
//-------> Kết quả : truechúc mừng. Bạn đã tiến một bước xa với 15 Phương thức rất cần thiết để thao tác với Mãng trong Javascript
Bạn đã sẵn sàng chinh phục Javascript trong năm 2022
Nếu bạn thích bài viết 15 Array Method của JavaScript này thì hãy chia sẻ để bạn bè, những người yêu thích Javascript cùng nhau HỌC LẬP TRÌNH tốt hơn nhé
---
HỌC VIỆN ĐẠO TẠO CNTT NIIT - ICT HÀ NỘI
Học lập trình chất lượng cao [Từ năm 2002]. Học thực tế + Tuyển dụng ngay
Đc. Tầng 3, 25T2, N05, Nguyễn Thị Thập, Cầu Giấy, Hà Nội
SĐT. 02435574074 - 0914939543
E-mail. xin chào@niithanoi. giáo dục. vn
trang chủ. https. //Facebook. com/NIIT. CNTT-TT/
#niit #niithanoi #niiticthanoi #hoclaptrinh #khoahoclaptrinh #hoclaptrinhjava #hoclaptrinhphp #python #java #php