JavaScript là một ngôn ngữ kịch bản dựa trên đối tượng mạnh mẽ; . Khi được kết hợp với Mô hình đối tượng tài liệu [DOM] do trình duyệt web xác định, JavaScript cho phép bạn tạo nội dung HTML động và các ứng dụng web tương tác phía máy khách. Cú pháp JavaScript dựa trên các ngôn ngữ lập trình phổ biến C, C++ và Java, khiến nó trở nên quen thuộc và dễ học đối với các lập trình viên có kinh nghiệm. Đồng thời, JavaScript là một ngôn ngữ kịch bản được giải thích, cung cấp một môi trường lập trình linh hoạt, dễ dàng trong đó các lập trình viên mới có thể học hỏi. JavaScript. Hướng dẫn dứt khoát cung cấp mô tả kỹ lưỡng về ngôn ngữ JavaScript cốt lõi và cả DOM tiêu chuẩn và cũ được triển khai trong trình duyệt web. Cuốn sách bao gồm các ví dụ phức tạp chỉ cho bạn cách xử lý các tác vụ phổ biến, như xác thực dữ liệu biểu mẫu, làm việc với cookie và tạo hoạt ảnh DHTML di động. Cuốn sách cũng chứa các phần tham khảo chi tiết bao gồm API JavaScript cốt lõi, API phía máy khách kế thừa và API DOM tiêu chuẩn của W3C, ghi lại mọi đối tượng JavaScript, phương thức, thuộc tính, hàm tạo, hằng, hàm và trình xử lý sự kiện trong các API đó. Phiên bản thứ tư của cuốn sách JavaScript bán chạy nhất này đã được cập nhật cẩn thận để bao gồm JavaScript 1. 5 [ECMAScript phiên bản 3]. Cuốn sách cũng cung cấp thông tin đầy đủ về tiêu chuẩn W3C DOM [Cấp độ 1 và Cấp độ 2], đồng thời giữ lại tài liệu về DOM Cấp độ 0 kế thừa để tương thích ngược. JavaScript. The Definitive Guide là hướng dẫn hoàn chỉnh dành cho lập trình viên và hướng dẫn tham khảo về JavaScript. Nó đặc biệt hữu ích cho các nhà phát triển làm việc với các trình duyệt web tuân theo tiêu chuẩn mới nhất, như Internet Explorer 6, Netscape 6 và Mozilla. Các tác giả HTML có thể học cách sử dụng JavaScript để xây dựng các trang web động. Các lập trình viên có kinh nghiệm có thể nhanh chóng tìm thấy thông tin họ cần để bắt đầu viết các chương trình JavaScript tinh vi. Cuốn sách này là một tài liệu tham khảo không thể thiếu cho tất cả các lập trình viên JavaScript, bất kể mức độ kinh nghiệm.
Thông thường, bạn sử dụng vòng lặp for để lặp qua các phần tử, chuyển đổi từng phần tử riêng lẻ và đưa kết quả vào một mảng mới
Vui lòng xem ví dụ bên dưới
Giả sử rằng bạn có một mảng số nguyên trong đó mỗi phần tử đại diện cho bán kính của một hình tròn như sau
let mangBanKinh = [10, 30, 50];
Phần sau minh họa cách tính diện tích của mỗi hình tròn và đưa kết quả vào một mảng mới
let arrDienTich = [];
// Tính diện ích của các hình tròn
cho [let i = 0; i Toán. tầng [Toán. PI * banKing * banKing]
bảng điều khiển. log[arrDienTich];
Ngoài ra, chúng ta có thể viết chương trình theo một cách "mã sạch" như thế này
// Tạo hàm tính diện tích
let tinhDienTich = r => Toán. tầng [Toán. PI * r * r];
// Mảng chứa các bán kính
const banKinh = [10, 30, 50];
// Tính diện ích theo từng bán kinh
const arrDienTich = banKinh. map[tinhDienTich];
bảng điều khiển. log[arrDienTich];
Chi tiết phương thức map[] trong JavaScript
Cú pháp map[]
đối tượng mảng. map[callback[, contextObject]];
- Phương thức map[] call a function call back on all phần tử của mảng và trả về một mảng mới chứa kết quả
- Phương thức map[] nhận hai đối số được đặt tên, đối số đầu tiên là bắt buộc, trong khi đối số thứ hai là tùy chọn
Tương tự như các kiểu lặp lại khác nhau như every[], some[], filter[], forEach[] and sort[], function callback[] có dạng sau
hàm gọi lại[currentElement, index, array] {
Hàm gọi lại[] nhận ba đối số
currentElement. [Bắt buộc] Là phần tử hiện tại của mảng đang được xử lý
index. [Tùy chọn] Là mục duy nhất củacurrentElement
array. [Tùy chọn] Là mảng đối tượng được duyệt qua
Nếu bạn chuyển ngữ cảnhObject vào phương thức map[], bạn có thể tham khảo contextObject bên trong hàm callback[] bằng cách sử dụng từ khóa this
Điều quan trọng cần lưu ý là phương thức map[] không thay đổi mảng ban đầu, nó tạo ra một mảng mới bao gồm tất cả các phần tử đã được biến đổi bởi hàm callback[]
Một số ví dụ về cách sử dụng map[] trong JavaScript
Đây là một ví dụ tạo một mảng bình phương từ một mảng mới
// Tạo một hàm lát nữa sử dụng
const mangBanDau = [2, 3, 4, 5, 6];
// Gọi hàm trên cấm phần ử
const mangBinhPhuong = mangBanDau. map[binhPhuong];
bảng điều khiển. log[mangBinhPhuong];
Kết quả
Ví dụ sau đây cho thấy cách biến đổi một mảng số bằng cách sử dụng một phương thức có sẵn của Math để thực hiện callback[] hàm
// Tính căn bậc 2 của từng phần tử trong mảng
let ketQua = mangSo. bản đồ [Toán. sqrt];
Kết quả
Ví dụ. Ghép họ và tên bằng cách sử dụng map[]
{ ho. "Đặng", mười. "Ngọc Anh" },
{ ho. "Vi", mười. "Tiểu Bảo" },
hàm layTenDayDu[sv] {
// Ghép họ và tên bằng hàm tham gia[]
let hoVaTen = [sv. ho, sv. mười]. tham gia[" "];
let tenDayDu = sinhVien. map[layTenDayDu];
Kết quả
["Đặng Ngọc Anh", "Vi Tiểu Bảo", "Hàn Lập"]
Ví dụ. Định dạng lại Array Object
Chúng ta có một đối tượng sinhVien như thế này
{ msv. "SV1", mười. "Ngọc Anh" },
{ msv. "SV2", mười. "Tiểu Bảo" },
{ msv. "SV3", mười. "Hàn Lập" }
Bây giờ chúng ta muốn tạo một đối tượng mới trong đó có tên sinh viên và độ dài tên của từng sinh viên, ta làm như sau
const doDaiTenSinhVien = SinhVien. bản đồ[sv => {
đối tượng. doDaiTen = sv. mười. chiều dài;
bảng điều khiển. log[doDaiTenSinhVien];
Total results about map[] in JS
Trong bài hướng dẫn này, bạn đã học được cách sử dụng phương thức map[] trong JavaScript để biến đổi các phần tử của mảng theo một hàm tùy biến
Bạn sẽ sử dụng nhiều map[] khi đi làm thực tế hoặc sử dụng Front end Framework [như React. js]. Vì thế, hãy luyện thêm tập tin để hiểu rõ hơn bạn nhé
Chúc bạn học tốt
---
HỌC VIỆN ĐẠO TẠO CNTT NIIT - ICT HÀ NỘI
Học lập trình chất lượng cao [Từ năm 2002]. Học thực tế + Tuyển dụng ngay
Đc. Tầng 3, 25T2, N05, Nguyễn Thị Thập, Cầu Giấy, Hà Nội
SĐT. 02435574074 - 0968051561
E-mail. xin chào@niithanoi. giáo dục. vn
trang chủ. https. //Facebook. com/NIIT. CNTT-TT/
#niit #niithanoi #niiticthanoi #hoclaptrinh #khoahoclaptrinh #hoclaptrinhjava #hoclaptrinhphp #java #php #python