Hiển thì giá trị các phần tử lẻ của mảng lên màn hình

findIndex[]

findIndex[] được sử dụng khi bạn muốn tìm vị trí của phần tử mảng đầu tiên thỏa mãn điều kiện bạn đặt ra.

Điều kiện bạn đặt ra được thể hiện dưới dạng một callback, callback trả về true có nghĩa là thỏa mãn, trả về false là không thỏa mãn.

Phương thức trả về -1 nếu không có phần tử mảng nào thỏa mãn điều kiện.

Cú pháp: array.findIndex[function[currentValue, index, arr], thisValue]. Trong đó

• function[currentValue, index, arr]: function callback chạy cho mỗi phần tử mảng.
  • currentValue: Giá trị của phần tử hiện tại
  • index: Không bắt buộc, là vị trí của phần tử hiện tại
  • arr: Không bắt buộc, là mảng mà chứa phần tử hiện tại
• thisValue: Không bắt buộc, nếu truyền vào thì nó sẽ được làm giá trị this của function, nếu không truyền this sẽ là undefined.

var users = [ { id: 1, name: 'Binh' }, { id: 2, name: 'Trang' }, { id: 3, name: 'Minh' }, ]; // Tìm vị trí của user có id là 2 var myId = 2; var myIndex = users.findIndex[function [user] { return user.id == myId; }]; console.log[myIndex]; // 1 // Tìm vị trí của phần tử đầu tiên trong mảng có giá trị lớn hơn 2 var numbers = [1, 2, 3, 4, 5]; var n = numbers.findIndex[function [item] { return item > 2; }]; console.log[n]; // 2

forEach[]

forEach[] được sử dụng khi bạn muốn duyệt các phần tử mảng.

Cú pháp: array.forEach[function[currentValue, index, arr], thisValue]. Trong đó

• function[currentValue, index, arr]: function callback chạy cho mỗi phần tử mảng.
  • currentValue: Giá trị của phần tử hiện tại
  • index: Không bắt buộc, là vị trí của phần tử hiện tại
  • arr: Không bắt buộc, là mảng mà chứa phần tử hiện tại
• thisValue: Không bắt buộc, nếu truyền vào thì nó sẽ được làm giá trị this của function, nếu không truyền this sẽ là undefined.

var users = [ { id: 1, name: 'Binh' }, { id: 2, name: 'Trang' }, { id: 3, name: 'Minh' }, ]; users.forEach[function [user] { console.log[user.name]; }]; /* Output: Binh Trang Minh */

from[]

from[] được sử dụng khi bạn muốn tạo ra một mảng mới từ một đối tượng dạng mảng.

Đối tượng dạng mảng là đối tượng có thuộc tính length và các phần tử thì được đánh vị trí [đánh index] hoặc các đối tượng khả duyệt như Map, Set

Cú pháp: Array.from[object, mapFunction[currentValue, index], thisValue]. Trong đó:

• object: Bắt buộc, là đối tượng bạn muốn chuyển sang dạng mảng.
• mapFunction[currentValue, index]: Không bắt buộc, là một function hoạt động tương tự như array.map, sẽ duyệt lần lượt trên từng phần tử mảng.
  • currentValue: Giá trị của phần tử hiện tại đang xét.
  • index: Vị trí của phần tử hiện tại đang xet.
• thisValue: Không bắt buộc, là giá trị this khi thực hiện mapFunction

var myArr = Array.from["123456", function [item, index, arr] { return item * 2; }]; console.log[myArr]; // [2, 4, 6, 8, 10, 12]

includes[]

includes[] được sử dụng để kiểm tra một phần tử có xuất hiện trong mảng hay không. Phương thức này trả về true nếu phần tử mảng có xuất hiện, trả về false nếu phần tử mảng không xuất hiện.

Cú pháp: array.includes[element, start]. Trong đó

• element: Bắt buộc, là giá trị của phần tử muốn kiểm tra.
• start: Không bắt buộc, là vị trí bắt đầu tìm kiếm trong mảng, mặc định là 0.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var n = fruits.includes["Mango"]; // true

indexOf[]

indexOf[] được sử dụng khi bạn muốn tìm vị trí [đầu tiên] của một phần tử trong mảng. Phương thức sẽ trả về -1 nếu không tìm thấy.

Cú pháp: array.indexOf[item, start]. Trong đó:

• item: Bắt buộc, giá trị của phần tử muốn tìm kiếm vị trí.
• start: Không bắt buộc, là vị trí bắt đầu tìm kiếm, mặc định là 0.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var a = fruits.indexOf["Apple"]; // 2

isArray[]

isArray[] được sử dụng để kiểm tra một đối tượng có phải là array hay không. Phương thức trả về true nếu đối tượng là array, trả về false nếu không phải là array.

