Làm cách nào để nhân lên trong mảng JavaScript?
Bài viết này dành cho những ai đã từng viết vòng lặp var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {7 nhưng chưa hiểu lắm về cách thức hoạt động của var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 hoặc var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {9. Bạn cũng có thể viết một chức năng cơ bản. Khi kết thúc phần này, bạn sẽ hiểu đầy đủ về cả hai chức năng, bởi vì bạn sẽ thấy chúng được viết như thế nào Show
Điều này đã được lấy từ Step Up Your JS. Hướng dẫn toàn diện về JavaScript trung cấp, khóa học trực tuyến của tôi. Vui lòng xem nó ở đó để biết các phiên bản tương tác của các mẫu mã Mảng. bản đồvar originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 có nghĩa là chuyển đổi một mảng thành một mảng khác bằng cách thực hiện một số thao tác trên từng giá trị của nó. Mảng ban đầu không bị ảnh hưởng và hàm trả về một mảng mới đã được chuyển đổi. Ví dụ: giả sử chúng tôi có một dãy số và chúng tôi muốn nhân mỗi số với ba. Chúng tôi cũng không muốn thay đổi mảng ban đầu. Để làm điều này mà không cần var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8, chúng ta có thể sử dụng vòng lặp for tiêu chuẩn vòng lặp forvar originalArr = [1, 2, 3, 4, 5]; Đủ đơn giản. Hãy trừu tượng hóa vòng lặp này thành hàm riêng của nó để chúng ta có thể biến bất kỳ mảng nào chúng ta thích thành một mảng mới với mỗi phần tử được nhân với 3. Nói cách khác, chúng ta đang cố gắng viết một hàm sẽ nhận vào một mảng bất kỳ ( function multiplyByThree(arr) {2) và tạo ra một mảng hoàn toàn mới với các số của nó nhân với ba ( function multiplyByThree(arr) {3). Tất cả những gì chúng ta phải làm là lấy mã chúng ta đã viết ở trên và biến nó thành một hàm để chúng ta có thể sử dụng lại vòng lặp đó nhiều lần. Điều này có vẻ khó khăn, nhưng hãy cố gắng vượt qua nó Nhân ba________số 8Đẹp. Bây giờ chúng ta có thể chuyển bất kỳ mảng nào vào function multiplyByThree(arr) {4 và lấy một mảng mới với các giá trị của nó được nhân lên. Bây giờ, chúng tôi sẽ thêm một số mã có vẻ vô dụng, nhưng hãy đồng ý với tôi ở đây. Hãy lấy một dòng trong hàm đó — function multiplyByThree(arr) {5 — và biến nó thành hàm của chính nó. Kết quả sẽ là mã tương đương với mã trong khối ở trên, nhưng chúng tôi sẽ cần nó theo cách này ngay sau đó var originalArr = [1, 2, 3, 4, 5];function timesThree(item) { Khối này thực hiện chính xác như khối trước nó. Nó chỉ lấy một mảnh ra và biến nó thành chức năng của chính nó Nếu chúng ta muốn nhân tất cả các mục trong một mảng với 5 thì sao? . Điều đó sẽ tẻ nhạt và lặp đi lặp lại Nhân với bất cứ thứ gìHãy thay đổi mã function multiplyByThree(arr) {4 để có thể nhân với bất kỳ thứ gì. Hãy đổi tên nó thành function multiplyByThree(arr) {7. Đây là phần khó nhất và có thể mất chút thời gian để hiểu, nhưng hãy cố gắng vượt qua nó. Sau đó, thật dễ dàng Chúng tôi đang biến cái này function multiplyByThree(arr) { vào cái này var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {5 Chúng tôi đã đổi tên hàm và cung cấp cho nó một đối số bổ sung để đưa vào. Bản thân đối số đó sẽ là một hàm (thường được gọi là hàm gọi lại). Bây giờ, chúng tôi đang tự chuyển một chức năng cho function multiplyByThree(arr) {7, nói cho function multiplyByThree(arr) {7 biết chúng tôi muốn từng mục được chuyển đổi như thế nào. Sử dụng chức năng hoàn toàn mới của chúng tôi, hãy nhân 3 lần nữa var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 Chúng tôi đang cung cấp cho hàm function multiplyByThree(arr) {7 của mình các hướng dẫn cần thiết để chuyển đổi từng giá trị trong mảng bằng cách chuyển vào hàm var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {51. Thay vào đó, nếu chúng ta muốn nhân với 5 thì sao? var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {1 Nó đơn giản như hoán đổi hàm var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {51 cho hàm var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {53. Lặp lại kỹ thuật này, chúng ta có thể nhân với bất kỳ số nào chúng ta muốn — chúng ta chỉ cần viết một hàm mới, rất đơn giản. Chúng tôi đã viết một vòng lặp for duy nhất và có thể nhân một mảng với bất kỳ thứ gì chúng tôi muốn Bản đồHãy làm cho function multiplyByThree(arr) {7 mạnh mẽ hơn nữa. Thay vì nhân với thứ gì đó, hãy cho phép hàm chuyển đổi mảng của chúng ta theo bất kỳ cách nào chúng ta muốn. Hãy đổi tên function multiplyByThree(arr) {7 thành, ồ, tôi không biết… còn var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {56 thì sao? var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {7 vào cái này var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 Nhìn kỹ vào phần in đậm và xem những gì chúng tôi đã thay đổi giữa các hàm function multiplyByThree(arr) {7 và var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {56 ngay phía trên. Điều duy nhất chúng tôi thay đổi là tên của hàm và tên của tham số thứ hai mà nó nhận vào. Đó là nó. Hóa ra, function multiplyByThree(arr) {7 đã là thứ chúng tôi muốn, được đặt tên khác Chúng ta có thể truyền vào bất kỳ chức năng nào mà chúng ta muốn var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {56. Chúng ta có thể biến đổi một mảng theo bất kỳ cách nào chúng ta muốn. Giả sử chúng tôi có một chuỗi các chuỗi và chúng tôi muốn chuyển tất cả chúng thành chữ hoa var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {3 Chúng tôi vừa viết xong var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8. Khá gọn gàng, phải không? Sử dụng mảng. bản đồHàm var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {56 so với hàm gốc thực tế của var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 như thế nào? . Thứ nhất, chúng ta không cần truyền vào một mảng làm đối số đầu tiên. Thay vào đó, mảng được sử dụng là mảng ở bên trái dấu chấm. Như một ví dụ, hai điều sau đây là tương đương. Sử dụng chức năng của chúng tôi var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {0 Sử dụng var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 gốc, chúng tôi không chuyển vào mảng. Chúng tôi gọi phương thức var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 trên mảng của mình và chỉ truyền vào hàm var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {1 Nó khá là nhiều. Bạn đã tự viết var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 và giờ đã biết nó hoạt động như thế nào Thêm đối số var originalArr = [1, 2, 3, 4, 5];function timesThree(item) { return item * 3;}function multiplyByThree(arr) { var newArr = []; for(var i = 0; i < arr.length; i++) { newArr[i] = timesThree(arr[i]); } return newArr;}var arrTransformed = multiplyByThree(originalArr);console.log(arrTransformed); // -> [3, 6, 9, 12, 15]8Có một điểm khác biệt chính mà chúng tôi đã bỏ qua. var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 sẽ cung cấp cho hàm đã cho của bạn thêm hai đối số. chỉ mục và chính mảng ban đầu var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {2 Điều này cho phép bạn sử dụng chỉ mục và mảng ban đầu bên trong hàm chuyển đổi nếu bạn chọn. Ví dụ: giả sử chúng tôi muốn biến một mảng các mặt hàng thành một danh sách mua sắm được đánh số. Chúng tôi muốn sử dụng chỉ mục var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {3 Chức năng var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {56 hoàn chỉnh của chúng tôi nên kết hợp chức năng này var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {4 Chức năng ngắn này là bản chất của var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8. Chức năng thực tế sẽ có một số kiểm tra lỗi và tối ưu hóa, nhưng đây là chức năng cốt lõi của nó Cuối cùng, bạn cũng có thể viết một hàm trực tiếp trong lệnh gọi var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {56. Làm lại ví dụ multiByThree của chúng tôi var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {5 Xong. Phù Mảng. lọcÝ tưởng ở đây tương tự như Array. bản đồ, ngoại trừ thay vì chuyển đổi các giá trị riêng lẻ, chúng tôi muốn lọc các giá trị hiện có. Không có bất kỳ chức năng nào (ngoài var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {12), giả sử chúng tôi muốn lọc ra các giá trị trong một mảng nhỏ hơn 5 vòng lặp forvar originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {6 Hãy trừu tượng hóa điều này thành một hàm để chúng ta có thể loại bỏ các giá trị dưới 5 trong bất kỳ mảng nào var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {7 Hãy tạo nó để chúng ta có thể lọc ra tất cả các giá trị bên dưới bất kỳ giá trị tùy ý nào var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {8 → Tóm tắt chức năng lọc var originalArr = [1, 2, 3, 4, 5];function multiplyByThree(arr) {9 → Lọc ra bất cứ thứ gì dưới 5, sử dụng filterBelow var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {0 → Lọc ra bất cứ thứ gì dưới 7, sử dụng filterBelow var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {1 lọcVì vậy, chúng tôi có một chức năng var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {13 sẽ lọc ra bất kỳ thứ gì bên dưới một giá trị nhất định, dựa trên chức năng var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {14 mà chúng tôi cung cấp cho nó (điều này giống hệt với chức năng var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {13 ở trên) var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {2 Hãy đổi tên nó var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {3 Và chúng tôi đã viết var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {16. Về cơ bản, nó giống như var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {9, ngoại trừ cách sử dụng var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {4 Một lần nữa, var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {9 chuyển chỉ mục và mảng ban đầu vào hàm của bạn var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {5 Vì vậy, chúng ta nên làm cho chức năng của chúng tôi làm như vậy var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {6 Ồ. Đó là nó. Bạn đã học cách sử dụng và viết var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {8 và var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {9. Đi viết một số mã ghi chúNếu bạn quan tâm đến việc bao gồm cả var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {71 hoặc var originalArr = [1, 2, 3, 4, 5];function timesThree(item) {72, hãy cho tôi biết trong phần nhận xét. forEach khá giống với map và filter, nhưng reduce phức tạp hơn một chút Làm thế nào để nhân lên trong js?Toán tử nhân ( * ) nhân các số.
Làm cách nào để sao chép mảng trong JavaScript?Để sao chép một mảng, chỉ cần trả về phần tử trong lệnh gọi bản đồ của bạn . số = [1, 2, 3]; . bản đồ ((x) => x); .
Mảng có thể được nhân lên không?Khi chúng ta nhân một mảng với một hằng số, mỗi phần tử sẽ được nhân với hằng số đó . |