Mảng là một trong những khái niệm phổ biến nhất của Javascript, nó cho chúng ta rất nhiều khả năng làm việc với dữ liệu được lưu trữ bên trong. Cân nhắc rằng mảng là một trong những chủ đề cơ bản nhất trong Javascript mà bạn tìm hiểu khi bắt đầu con đường lập trình của mình, trong bài viết này, tôi muốn chỉ cho bạn một vài thủ thuật mà bạn có thể chưa biết và có thể rất hữu ích. hữu ích trong mã hóa! Bắt đầu nào.

1. Loại bỏ các bản sao khỏi một mảng

Đó là một câu hỏi phỏng vấn rất phổ biến về mảng Javascript, cách trích xuất các giá trị duy nhất từ ​​mảng Javascript. Đây là một giải pháp nhanh chóng và dễ dàng cho vấn đề này, bạn có thể sử dụng Set() mới cho mục đích này. Và tôi muốn chỉ cho bạn hai cách khả thi để làm điều đó, một với phương thức .from() và cách thứ hai với toán tử trải rộng (…).

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];

// First method
var uniqueFruits = Array.from(new Set(fruits));
console.log(uniqueFruits); // returns ["banana", "apple", "orange", "watermelon", "grape"]
// Second method
var uniqueFruits2 = […new Set(fruits)];
console.log(uniqueFruits2); // returns ["banana", "apple", "orange", "watermelon", "grape"]

Đôi khi, cần phải thay thế một giá trị cụ thể trong mảng khi tạo mã và có một phương pháp ngắn gọn hay để thực hiện điều đó mà bạn có thể chưa biết. Đối với điều này, chúng tôi có thể sử dụng .splice(start, value to remove, valueToAdd) và chuyển vào đó cả ba tham số chỉ định nơi chúng tôi muốn bắt đầu sửa đổi, số lượng giá trị chúng tôi muốn thay đổi và các giá trị mới.

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
fruits.splice(0, 2, “potato”, “tomato”);
console.log(fruits); // returns [“potato”, “tomato”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”]

Có lẽ mọi người đều biết phương thức .map() của mảng, nhưng có một giải pháp khác có thể được sử dụng để có được hiệu ứng tương tự và mã rất rõ ràng. Chúng ta có thể sử dụng phương thức .from() cho mục đích này.

var friends = [
    { name: ‘John’, age: 22 },
    { name: ‘Peter’, age: 23 },
    { name: ‘Mark’, age: 24 },
    { name: ‘Maria’, age: 22 },
    { name: ‘Monica’, age: 21 },
    { name: ‘Martha’, age: 19 },
]

var friendsNames = Array.from(friends, ({name}) => name);
console.log(friendsNames); // returns ["John", "Peter", "Mark", "Maria", "Monica", "Martha"]

Bạn có một mảng đầy đủ các phần tử nhưng bạn cần làm sạch nó cho bất kỳ mục đích nào và bạn không muốn xóa từng phần tử một? Rất đơn giản để làm điều đó trong một dòng mã. Để làm trống một mảng, bạn cần đặt độ dài của mảng thành 0, thế là xong!

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];

fruits.length = 0;
console.log(fruits); // returns []

Điều xảy ra là chúng ta có một mảng, nhưng vì mục đích nào đó, chúng ta cần một đối tượng có dữ liệu này và cách nhanh nhất để chuyển đổi mảng thành một đối tượng là sử dụng toán tử trải rộng nổi tiếng (…).

var fruits = [“banana”, “apple”, “orange”, “watermelon”];
var fruitsObj = { …fruits };
console.log(fruitsObj); // returns {0: “banana”, 1: “apple”, 2: “orange”, 3: “watermelon”, 4: “apple”, 5: “orange”, 6: “grape”, 7: “apple”}

Có một số tình huống khi chúng tôi tạo một mảng và chúng tôi muốn điền vào đó một số dữ liệu hoặc chúng tôi cần một mảng có cùng giá trị và trong trường hợp này, phương thức .fill() đi kèm với một giải pháp dễ dàng và rõ ràng.

var newArray = new Array(10).fill(“1”);
console.log(newArray); // returns [“1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”]