Cú pháp: Array.isArray[obj]. Trong đó obj là đối tượng bạn muốn kiểm tra.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var isArray = Array.isArray[fruits]; // true

join[]

join[] được sử dụng khi bạn muốn nối các phần tử của mảng thành một string.

Cú pháp: array.join[separator]. Trong đó separator là giá trị sẽ nằm giữa các phần tử mảng sau khi được chuyển trành string, tham số này không bắt buộc, mặc định sẽ là dấu phẩy “,”.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var energy = fruits.join[]; // "Banana,Orange,Apple,Mango"

keys[]

keys[] phương thức sẽ trả về một đối tượng Array Iterator với giá trị là các keys của mảng.

Cú pháp: array.keys[]. Phương thức này không có tham số.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var fk = fruits.keys[]; for [x of fk] { console.log[x]; } /* Output: 0 1 2 3 */

length

length sẽ trả về số lượng phần tử có trong mảng, hoặc bạn có thể thay đổi số lượng phần tử trong mảng bằng cách gán giá trị mới cho thuộc tính này.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; console.log[fruits.length]; // 4 fruits.length = 1; console.log[fruits]; // ["Banana"]

lastIndexOf[]

lastIndexOf[] được sử dụng khi bạn muốn tìm kiếm vị trí cuối cùng của một phần tử trong mảng mà bạn truyền vào. Phương thức trả về -1 nếu không tìm thấy.

Cú pháp: array.lastIndexOf[item, start]. Trong đó:

• item: Bắt buộc, giá trị của phần tử muốn tìm kiếm vị trí.
• start: Không bắt buộc, là vị trí bắt đầu tìm kiếm, mặc định là 0.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var n = fruits.lastIndexOf["Apple"]; console.log[n]; // 2

map[]

map[] được sử dụng khi bạn muốn làm thay đổi giá trị của các phần tử trong mảng theo một logic nào đó. Logic được thể hiện dưới dạng một callback, giá trị trả về của callback sẽ là giá trị mới cho phần tử mảng tương ứng.

Cú pháp: array.map[function[currentValue, index, arr], thisValue]. Trong đó:

• function[currentValue, index, arr]: function callback chạy cho mỗi phần tử mảng.
  • currentValue: Giá trị của phần tử hiện tại
  • index: Không bắt buộc, là vị trí của phần tử hiện tại
  • arr: Không bắt buộc, là mảng mà chứa phần tử hiện tại
• thisValue: Không bắt buộc, nếu truyền vào thì nó sẽ được làm giá trị this của function, nếu không truyền this sẽ là undefined.

var numbers = [2, 4, 6, 8]; var doubleNumbers = numbers.map[function[num] { return num * 2; }]; console.log[doubleNumbers]; //  [4, 8, 12, 16]

pop[]

pop[] sẽ xóa phần tử cuối cùng trong mảng, đồng thời trả về phần tử vừa xóa.

Cú pháp: array.pop[]. Phương thức này không có tham số.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var item = fruits.pop[]; console.log[item]; // Mango console.log[fruits]; // ["Banana", "Orange", "Apple"]

push[]

push[] được sử dụng để thêm một phần tử vào cuối mảng, đồng thời trả về độ dài của mảng.

Cú pháp: array.push[item1, item2, ..., itemX]. Trong đó:

• item1, item2, …, itemX: Bắt buộc, là các phần tử sẽ được thêm vào cuối mảng.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var length = fruits.push["Kiwi"]; console.log[fruits]; // ["Banana", "Orange", "Apple", "Mango", "Kiwi"] console.log[length]; 5

reduce[]

reduce[] được sử dụng khi bạn muốn thực thi một callback lên từng phần tử [từ trái qua phải] với một biến được “tích lũy” để trả về một giá trị duy nhất.

Cú pháp: array.reduce[function[total, currentValue, currentIndex, arr], initialValue]. Trong đó:

• function[total, currentValue, index, arr]: Bắt buộc, là callback sẽ thực thi trên từng phần tử mảng.
  • total: Bắt buộc, là giá trị của tham số initialValue trong lần chạy đầu tiên, hoặc là giá trị trả về của callback này ở phần tử trước.
  • currentValue: Bắt buộc, là giá trị của phần tử hiện tại
  • index: Không bắt buộc, là vị trí của phần tử hiện tại.
  • arr: Không bắt buộc, là mảng mà phần tử hiện tại thuộc về.
• initialValue: Không bắt buộc, là giá trị ban đầu cho biến total trong callback.

// Tính tổng các phần tử trong mảng numbers var numbers = [1, 2, 3, 4, 5, 6]; var sum = numbers.reduce[function [total, number] { return total + number; }, 0]; console.log[sum]; // 21

reduceRight[]

