🔥CHỌN LỌC TOP NHỮNG KHOÁ HỌC LẬP TRÌNH ONLINE NHIỀU NGƯỜI THEO HOC TẠI ĐÂY🔥

Chào các bạn, hôm nay cafedev chia sẻ cho ace một danh sách các bài tập từ cơ bản tới nâng cao liên quan tới các kiến thức cơ bản trong lập trình Javascript. Cụ thể, trong bài này chúng ta sẽ làm quen với Array và hàm của Array. Từ đó giúp ace nâng cao kiến thức, kỹ năng, kinh nghiệm lập trình của mình và áp dụng nó vào thực tế.

Trước khi đi vào chi tiết bài tập, cafedev khuyến khích ace tự code bài tập của mình trước khi tham khảo bài hướng dẫn nhé.

Để chạy hoặc code các bài tập sau, ace có thể code trên trang web này như sau:

  • Chọn new
  • Chọn dự án bạn muốn code, ở đây có nhiều lựa chọn như Javascript, AngularJS, React,…. Tất nhiên mình sẽ chọn Javascript.
  • Sau đó bạn sẽ thấy nơi bạn code.
  • Sau khi code sau chọn Preview để xem kết quả.

Ngoài ra ace cũng có thể dùng các IDE đã được giới thiệu tại đây để code và chạy code đó trên máy tính của mình nhé.

Lưu ý: Mọi bài tập bên dưới cũng như các bài tập khác trong Series Javascript này được tạo ra từ các bài học và kiến thức của từng phần trong series tự học Javascript này. Nếu ace nào chưa làm được hoặc chưa hiểu kỹ về bài học thì bạn có thể tham khảo lại series tự học này nhé. Chúc các bạn thành công.

Bài 1

Đoạn code này sẽ hiển thị gì?

let fruits = ["Apples", "Pear", "Orange"];

// push a new value into the "copy"
let shoppingCart = fruits;
shoppingCart.push("Banana");

// what's in fruits?
alert( fruits.length ); // ?

Bài 2

Hãy thử 5 phép toán trong mảng.

  1. Tạo mảng có tên là styles với các mục “Jazz” và “Blues”.
  2. Thêm “Rock-n-Roll” vào cuối.
  3. Thay thế giá trị ở giữa bằng “Classics”. Code để tìm giá trị giữa sẽ hoạt động với bất kỳ mảng nào có độ dài lẻ.
  4. Tách giá trị đầu tiên của mảng và hiển thị nó.
  5. Thêm trước Rap và Reggae vào mảng.

Kết quả sẽ như sau:

Jazz, Blues
Jazz, Blues, Rock-n-Roll
Jazz, Classics, Rock-n-Roll
Classics, Rock-n-Roll
Rap, Reggae, Classics, Rock-n-Roll

Bài 3

Kết quả là gì? Tại sao?

let arr = ["a", "b"];

arr.push(function() {
  alert( this );
})

arr[2](); // ?

Bài 4

Viết hàm sumInput() rằng:

  • Yêu cầu người dùng nhập các giá trị bằng cách sử dụng prompt và lưu trữ các giá trị trong mảng.
  • Kết thúc yêu cầu khi người dùng nhập một giá trị không phải số, một chuỗi trống hoặc nhấn “Hủy”.
  • Tính toán và trả về tổng của các mục mảng.

Bài 5

Đầu vào là một mảng số, ví dụ: arr = [1, -2, 3, 4, -9, 6].

Nhiệm vụ là: tìm mảng con liền kề của arr với tổng các item lớn nhất.

Viết hàm getMaxSubSum(arr) sẽ trả về tổng đó.

Hướng dẫn cách xem và tải tài liệu từ trang cafedev tại đây.


Giải bài từ 1,2,3,4,5

Bài 6

Viết hàm camelize(str) để thay đổi các từ được phân tách bằng dấu gạch ngang như “my-short-string” thành “myShortString” được viết bằng camel.

Đó là: loại bỏ tất cả các dấu gạch ngang, mỗi từ sau dấu gạch ngang trở thành chữ hoa. Ví dụ:

