Hướng dẫn how do i map an array in javascript? - làm cách nào để ánh xạ một mảng trong javascript?

Question

Ví dụ

Trả về một mảng mới với căn bậc hai của tất cả các giá trị phần tử:

Nội dung chính Show

số const = [65, 44, 12, 4]; const newarr = number.map (myfunction)
const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9] 2 gọi một hàm một lần cho mỗi phần tử trong một mảng.
const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9] 2 không thay đổi mảng ban đầu.
Tùy chọn. Mảng của phần tử hiện tại.
Sự mô tả
mục lục
Thông số
Giá trị trả về
Sự mô tả
Ánh xạ một mảng các số vào một mảng của rễ vuông
Sử dụng bản đồ để định dạng lại các đối tượng trong một mảng
Ánh xạ một mảng số bằng cách sử dụng hàm chứa đối số
Gọi bản đồ () trên các đối tượng không phải là
Sử dụng bản đồ () một cách chung chung trên một cái gật đầu
Sử dụng map () trên các mảng thưa thớt
Sử dụng parseInt () với map ()
Mảng ánh xạ chứa không xác định
Thông số kỹ thuật
Tính tương thích của trình duyệt web
Làm thế nào để bạn tạo một bản đồ mảng?
Bạn có thể ánh xạ thông qua một mảng không?
Làm thế nào để bạn vượt qua một mảng trên bản đồ?
Bản đồ trong JavaScript với ví dụ là gì?

số const = [4, 9, 16, 25]; const newarr = number.map (math.sqrt)
const newArr = numbers.map(Math.sqrt)

Hãy tự mình thử »

Nhân tất cả các giá trị trong một mảng với 10:

số const = [65, 44, 12, 4]; const newarr = number.map (myfunction)
const newArr = numbers.map(myFunction)

hàm myfunction (num) {& nbsp; trả về num * 10;}
return num * 10;
}

Hãy tự mình thử »

Nhân tất cả các giá trị trong một mảng với 10:

số const = [65, 44, 12, 4]; const newarr = number.map (myfunction)

hàm myfunction (num) {& nbsp; trả về num * 10;}

Thêm ví dụ dưới đây.

Định nghĩa và cách sử dụng

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

2 tạo ra một mảng mới từ việc gọi hàm cho mọi phần tử mảng.

const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9] 2 gọi một hàm một lần cho mỗi phần tử trong một mảng.

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

2 không thực thi chức năng cho các phần tử trống.

const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9] 2 không thay đổi mảng ban đầu.

Cú pháp	mảng.map (hàm (currentValue, index, mảng), điều này)
Thông số	Tham số A function to be run for each array element.
Sự mô tả	hàm số() The value of the current element.
Yêu cầu.a hàm được chạy cho từng phần tử mảng.	Hiện tại giá trị The index of the current element.
Yêu cầu. Giá trị của phần tử hiện tại.	mục lục The array of the current element.
Tùy chọn. Chỉ số của phần tử hiện tại.	mảng Default value `const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9]` 6. A value passed to the function to be used as its `const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9]` 7 value.

Tùy chọn. Mảng của phần tử hiện tại.

giá trị này	mảng.map (hàm (currentValue, index, mảng), điều này)
Thông số	Tham số

Sự mô tả

hàm số()

Yêu cầu.a hàm được chạy cho từng phần tử mảng.
{firstname : "Malcom", lastname: "Reynolds"},
{firstname : "Kaylee", lastname: "Frye"},
{firstname : "Jayne", lastname: "Cobb"}
];

Hiện tại giá trị

Yêu cầu. Giá trị của phần tử hiện tại.
return [item.firstname,item.lastname].join(" ");
}

Hãy tự mình thử »

mục lục

Tùy chọn. Chỉ số của phần tử hiện tại.

mảng

Tùy chọn. Mảng của phần tử hiện tại.

giá trị này

Tùy chọn.Default Giá trị

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

6. Một giá trị được truyền đến hàm sẽ được sử dụng làm giá trị

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 của nó.

Giá trị trả về

Loại hình

Một mảng

Kết quả của một hàm cho mỗi phần tử mảng. Nhiều ví dụ hơn Kết quả của một hàm cho mỗi phần tử mảng. Kết quả của một hàm cho mỗi phần tử mảng. Kết quả của một hàm cho mỗi phần tử mảng. Kết quả của một hàm cho mỗi phần tử mảng.

Phương thức

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