phương thức reduceRight[] tương tự như reduce[], tuy nhiên reduceRight[] sẽ thực thi callback lên từng phần tử theo thứ tự từ phải qua trái.

Cú pháp: array.reduceRight[function[total, currentValue, currentIndex, arr], initialValue]. Trong đó:

• function[total, currentValue, index, arr]: Bắt buộc, là callback sẽ thực thi trên từng phần tử mảng.
  • total: Bắt buộc, là giá trị của tham số initialValue trong lần chạy đầu tiên, hoặc là giá trị trả về của callback này ở phần tử trước.
  • currentValue: Bắt buộc, là giá trị của phần tử hiện tại
  • index: Không bắt buộc, là vị trí của phần tử hiện tại.
  • arr: Không bắt buộc, là mảng mà phần tử hiện tại thuộc về.
• initialValue: Không bắt buộc, là giá trị ban đầu cho biến total trong callback.

// Tính hiệu các phần tử trong mảng numbers theo chiều từ phải qua trái var numbers = [2, 45, 30, 100]; var subtract = numbers.reduce[function [total, number] { return total - number; }, 0]; console.log[subtract]; // -177

reverse[]

reverse[] được sử dụng khi bạn muốn đảo ngược thứ tự các phần tử trong mảng. Tức là phần tử đầu sẽ trở thành phần tử cuối.

Cú pháp: array.reverse[]. Phương thức này không có tham số.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.reverse[]; console.log[fruits]; // ["Mango", "Apple", "Orange", "Banana"]

shift[]

shift[] được sử dụng khi bạn muốn xóa phần tử đầu tiên của mảng, đồng thời trả về phần tử đó.

Cú pháp: array.shift[]. Phương thức này không có tham số.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var item = fruits.shift[]; console.log[fruits]; // ["Orange", "Apple", "Mango"] console.log[item]; // Banana

slice[]

slice[] được sử dụng khi bạn muốn trích một mảng con từ vị trí n tới vị trí m trong mảng ban đầu. Lưu ý mảng được trích sẽ không bao gồm phần tử thứ m.

Cú pháp: array.slice[start, end]. Trong đó:

• start: Không bắt buộc, là vị bắt đầu bạn muốn trích, mặc định sẽ là 0. Bạn cũng có thể sử dụng số âm nếu muốn vị trí bắt đầu được tính từ cuối mảng [-1 là vị trí của phần tử cuối mảng].
• end: Không bắt buộc, là vị trí kết thúc của mảng con muốn trích. Bạn cũng có thể sử dụng số âm nếu muốn vị trí kết thúc được tính từ cuối mảng [-1 là vị trí của phần tử cuối mảng].

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; // Mảng citrus được trích từ mảng fruits, trích từ phần tử index 1, tới phần tử index 3 var citrus = fruits.slice[1, 3]; console.log[citrus]; // ["Orange", "Lemon"] // Trích từ cuối mảng lên var myBest = fruits.slice[-3, -1]; console.log[myBest]; // ["Lemon", "Apple"]

some[]

Phương thức some[] sẽ giúp bạn kiểm tra một mảng có thỏa mãn điều kiện hay không. Điều kiện được thể hiện dưới dạng một callback duyệt lần lượt các phần tử mảng, nếu kết quả callback của một trong số các phần tử mảng trả về true, thì phương thức some[] trả về true, nếu callback của tất cả các phần tử mảng trả về false, phương thức some trả về false.

Cú pháp: array.some[function[currentValue, index, arr], thisValue]. Trong đó:

• function[currentValue, index, arr]: function callback chạy cho mỗi phần tử mảng.
  • currentValue: Giá trị của phần tử hiện tại
  • index: Không bắt buộc, là vị trí của phần tử hiện tại
  • arr: Không bắt buộc, là mảng mà chứa phần tử hiện tại
• thisValue: Không bắt buộc, nếu truyền vào thì nó sẽ được làm giá trị this của function, nếu không truyền this sẽ là undefined.

// Kiểm tra mảng numbers có số nào là số lẻ hay không? var numbers = [1, 2, 3, 4, 5]; var hasOddNumber = numbers.some[function [item] { return item % 2 != 0; }]; console.log[hasOddNumber]; // true

sort[]

sort[] được sử dụng khi bạn muốn sắp xếp các phần tử trong mảng theo chiều tăng dần hoặc giảm dần. Mặc định phương thức sort[] sẽ sắp xếp mảng theo thứ tự bảng chữ cái theo chiều tăng dần. Trong trường hợp bạn muốn “tùy chỉnh” thứ tự sắp xếp, thì phương thức sort[] cũng chấp nhận một tham số dưới dạng callback giúp bạn làm điều này.