camelize("background-color") == 'backgroundColor';
camelize("list-style-image") == 'listStyleImage';
camelize("-webkit-transition") == 'WebkitTransition';

Bài 7

Viết một hàm filterRange(arr, a, b) lấy một mảng arr, tìm kiếm các phần tử giữa a và b trong đó và trả về một mảng trong số đó.

Hàm không nên sửa đổi mảng. Nó sẽ trả về mảng mới.

Bài 8

Viết một hàm filterRangeInPlace(arr, a, b) lấy một mảng arr và loại bỏ khỏi nó tất cả các giá trị ngoại trừ những giá trị nằm giữa a và b. Nghiệm là: a ≤ arr [i] ≤ b.

Hàm chỉ nên sửa đổi mảng. Nó sẽ không trả lại bất cứ điều gì. Ví dụ:

let arr = [5, 3, 8, 1];

filterRangeInPlace(arr, 1, 4); // removed the numbers except from 1 to 4

alert( arr ); // [3, 1]

Bài 9

Sắp xếp mảng giảm dần…như ví dụ dưới

let arr = [5, 2, 1, -10, 8];

// ... your code to sort it in decreasing order

alert( arr ); // 8, 5, 2, 1, -10

Bài 10

Chúng ta có một mảng chuỗi arr. Chúng ta muốn có một bản sao được sắp xếp của nó, nhưng giữ cho bản sao không bị sửa đổi.

Tạo một hàm copySorted(arr) trả về một bản sao như vậy.

let arr = ["HTML", "JavaScript", "CSS"];

let sorted = copySorted(arr);

alert( sorted ); // CSS, HTML, JavaScript
alert( arr ); // HTML, JavaScript, CSS (no changes)

Giải bài từ 6,7,8,9,10

Bài 11

Bạn có một mảng các đối tượng người dùng, mỗi đối tượng có user.name. Viết code chuyển đổi nó thành một mảng tên.

Ví dụ:

let john = { name: "John", age: 25 };
let pete = { name: "Pete", age: 30 };
let mary = { name: "Mary", age: 28 };

let users = [ john, pete, mary ];

let names = /* ... your code */

alert( names ); // John, Pete, Mary

Bài 12

Bạn có một mảng các đối tượng người dùng, mỗi đối tượng có name, surname và id.

Viết code để tạo một mảng khác từ nó, gồm các đối tượng có id và fullName, trong đó fullName được tạo từ name và surname.

Bài 13

Viết hàm sortByAge(users) lấy một mảng các đối tượng User(có name và age)có thuộc tính age và sắp xếp chúng theo độ tuổi.

Bài 14

Viết hàm getAverageAge(users) lấy một mảng đối tượng có thuộc tính tuổi và trả về tuổi trung bình.

Công thức tính giá trị trung bình là (age1 + age2 + … + ageN) / N.

Bài 15

Giả sử chúng ta đã nhận được một loạt người dùng ở dạng {id: …, name: …, age …}.

Tạo một nhóm groupById(arr) tạo một đối tượng từ nó, với id là khóa và các phần tử mảng là giá trị.

let users = [
  {id: 'john', name: "John Smith", age: 20},
  {id: 'ann', name: "Ann Smith", age: 24},
  {id: 'pete', name: "Pete Peterson", age: 31},
];

let usersById = groupById(users);

/*
// after the call we should have:

usersById = {
  john: {id: 'john', name: "John Smith", age: 20},
  ann: {id: 'ann', name: "Ann Smith", age: 24},
  pete: {id: 'pete', name: "Pete Peterson", age: 31},
}
*/

Chức năng như vậy thực sự tiện dụng khi làm việc với dữ liệu máy chủ.

Trong nhiệm vụ này, chúng ta giả định rằng id là duy nhất. Có thể không có hai phần tử mảng có cùng id.


Giải bài từ 11,12,13,14,15

Nguồn và Tài liệu tiếng anh tham khảo:

Tài liệu từ cafedev:

Nếu bạn thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa:

Chào thân ái và quyết thắng!

Đăng ký kênh youtube để ủng hộ Cafedev nha các bạn, Thanks you!

BÀI VIẾT LIÊN QUANXEM THÊM