Giải Thuật Căn Bản Trong Javascript – Tìm Số Lớn Nhất Trong Mỗi ...

Bài toán mà ta giải quyết hôm nay sẽ là: Tìm số lớn nhất trong mỗi mảng con của mảng cha

Tình huống mà bài toán đưa ra đó là ta sẽ viết chương trình xử lý và trả về số lớn nhất trong mỗi mảng con nằm trong một mảng cha được cung cấp sẵn.

Qua bài học ngày hôm nay, chúng ta cũng được học thêm về các khái niệm mới như Procedural approach, Declarative approach

Cách tiếp cận bài toán theo hướng thủ tục – Procedural Approach

Đầu tiên, ta tạo một mảng result để lưu trữ các số lớn nhất của các mảng con trong mảng cha mà ta cần xử lý

var results = [];

Tiếp theo, ta tạo một vòng lặp for để lặp qua một lượt các mảng con

for (var n = 0; n < arr.length; n++)

Kế đó, ta khai báo biến thứ hai để lưu trữ số lớn nhất và khởi tạo nó với giá trị đầu tiên của mỗi mảng con

var largestNumber = arr[n][0];

Sau đó, ta tạo ra một vòng lặp bên trong để lặp qua một lượt các số nằm trong mảng con

for (var sb = 0; sb < arr[n].length; sb++)

và kiểm tra nếu có bất kỳ số nào của mảng con lớn hơn biến largestNumber thì ta sẽ update biến này là số mà ta vừa kiểm tra

if (arr[n][sb] > largestNumber) {     largestNumber = arr[n][sb]; }

Bên ngoài vòng lặp mà ta đang xử lý với các số nằm trong mảng con, ta tiến hành update từng largestNumber của mỗi mảng con vào đúng vị trí của chúng trong mảng results mà ta đã khai báo bên trên

results[n] = largestNumber;

Và cuối cùng ta return lại biến results sau khi ta đã lặp qua toàn bộ các mảng con.

Đoạn code hoàn chỉnh cho giải pháp mà ta vừa nêu

This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters

Show hidden characters

function largestOfFour(arr) {

var results = [];

for (var i = 0; i < arr.length; i++) {

var largestNumber = arr[i][0];

for (var j = 0; j < arr[i].length; j++) {

if (arr[i][j] > largestNumber) {

largestNumber = arr[i][j];

}

}

results[i] = largestNumber;

}

return results;

}

view raw LargestNumberInArray.js hosted with ❤ by GitHub

Giải pháp tiếp cận theo hướng Declarative Approach

Trước khi đi tìm hiểu sâu về giải pháp ở phần này, ta sẽ cùng nhau đi tìm hiểu về khái niệm Declarative Approach, nó là gì, nó tốt hơn phương pháp Procedural Approach ở điểm nào? Và tại sao ta nên dùng nó?

Để dễ hiểu ta có thể hình dùng việc sử dụng Declarative Approach tương ứng với việc sử dụng các hàm đã build sẵn trong mỗi ngôn ngữ lập trình nghĩa là thay vì ta phải viết code để thực hiện mỗi một điều ta muốn (như giải pháp mà ta đã trình ở trên) thì ta sẽ sử dụng các hàm được build sẵn.

Nói một cách ngắn gọn,

• Với cách tiếp cận Procedural Approach ta quan tâm tới việc làm thế nào (HOW) để giải quyết bài toán.
• Còn cách tiếp cận Declarative Approach (DP) ta chỉ cần quan tâm tới dữ liệu đầu vào và đầu ra của bài toán (WHAT).

Cách tiếp cận Procedural Approach là như ta vừa làm ở trên, còn để hiểu hơn về Declarative Approach ta sẽ cùng nhau đi tìm hiểu ở những phần tiếp theo sau đây.

Đầu tiên, ta map tất cả các mảng con trong mảng chính sang mảng mới bằng cách dùng Array.prototype.map() và mảng này chính là kết quả mà ta sẽ return

return arr.map (function (group) { ... });

Bên trong mỗi mảng con ta reduce nội dung của nó xuống thành một giá trị đơn bằng cách sử dụng Array.prototype.reduce().

Hàm callback đã được pass qua method reduce sẽ lấy giá trị trước đó (prev) và giá trị hiện tại (current) và so sánh 2 giá trị này với nhau. Nếu current lớn hơn prev thì chúng ta sẽ set current trở thành giá trị prev mới để so sánh với giá trị current kế tiếp bên trong mảng; nếu current là giá trị cuối cùng trong mảng ta sẽ return nó đến hàm callback của hàm map

return group.reduce(function(prev, current) {     return (current > prev) ? current : prev; });

Code hoàn chỉnh cho giải pháp này

This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters

Show hidden characters

function largestOfFour(arr) {

return arr.map(function(group) {

return group.reduce(function(prev, current) {

return (current > prev) ? current : prev;

});

});

}

largestOfFour([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [1000, 1001, 857, 1]]);

view raw LargestNumbersInArrays.js hosted with ❤ by GitHub

Để tìm hiểu thêm về các lợi ích của DP, ta có thể vào link tiếng Việt hoặc link tiếng Anh để tham khảo thêm.

Ta đã đi qua các hàm như map, reduce ở một số bài như viết hoa chữ đầu của mỗi từ trong câu, tìm từ dài nhất trong một chuỗi, Palindrome để tìm hiểu kỹ hơn về những hàm build-in như map, filter và reduce này ta có thể tìm hiểu ở link sau

Cám ơn các bạn đã theo dõi.

• Add to Phrasebook
  • No wordlists for English (USA) -> Vietnamese…
  • Create a new wordlist…
• Copy

• Add to Phrasebook
  • No wordlists for English (USA) -> Vietnamese…
  • Create a new wordlist…
• Copy

• Add to Phrasebook
  • No wordlists for English (USA) -> Vietnamese…
  • Create a new wordlist…
• Copy

• Add to Phrasebook
  • No wordlists for English (USA) -> Vietnamese…
  • Create a new wordlist…
• Copy

• Add to Phrasebook
  • No wordlists for English (USA) -> Vietnamese…
  • Create a new wordlist…
• Copy

• Add to Phrasebook
  • No wordlists for English (USA) -> Vietnamese…
  • Create a new wordlist…
• Copy

Share this:

• X
• Facebook

Like Loading...

Related