Cú pháp: array.sort[function [a, b]]. Trong đó function [a, b] [không bắt buộc] là callback để bạn tùy chỉnh thứ tự sắp xếp các phần tử trong mảng. Tham số a, b là một cặp phần tử trong mảng. Callback trả về >= 0 thì a và b sẽ không đổi chỗ, trả về < 0 thì a và b sẽ đổi chỗ cho nhau.

// Sắp xếp phần tử mảng theo thứ tự bảng chữ cái var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.sort[]; console.log[fruits]; // ["Apple", "Banana", "Mango", "Orange"] // Sắp xếp mảng tăng dần var numbers = [5, 3, 6, 1, 2]; numbers.sort[]; console.log[numbers]; // [1, 2, 3, 5, 6] // Sắp xếp mảng giảm dần var numbers = [5, 3, 6, 1, 2]; numbers.sort[function [a, b] { return b - a; }]; console.log[numbers]; // [6, 5, 3, 2, 1]

splice[]

splice[] được sử dụng khi bạn muốn thay thế một số phần tử trong mảng bằng một số phần tử khác.

Cú pháp: array.splice[index, howmany, item1, ....., itemX]. Trong đó:

• index: Bắt buộc là vị trí bắt đầu thay thế, bạn có thể sử dụng số âm để tính vị trí từ cuối mảng lên [phần tử cuối cùng là -1].
• howmany: Không bắt buộc, có bao nhiêu phần tử sẽ được thay thế, mặc định là 0.
• item1,… itemX: Là các phần tử sẽ được thay thế vào mảng kể từ vị trí index.

// Thay thế 1 phần tử tính từ index 2 bằng các phần tử "Lemon", "Kiwi" var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.splice[2, 1, "Lemon", "Kiwi"]; console.log[fruits]; // ["Banana", "Orange", "Lemon", "Kiwi", "Mango"]; // Do các tham số item1,... itemX là không bắt buộc // Nên chúng ta có thể sử dụng phương thức này để xóa hàng loạt các phần tử trong mảng, xet ví dụ dưới đây // Xóa 2 phần tử mảng kể từ index 2 var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.splice[2, 2]; console.log[fruits]; // ["Banana", "Orange"]

toString[]

toString[] sẽ trả về một string từ mảng ban đầu, với các phần tử mảng ngăn cách nhau bằng dấu phẩy “,”.

Cú pháp: array.toString[]. Phương thức này không có tham số.

Nếu bạn muốn tùy chỉnh ký tự ngăn cách giữa các phần tử mảng, thì có thể tham khảo phương thức join[].

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var x = fruits.toString[]; console.log[x]; // "Banana,Orange,Apple,Mango"

unshift[]

unshift[] được sử dụng khi bạn muốn thêm một hoặc một số phần tử vào đầu mảng. Phương thức sẽ trả về số lượng phần tử trong mảng sau khi thêm.

Cú pháp: array.unshift[item1, item2, ..., itemX]. Trong đó item1, item2, …, itemX là các phần tử bạn muốn thêm vào đầu mảng.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var length = fruits.unshift["Lemon","Pineapple"]; console.log[fruits]; // ["Lemon", "Pineapple", "Banana", "Orange", "Apple", "Mango"] console.log[length]; // 6

valueOf[]

Phương thức này hơi vô nghĩa, nó sẽ trả về y hệt như mảng ban đầu.

Cú pháp: array.valueOf[]. Phương thức này không có tham số.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; var v = fruits.valueOf[]; console.log[v]; // ["Banana", "Orange", "Apple", "Mango"]

Tổng kết

Trên là toàn bộ các phương thức [hàm] xử lý mảng trong JavaScript. Trong đó có một số phương thức tương tự nhau mà mình có thể gom nhóm lại như sau:

Nhóm thêm, xóa vào đầu, cuối mảng

• pop[]: Xóa phần tử cuối mảng
• push[]: Thêm vào cuối mảng
• shift[]: Xóa phần tử đầu mảng
• unshift[]: Thêm phần tử vào đầu mảng

Nhóm check mảng:

• every[]: Kiểm tra tất cả phần tử mảng phải thỏa mãn điều kiện
• some[]: Kiểm tra một trong số các phần tử mảng có phần tử nào thỏa mãn điều kiện.
• includes[]: Kiểm tra trong mảng có phần tử bạn cần tìm hay không?

Nhóm tìm cái gì đó trong mảng:

• find[]: Tìm phần tử mảng đầu tiên thỏa mãn điều kiện
• findIndex[]: Tìm vị trí của phần tử mảng đầu tiên thỏa mãn điều kiện
• indexOf[]: Tìm vị trí đầu tiên của phần tử xuất hiện trong mảng.
• lastIndexOf[]: Tìm vị trí cuối cùng của phần tử xuất hiện trong mảng.

Tới đây là hết rồi, chúc các bạn học tập hiệu quả.