2 tạo ra một mảng mới được tạo ra với kết quả gọi hàm được cung cấp trên mọi phần tử trong mảng gọi.
const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9]
2 method creates a new array populated with the results of calling a provided function on every element in the calling array.

Thử nó

Cú pháp

// Arrow function
map((element) => { /* … */ })
map((element, index) => { /* … */ })
map((element, index, array) => { /* … */ })

// Callback function
map(callbackFn)
map(callbackFn, thisArg)

// Inline callback function
map(function(element) { /* … */ })
map(function(element, index) { /* … */ })
map(function(element, index, array){ /* … */ })
map(function(element, index, array) { /* … */ }, thisArg)

Thông số

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0

Chức năng được gọi cho mọi yếu tố của

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

1. Mỗi lần

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0 thực thi, giá trị trả về được thêm vào

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

3.

Hàm được gọi với các đối số sau:

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

4

Phần tử hiện tại được xử lý trong mảng.

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

5

Chỉ số của phần tử hiện tại được xử lý trong mảng.

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

6

Mảng

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7 đã được yêu cầu.

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

8 Tùy chọnOptional

Giá trị để sử dụng là

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 khi thực hiện

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0.

Giá trị trả về

Một mảng mới với mỗi phần tử là kết quả của chức năng gọi lại.

Sự mô tả

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7 gọi hàm

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0 được cung cấp một lần cho mỗi phần tử trong một mảng, theo thứ tự và xây dựng một mảng mới từ các kết quả.once for each element in an array, in order, and constructs a new array from the results.

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0 chỉ được gọi cho các chỉ mục mảng đã gán các giá trị. Nó không được gọi cho các khe trống trong các mảng thưa thớt.

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0 được gọi với ba đối số: giá trị của phần tử, chỉ số của phần tử và đối tượng mảng được ánh xạ.

Nếu một tham số

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

8 được cung cấp, nó sẽ được sử dụng làm giá trị

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 của Callback. Mặt khác, giá trị

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

6 sẽ được sử dụng làm giá trị

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 của nó. Giá trị

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 cuối cùng có thể quan sát được bởi

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0 được xác định theo các quy tắc thông thường để xác định

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 được nhìn thấy bởi một hàm.

Phương pháp

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

2 là một phương thức sao chép. Nó không thay đổi

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7.

Phương pháp

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

2 là chung chung. Nó chỉ mong đợi giá trị

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 có thuộc tính

const arrayLike = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
};
console.log(Array.prototype.map.call(arrayLike, (x) => x ** 2));
// [ 4, 9, 16 ]

6 và các thuộc tính được khóa.

Phạm vi của các phần tử được xử lý bởi

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7 được đặt trước khi gọi đầu tiên của

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0. Các yếu tố được gán cho các chỉ mục đã được truy cập hoặc các chỉ mục bên ngoài phạm vi, sẽ không được truy cập bởi

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0. Nếu các phần tử hiện tại của mảng được thay đổi sau cuộc gọi đến

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7, giá trị của chúng sẽ là giá trị tại thời điểm

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

0 truy cập chúng. Các yếu tố bị xóa sau cuộc gọi đến

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7 bắt đầu và trước khi được truy cập không được truy cập.

CẢNH BÁO: Sửa đổi đồng thời loại được mô tả trong đoạn trước thường xuyên dẫn đến mã khó hiểu và thường phải tránh (ngoại trừ trong các trường hợp đặc biệt). Concurrent modification of the kind described in the previous paragraph frequently leads to hard-to-understand code and is generally to be avoided (except in special cases).

Vì

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7 xây dựng một mảng mới, gọi nó mà không sử dụng mảng được trả về là một mẫu chống lại; sử dụng

const elems = document.querySelectorAll("select option:checked");
const values = Array.prototype.map.call(elems, ({ value }) => value);

4 hoặc

const elems = document.querySelectorAll("select option:checked");
const values = Array.prototype.map.call(elems, ({ value }) => value);

5 thay thế.

Ví dụ

Ánh xạ một mảng các số vào một mảng của rễ vuông

Mã sau đây lấy một mảng các số và tạo một mảng mới chứa rễ vuông của các số trong mảng đầu tiên.

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

Sử dụng bản đồ để định dạng lại các đối tượng trong một mảng

Mã sau đây lấy một mảng các đối tượng và tạo ra một mảng mới chứa các đối tượng mới được định dạng lại.

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

Ánh xạ một mảng số bằng cách sử dụng hàm chứa đối số

Mã sau đây cho thấy cách

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7 hoạt động khi một hàm yêu cầu một đối số được sử dụng với nó. Đối số sẽ tự động được gán từ mỗi phần tử của mảng dưới dạng các vòng