Bạn có biết cách hợp nhất các mảng thành một mảng không sử dụng phương thức .concat() không? Có một cách đơn giản để hợp nhất bất kỳ số lượng mảng nào thành một trong một dòng mã. Như bạn có thể đã nhận ra toán tử trải rộng (…) khá hữu ích khi làm việc với mảng và nó cũng tương tự trong trường hợp này.

var fruits = [“apple”, “banana”, “orange”];
var meat = [“poultry”, “beef”, “fish”];
var vegetables = [“potato”, “tomato”, “cucumber”];
var food = […fruits, …meat, …vegetables];
console.log(food); // [“apple”, “banana”, “orange”, “poultry”, “beef”, “fish”, “potato”, “tomato”, “cucumber”]

Đây cũng là một trong những thử thách phổ biến nhất mà bạn có thể gặp phải trong bất kỳ cuộc phỏng vấn Javascript nào vì nó cho biết liệu bạn có thể sử dụng các phương thức mảng hay không và logic của bạn là gì. Để tìm phần giao nhau của hai mảng, chúng ta sẽ sử dụng một trong các phương thức đã trình bày trước đó trong bài viết này, để đảm bảo rằng các giá trị trong mảng mà chúng ta đang kiểm tra không bị trùng lặp và chúng ta sẽ sử dụng phương thức .filter và phương thức .includes. Kết quả là, chúng ta sẽ nhận được mảng với các giá trị đã được trình bày trong cả hai mảng. Kiểm tra mã:

var numOne = [0, 2, 4, 6, 8, 8];
var numTwo = [1, 2, 3, 4, 5, 6];
var duplicatedValues = […new Set(numOne)].filter(item => numTwo.includes(item));
console.log(duplicatedValues); // returns [2, 4, 6]

Đầu tiên, hãy định nghĩa các giá trị giả. Trong Javascript, các giá trị giả là false, 0, „”, null, NaN, không xác định. Bây giờ chúng ta có thể tìm hiểu cách loại bỏ các loại giá trị này khỏi mảng của mình. Để đạt được điều này, chúng ta sẽ sử dụng phương thức .filter().

var mixedArr = [0, “blue”, “”, NaN, 9, true, undefined, “white”, false];
var trueArr = mixedArr.filter(Boolean);
console.log(trueArr); // returns [“blue”, 9, true, “white”]

Đôi khi chúng ta cần chọn ngẫu nhiên một giá trị từ mảng. Để tạo nó một cách dễ dàng, nhanh chóng, ngắn gọn và giữ cho mã của chúng ta sạch sẽ, chúng ta có thể lấy một số chỉ mục ngẫu nhiên theo độ dài của mảng. Hãy xem mã:

var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var randomColor = colors[(Math.floor(Math.random() * (colors.length)))]

Khi chúng ta cần lật mảng của mình, không cần phải tạo nó thông qua các vòng lặp và hàm phức tạp, có một phương thức mảng dễ dàng thực hiện tất cả cho chúng ta và chỉ với một dòng mã, chúng ta có thể đảo ngược mảng của mình. Hãy kiểm tra nó:

var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var reversedColors = colors.reverse();
console.log(reversedColors); // returns [“brown”, “black”, “yellow”, “orange”, “purple”, “pink”, “navy”, “green”, “white”, “blue”]

Trong Javascript, có một phương pháp thú vị cho phép tìm chỉ mục của lần xuất hiện cuối cùng của phần tử đã cho. Ví dụ: nếu mảng của chúng tôi có các giá trị trùng lặp, chúng tôi có thể tìm vị trí xuất hiện lần cuối của nó. Hãy xem ví dụ mã:

var nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7];
var lastIndex = nums.lastIndexOf(5);
console.log(lastIndex); // returns 9

Một thách thức khác thường xảy ra trong các cuộc phỏng vấn Kỹ sư Javascript. Không có gì đáng sợ đến đây; nó có thể được giải quyết bằng phương thức .reduce trong một dòng mã. Hãy kiểm tra mã:

var nums = [1, 5, 2, 6];
var sum = nums.reduce((x, y) => x + y);
console.log(sum); // returns 14

Tăng cấp mã hóa

Cảm ơn vì đã là một phần của cộng đồng của chúng tôi! Trước khi bạn đi:

• Vỗ tay cho truyện và theo dõi tác giả
• Xem thêm nội dung trong ấn phẩm Level Up Coding
• Theo dõi chúng tôi: Twitter | LinkedIn | bản tin