Bản đồ trong JavaScript – hàm bản đồ trong javascript là gì

Cổng thông tin Khoa học Máy tính dành cho những người yêu thích máy tính. Nó bao gồm các bài báo về khoa học máy tính và lập trình được viết tốt, được tư duy tốt và được giải thích tốt, các câu đố và thực hành / lập trình cạnh tranh / các câu hỏi phỏng vấn công ty.

Bạn đang xem : chức năng bản đồ trong javascript là gì

Trong bài viết này, chúng ta sẽ thảo luận về đối tượng Bản đồ được cung cấp bởi > ES6 . 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 một cặp. đối tượng có thể giữ cả hai giá trị dưới dạng khóa hoặc giá trị. Khi chúng ta lặp qua đối tượng bản đồ, nó sẽ trả về cặp khóa, giá trị theo thứ tự như đã chèn.

Cú pháp:

  new Map ( [nó]) 

 Thông số: 
nó - Nó là bất kỳ đối tượng có thể lặp lại nào có giá trị được lưu trữ dưới dạng
     khóa, cặp giá trị,
     Nếu tham số không được chỉ định thì một bản đồ mới sẽ được tạo
     là trống

 Trả lại: 
Đối tượng Bản đồ mới 

Bây giờ, hãy tạo một số Bản đồ bằng cách sử dụng đối tượng Bản đồ

Javascript

< p class = "ring-load" id = "run-and-edit-loader">

< / p>

var map1 = new Bản đồ ([[1, 2], [2, 3], [4, 5]]); < / p>

console.log ( " Map1 " );

console.log (map1);

< p class = "line number10 index9 alt1">

var map2 = new Bản đồ ([[ "firstname" , "sumit" ],

[ "lastname" , "ghosh" ], [ "trang web" , "geeksforgeeks" ]]);

console.log ( " Map2 " );

console.log (map2);

var map3 = new < / code> Bản đồ ([[ "số nguyên" , [1, 2, 3 , 4]],

[ "Số thập phân" , [1.1, 1.2, 1.3, 1.4]],

[ " số âm " , [-1, -2, -3, -4]]]);

console.log ( " Map3 " );

console.log (map3);

< p class = "line number34 index33 alt1">

var map4 = new Bản đồ ([[[ " tên " , "last name" ],

< code class = "undefined space"> [ "sumit" , < / code> "ghosh" ]],

[[ "friend 1" , "friend 2" ],

< code class = "undefined space"> [ "sourav" , < / code> "gourav" ]]]);

console.log ( "Map4" );

console.log (map4);

< p class = "code-editor-container">

 
 

Đầu ra :

Output_1_1 Ouput_1_2

Thuộc tính:

Map.prototype.size - Nó trả về số phần tử hoặc các cặp khóa-giá trị trong bản đồ.

Phương thức:

1. Map.prototype.set () - Nó thêm khóa và giá trị vào Đối tượng Bản đồ.

Cú pháp:

  map1.set (k, v); 

 Thông số: 
k - Khóa của phần tử được thêm vào Bản đồ
v - giá trị của phần tử được thêm vào Bản đồ

 Trả lại: 
Nó trả về một đối tượng Bản đồ 

2. Map.prototype.has () - Nó trả về giá trị boolean tùy thuộc vào việc giá trị được chỉ định có hiện diện hay không.

Cú pháp:

  map1.has (k); 

 Thông số: 
k - Khóa của phần tử cần kiểm tra

 Trả lại: 
true nếu phần tử có khóa được chỉ định có mặt
hoặc nếu không trả về false. 

3. Map.prototype.get () - Nó trả về

Cú pháp tương ứng:

  map1.get (k) ; 

 Thông số: 
k - Khóa, có giá trị được trả về

 Trả lại: 
Giá trị được liên kết với khóa, nếu nó hiện diện
trong Bản đồ, nếu không sẽ trả về không xác định 

4. Map.prototype.delete () - Nó xóa cả cái cũng như cái khỏi bản đồ.

Cú pháp:

  map1.delete (k); 

 Thông số: 
k - Khóa sẽ bị xóa khỏi bản đồ

 Trả lại: 
true nếu giá trị được tìm thấy và bị xóa khỏi
ngược lại, bản đồ trả về false 

5. Map.prototype.clear () - Xóa tất cả các phần tử khỏi đối tượng Bản đồ.

Cú pháp:

  map1.clear (); 

 Thông số: 
Không có thông số

 Trả lại: 
undefined 

Hãy sử dụng tất cả các phương pháp được mô tả ở trên:

Ví dụ:

Javascript

< p class = "ring-load" id = "run-and-edit-loader">

< / p>

var map1 = new Map ();

map1.set ( " tên " , " sumit " );

map1.set ( "họ" , "ghosh" );

map1.set ( "trang web" , "geeksforgeeks" )

.set ( "friend 1" , "gourav" )

.set ( "friend 2" , "sourav" );

console.log (map1); < / code>

bảng điều khiển .log ( "map1 có trang web không?" +

map1.has ( " trang web " ));

console.log ( "map1 có bạn 3 không? " +

map1.has ( "friend 3" ));

console.log ( "lấy giá trị cho trang web quan trọng" +

map1.get ( "website" < / code> ));

console.log ( "lấy giá trị cho người bạn chính 3" +

map1.get ( " bạn 3 " ));

console.log ( "xóa phần tử có trang web chính"

+ map1 . xóa ( "trang web" ));

console.log ( "map1 có trang web không? " +

map1.has ( "trang web" ));

console.log (< / code> "xóa phần tử có trang web chính" +

map1. xóa (< / code> "friend 3" ));

< / p>

map1.clea r ();

console.log (map1);

 
 

Đầu ra:

 Đầu ra_2

6. Map.prototype.entries () - Nó trả về một đối tượng có chứa cặp cho mỗi phần tử có trong đối tượng Bản đồ.

Cú pháp:

  map1.entries (); 

 Thông số: 
Không có thông số

 Trả lại: 
Nó trả về một đối tượng trình lặp 

7. Map.prototype.keys () - Nó trả về một đối tượng chứa tất cả những gì có trong Đối tượng Bản đồ.

Cú pháp:

  map1.keys (); 

 Thông số: 
Không có tham số

 Trả lại: 
Đối tượng trình lặp 

8. Map.prototype.values ​​() - Nó trả về một đối tượng chứa tất cả những gì hiện có trong Đối tượng Bản đồ.

Cú pháp:

  map1.values ​​(); 

 Thông số: 
Không có tham số

 Trả lại: 
Đối tượng trình lặp 

Cho phép sử dụng tất cả các phương pháp được mô tả ở trên:

Ví dụ:

Javascript


var map1 = new Map ();

map1.set ( "tên" , "sumit" );

map1.set ( "họ" < / code> , "bóng mờ" );

map1.set ( "trang web" , "geeksforgeeks" ) < / code>

. set ( "friend 1" , "gourav" ) < / code>

. set ( "friend 2" , "sourav" );

< / p>

var get_entries = map1.entries ();

< / p>

console.log ( "---------- mục nhập --------- " );

đối với ( var ele of get_entries)

console.log (ele);

var get_keys = map1.keys (); < / code>

console.log ( " -------- các phím ---------- " );

cho ( var ele of get_keys)

console.log (ele);

< p class = "line number39 index38 alt2">

var get_values ​​= map1.values ​​();

< p class = "line number46 index45 alt1">

console.log ( "---------- giá trị ------------" );

cho ( var ele of get_values)

console.log (ele);

 
 

Đầu ra:

Output_3

9. Map.prototype.forEach () - Nó thực thi chức năng một lần cho mỗi cặp trong Bản đồ, theo thứ tự chèn.

Cú pháp:

  map1.forEach (callback, [thisArgument]); 

 Thông số: 
callback - Đây là một hàm được thực thi cho từng phần tử của Bản đồ.
thisargument - Giá trị được sử dụng làm giá trị này khi thực hiện lệnh gọi lại.

 Trả lại: 
undefined 

Hàm gọi lại được cung cấp với ba tham số như sau:

  • phần tử
  • phần tử
  • đã duyệt qua

Ví dụ:

Javascript

var map1 = new Map ();

map1.set ( "tên" , "sumit" );

map1.set ( "họ" , " ghosh " );

map1.set ( " trang web " , "geeksforgeeks" )

. set ( "friend 1" , "gourav" ) ​​

. set ( "friend 2" , "sourav" );

< / code>

function printOne (giá trị)

{

console.log (giá trị);

}

console.log ( "----- một tham số -----" );

map1.forEach (printOne); < / p>

function printTwo (giá trị, khóa)

{

console.log (key + "" + giá trị);

}

console.log ( "----- hai tham số -----" );

map1.forEach (printTwo);

function printThree (giá trị, khóa, bản đồ)

{

console.log (key + "" + giá trị);

console.log (map);

}

< p class = "line number47 index46 alt2">

console.log ( " ----- ba tham số ----- " );

map1.forEach (printThree);

 
 

Đầu ra:

 Output_4_1 Output_4_2

Lưu ý: Trong ví dụ trên, chúng tôi sử dụng một hàm gọi lại đơn giản chỉ in một phần tử trong bảng điều khiển, nó có thể là thiết kế ed để thực hiện bất kỳ hoạt động phức tạp nào theo yêu cầu.

10. Map.prototype [@@ iterator] () - Nó trả về một hàm là phương thức của đối tượng Bản đồ theo mặc định.

Cú pháp:

  map1 [Symbol.iterator] 

 Thông số: 
Không có thông số

 Trả lại: 
Trả về một đối tượng trình vòng lặp bản đồ và nó là
entry () theo mặc định 

Ví dụ:

Javascript

var map1 = new Map ();

map1.set ( "tên" , "sumit" );

map1.set ( " họ " , " bóng mờ " );

map1.set ( "trang web" < / p>

. set ( "bạn 1" , "gourav" ) < / p>

. set ( "bạn 2" , "sourav" );

< p class = "line number14 index13 alt1"> var getit = map1 [Symbol.iterator] ();

< / p>

cho ( var < / code> elem của getit)

console.log (elem);

 
 

Đầu ra:

Output_5

< p> 11. Bản đồ được sử dụng để lặp lại các mảng

Cú pháp:

  arr.map (function (value, index) {}) < / strong>

 Thông số: 
value = phần tử mảng
           index = chỉ số của mảng
           
 Trở lại: 
Giá trị đã sửa đổi của các phần tử 

Ví dụ:

Javascript

< / p>

let arr = [1,2,3,4,5]

let arr1 = [];

arr1 = arr.map ((value, idx) = & gt; {

console.log ( "giá trị" < / code>

return value * 2;

})

console.log ();

bảng điều khiển. log ( "arr =" + arr);

console.log ( " arr1 = " + arr1);

 
 

Đầu ra:

<… Lưu ý :- Chúng tôi có thể tạo người dùng defi ne có thể lặp lại thay vì sử dụng tham chiếu mặc định.

Tham chiếu:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

JavaScript được biết đến nhiều nhất để phát triển trang web nhưng nó cũng được sử dụng trong nhiều môi trường không có trình duyệt. Bạn có thể học JavaScript từ đầu bằng cách làm theo Hướng dẫn JavaScript này và Ví dụ về JavaScript .


Ghi chú cá nhân của tôi


Xem thêm những thông tin liên quan đến chủ đề hàm bản đồ trong javascript là gì

JavaScript Array Map Method Practice in 5 Minutes

alt

  • Tác giả: James Q Quick
  • Ngày đăng: 2021-01-05
  • Đánh giá: 4 ⭐ ( 9590 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Arrays are an essential part of JavaScript. If you want to get better at JavaScript, you have to know how to effectively use arrays, especially the built-in array methods like map, reduce, filter, sort, every, some, etc. In this series, we'll cover the JavaScript array methods you need to know to become a web developer.

    Learn to use the Map() function to transform items in an array.

    Array Worksheet - bit.ly/jqq-array-practice
    Join the 💬 Discord Server 💬 - https://discord.gg/vM2bagU
    _____________________________________________

    Newsletter 🗞
    Interested in exclusive content and discounts? 🤯 Sign up for the newsletter!
    https://www.jamesqquick.com
    _____________________________________________

    Connect with me 😀
    Live streams on Twitch - https://twitch.tv/jamesqquick
    Follow me on Twitter - https://www.twitter.com/jamesqquick
    Join the 💬 Discord Server 💬 - https://discord.gg/vM2bagU
    _____________________________________________

    COURSES 💻
    Learn how to build Fullstack apps with React and Serverless Functions - https://www.jamesqquick.com/courses/react-and-serverless-fullstack-developmnent
    Learn everything you need to know about Visual Studio Code - https://www.udemy.com/learn-visual-studio-code/
    Build a Quiz App - https://www.udemy.com/build-a-quiz-app-with-html-css-and-javascript/

Xử lý Object trong JavaScript

  • Tác giả: vi-magento.com
  • Đánh giá: 4 ⭐ ( 7752 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài viết này chúng ta sẽ tìm hiểu về cách xử lý Object trong JavaScript nhé. Kiểu Object là kiểu được sử dụng nhiều nhất vì tính linh...

Hàm là gì? Hàm trong JavaScript

  • Tác giả: completejavascript.com
  • Đánh giá: 4 ⭐ ( 7960 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Function JavaScript (hàm trong JavaScript) là một thành phần không thể thiếu. Hàm giúp chương trình trở nên rõ ràng, dễ hiểu. Vậy hàm là gì?

Javascript là gì? Những điều cơ bản nhất về Javascript

  • Tác giả: arena.fpt.edu.vn
  • Đánh giá: 4 ⭐ ( 8745 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Nếu bạn chưa biết thì Javascript là ngôn ngữ lập trình phổ biến nhất trên thế giới trong suốt 20 năm qua. Hãy cùng FPT Arena tìm hiểu chi tiết về Javascript nhé

Hàm trong javascript

  • Tác giả: toidicode.com
  • Đánh giá: 3 ⭐ ( 2888 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Ở cách phần trước chúng ta đã được tìm hiểu qua các khái niệm và cách sử dụng các câu lệnh rẽ nhánh, và vòng lặp Bài hôm nay chúng ta sẽ tiếp tục đi tìm hiểu khái niệm hàm và cách sử dụng hàm trong javascript.

Mọi Thứ Bạn Cần Biết Về Function - Javascript

  • Tác giả: codelearn.io
  • Đánh giá: 5 ⭐ ( 4361 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Các hàm (Function) là một trong những nền tảng cơ bản trong Javascript. Vậy bạn đã nắm hết những kiến thức về Function trong Javascript chưa?

Hàm trong JavaScript

  • Tác giả: hanoiict.edu.vn
  • Đánh giá: 3 ⭐ ( 2769 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài hướng dẫn tự học Javascript này, bạn sẽ học cách định nghĩa và gọi một hàm trong JavaScript. Cách thêm tham số, truyền đối số, hàm khai báo, hàm biểu thức...

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Đối tượng - tạo phiên bản của các loại - tạo một đối tượng trong c #