const kvArray = [
  { key: 1, value: 10 },
  { key: 2, value: 20 },
  { key: 3, value: 30 },
];

const reformattedArray = kvArray.map(({ key, value }) => ({ [key]: value }));

console.log(reformattedArray); // [{ 1: 10 }, { 2: 20 }, { 3: 30 }]
console.log(kvArray);
// [
//   { key: 1, value: 10 },
//   { key: 2, value: 20 },
//   { key: 3, value: 30 }
// ]

7 thông qua mảng gốc.

const numbers = [1, 4, 9];
const doubles = numbers.map((num) => num * 2);

console.log(doubles); // [2, 8, 18]
console.log(numbers); // [1, 4, 9]

Gọi bản đồ () trên các đối tượng không phải là

Phương thức

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

2 đọc thuộc tính

const arrayLike = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
};
console.log(Array.prototype.map.call(arrayLike, (x) => x ** 2));
// [ 4, 9, 16 ]

6 của

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

7 và sau đó truy cập vào từng chỉ mục số nguyên.

const arrayLike = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
};
console.log(Array.prototype.map.call(arrayLike, (x) => x ** 2));
// [ 4, 9, 16 ]

Sử dụng bản đồ () một cách chung chung trên một cái gật đầu

Ví dụ này cho thấy cách lặp lại thông qua một tập hợp các đối tượng được thu thập bởi

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

1. Điều này là do

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

1 trả về

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

3 (là một tập hợp các đối tượng).

Trong trường hợp này, chúng tôi trả về tất cả các giá trị của

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

4 đã chọn trên màn hình:

const elems = document.querySelectorAll("select option:checked");
const values = Array.prototype.map.call(elems, ({ value }) => value);

Một cách dễ dàng hơn sẽ là phương pháp

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

5.

Sử dụng map () trên các mảng thưa thớt

Một mảng thưa thớt vẫn còn thưa thớt sau

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

2. Các chỉ số của các khe trống vẫn còn trống trong mảng được trả về và chức năng gọi lại sẽ không được gọi trên chúng.

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

Sử dụng parseInt () với map ()

(Lấy cảm hứng từ bài đăng trên blog này)

Người ta thường sử dụng cuộc gọi lại với một đối số (phần tử đang đi qua). Một số chức năng nhất định cũng thường được sử dụng với một đối số, mặc dù chúng có các đối số tùy chọn bổ sung. Những thói quen này có thể dẫn đến những hành vi khó hiểu.

Consider:

["1", "2", "3"].map(parseInt);

Trong khi người ta có thể mong đợi

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

7, kết quả thực tế là

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

8.

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

9 thường được sử dụng với một đối số, nhưng mất hai. Thứ nhất là biểu thức và thứ hai là radix cho chức năng gọi lại,

["1", "2", "3"].map(parseInt);

0 chuyển 3 đối số:

phần tử
Chỉ số
Mảng

Đối số thứ ba bị bỏ qua bởi ____ ____ 69, nhưng không phải là câu nói thứ hai! Đây là nguồn gốc của sự nhầm lẫn có thể.

Dưới đây là một ví dụ ngắn gọn về các bước lặp:

// parseInt(string, radix) -> map(parseInt(value, index))
/* first iteration  (index is 0): */ parseInt("1", 0); // 1
/* second iteration (index is 1): */ parseInt("2", 1); // NaN
/* third iteration  (index is 2): */ parseInt("3", 2); // NaN

Sau đó, hãy nói về các giải pháp.

const returnInt = (element) => parseInt(element, 10);

["1", "2", "3"].map(returnInt); // [1, 2, 3]
// Actual result is an array of numbers (as expected)

// Same as above, but using the concise arrow function syntax
["1", "2", "3"].map((str) => parseInt(str)); // [1, 2, 3]

// A simpler way to achieve the above, while avoiding the "gotcha":
["1", "2", "3"].map(Number); // [1, 2, 3]

// But unlike parseInt(), Number() will also return a float or (resolved) exponential notation:
["1.1", "2.2e2", "3e300"].map(Number); // [1.1, 220, 3e+300]

// For comparison, if we use parseInt() on the array above:
["1.1", "2.2e2", "3e300"].map((str) => parseInt(str)); // [1, 2, 3]

Một đầu ra thay thế của phương thức bản đồ được gọi bằng

console.log(
  [1, , 3].map((x, index) => {
    console.log(`Visit ${index}`);
    return x * 2;
  })
);
// Visit 0
// Visit 2
// [2, empty, 6]

9 như một tham số chạy như sau:

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

0

Mảng ánh xạ chứa không xác định

Khi

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

6 hoặc không có gì được trả lại:

const numbers = [1, 4, 9];
const roots = numbers.map((num) => Math.sqrt(num));

// roots is now     [1, 2, 3]
// numbers is still [1, 4, 9]

1

Thông số kỹ thuật

Sự chỉ rõ
Thông số kỹ thuật ngôn ngữ Ecmascript # sec-array.prototype.map # sec-array.prototype.map

Tính tương thích của trình duyệt web

Bảng BCD chỉ tải trong trình duyệt

Xem thêm

Làm thế nào để bạn tạo một bản đồ mảng?

Để tạo một mảng từ bản đồ, chúng ta có thể sử dụng phương thức map.entries (). Hãy để NewIerable = Bản đồ. mục (Bản đồ); // Trả về có thể lặp lại với [khóa, giá trị] Các cặp hãy để newArray = mảng.use map. entries() method. let newIterable = map. entries(map); //return iterable with [key,value] pairs let newArray = Array.

Bạn có thể ánh xạ thông qua một mảng không?

Bản đồ () có thể được sử dụng để lặp qua các đối tượng trong một mảng và, theo cách tương tự như các mảng truyền thống, sửa đổi nội dung của từng đối tượng riêng lẻ và trả về một mảng mới. Việc sửa đổi này được thực hiện dựa trên những gì được trả về trong chức năng gọi lại. and, in a similar fashion to traditional arrays, modify the content of each individual object and return a new array. This modification is done based on what is returned in the callback function.

Làm thế nào để bạn vượt qua một mảng trên bản đồ?

Phương thức bản đồ của mảng JavaScript tạo ra một mảng mới bằng cách gọi chức năng gọi lại (chuyển hàm cho một hàm khác như một đối số) trên mỗi phần tử mà không thay đổi mảng gốc.Cú pháp của phương thức bản đồ mảng được hiển thị bên dưới: Myarr.calling a call-back function(passing a function to another function as an argument) on each and every element without changing the original array. The Syntax of the array map method is shown below: myArr.

Bản đồ trong JavaScript với ví dụ là gì?

Bản đồ là một tập hợp các phần tử trong đó mỗi phần tử được lưu trữ dưới dạng cặp khóa, giá trị.Đối tượng bản đồ có thể giữ cả đối tượng và giá trị nguyên thủy dưới dạng khóa hoặc giá trị.Khi chúng tôi lặp lại đối tượng bản đồ, nó trả về khóa, cặp giá trị theo cùng một thứ tự như được chèn.a collection of elements where each element is stored as a Key, value pair. Map object can hold both objects and primitive values as either key or value. When we iterate over the map object it returns the key, value pair in the same order as inserted.

programming javascript Map in JavaScript Map function JavaScript New Map JavaScript Hashmap JS Reduce js Map TypeScript

Hướng dẫn how do i map an array in javascript? - làm cách nào để ánh xạ một mảng trong javascript?

Ví dụ

số const = [65, 44, 12, 4]; const newarr = number.map (myfunction)

const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9] 2 gọi một hàm một lần cho mỗi phần tử trong một mảng.

const numbers = [1, 4, 9]; const roots = numbers.map((num) => Math.sqrt(num)); // roots is now [1, 2, 3] // numbers is still [1, 4, 9] 2 không thay đổi mảng ban đầu.

Tùy chọn. Mảng của phần tử hiện tại.

Sự mô tả

mục lục

Thử nó

Cú pháp

Thông số

Giá trị trả về

Sự mô tả

Ví dụ

Ánh xạ một mảng các số vào một mảng của rễ vuông

Sử dụng bản đồ để định dạng lại các đối tượng trong một mảng

Ánh xạ một mảng số bằng cách sử dụng hàm chứa đối số

Gọi bản đồ () trên các đối tượng không phải là

Sử dụng bản đồ () một cách chung chung trên một cái gật đầu

Sử dụng map () trên các mảng thưa thớt

Sử dụng parseInt () với map ()

Mảng ánh xạ chứa không xác định

Thông số kỹ thuật

Tính tương thích của trình duyệt web

Xem thêm

Làm thế nào để bạn tạo một bản đồ mảng?

Bạn có thể ánh xạ thông qua một mảng không?

Làm thế nào để bạn vượt qua một mảng trên bản đồ?

Bản đồ trong JavaScript với ví dụ là gì?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội