麻豆黑色丝袜jk制服福利网站-麻豆精品传媒视频观看-麻豆精品传媒一二三区在线视频-麻豆精选传媒4区2021-在线视频99-在线视频a

千鋒教育-做有情懷、有良心、有品質的職業教育機構

手機站
千鋒教育

千鋒學習站 | 隨時隨地免費學

千鋒教育

掃一掃進入千鋒手機站

領取全套視頻
千鋒教育

關注千鋒學習站小程序
隨時隨地免費學習課程

當前位置:首頁  >  行業資訊  > JavaScript全解析——Map和Set數據結構和ES6模塊化語法

JavaScript全解析——Map和Set數據結構和ES6模塊化語法

來源:千鋒教育
發布人:zyh
時間: 2023-06-01 15:52:00 1685605920

  Map和Set數據結構

JavaScript全解析

  ●ES6 新增的兩種數據結構

  ●共同的特點: 不接受重復數據

  Set數據結構

  ●是一個 類似于 數組的數據結構

  ●按照索引排列的數據結構

  創建 Set 數據結構

  語法: var s = new Set([ 數據1, 數據2, 數據3, ... ])

  Set 數據結構的屬性和方法

  ●size 屬性

  ○語法: 數據結構.size

  ○得到: 該數據結構內有多少個數據

  ●add() 方法

  ○語法: 數據結構.add(數據)

  ○作用: 向該數據結構內添加數據

  ●has() 方法

  ○語法: 數據結構.has(數據)

  ○返回值: 一個布爾值

  ■true, 表示該數據結構內有該數據

  ■false, 表示該數據結構內沒有該數據

  ●delete() 方法

  ○語法: 數據結構.delete(數據)

  ○作用: 刪除該數據結構內的某一個數據

  ●clear() 方法

  ○語法: 數據結構.clear()

  ○作用: 清除該數據結構內所有數據

  ●forEach() 方法

  ○語法: 數據結構.forEach(function (value, key, origin) {})  

// 創建 Set 數據結構
var s = new Set([ 100, 200, 300 ])
console.log(s)
// Set 的屬性和方法
// 1. size
console.log(s.size)
// 2. add()
var o = { name: 'Jack' }
s.add({ name: 'Jack' })
s.add(o)
console.log(s)
// 3. has()
console.log(s.has(200))
console.log(s.has(o))
// 4. delete()
s.delete(300)
s.delete(o)
console.log(s)
// 5. clear()
s.clear()
console.log(s)
// 6. forEach()
s.forEach(function (item, value, origin) {
console.log('我執行了', item, value, origin)
})

  Map數據結構

  ●是一個類似于對象的數據結構, 但是他的 key 可以是任何數據類型

  ●可以被叫做一個 值=值 的數據結構

  創建一個 Map 數據結構

JavaScript全解析

  語法: var m = new Map([ [ key, value ], [ key, value ] ])

  Map 數據結構的屬性和方法

  ●size 屬性

  ○語法: 數據結構.size

  ○得到: 該數據結構內有多少個數據

  ●set() 方法

  ○語法: 數據結構.set(key, value)

  ○作用: 向該數據結構內添加數據

  ●get() 方法

  ○語法: 數據結構.get(key)

  ○返回值: 數據結構內該 key 對應的 value

  ●has() 方法

  ○語法: 數據結構.has(key)

  ○返回值: 一個布爾值

  ■true, 該數據結構內有該數據

  ■false, 該數據結構內沒有該數據

  ●delete() 方法

  ○語法: 數據結構.delete(key)

  ○作用: 刪除該數據結構內的某一個數據

  ●clear() 方法

  ○語法: 數據結構.clear()

  ○作用: 清除該數據結構內所有數據

  ●forEach() 方法

  ○語法: 數據結構.forEach(function (value, key, origin) {})  

// 創建 Map 數據結構
var m = new Map([ ['a', 100], [ { name: 'Jack' }, { name: 'Rose' } ] ])
console.log(m)
// 屬性和方法
// 1. size
console.log(m.size)
// 2. set 方法
m.set('b', 200)
var a = [ 100 ]
m.set(a, [ 200 ])
console.log(m)
// 3. get 方法
console.log(m.get('b'))
console.log(m.get(a))
// 4. has 方法
console.log(m.has('b'))
console.log(m.has({ name: 'Jack' }))
// 5. delete 方法
m.delete(a)
console.log(m)
// 6. clear()
m.clear()
console.log(m)
// 7. forEach()
m.forEach(function (value, key, origin) {
console.log(value, key, origin)
})

  ES6模塊化語法

  開發的歷史演變

  ●最早: 一個 js 文件

  ○每一個 html 文件對應一個 js 文件

  ●后來: 把一個項目內部的重復功能提取出來

  ○寫成一個單獨的 js 文件

  ●再后來:

  ○決定按照功能拆分出一個一個的文件

  ○a.js : 專門做頂部導航欄各種功能

  ○b.js : 專門做二級菜單

  ○c.js : 專門做搜索引擎

  ○d.js : 左側邊欄

  ○e.js : 輪播圖

  ●最后在每一個 頁面 準備有一個整合的 js 文件

  ●在頁面中引入js文件的時候一定要在script表橋中添加一個type = module屬性

  ○就是專門用來組合這個頁面使用了多少個 js 文件模塊

  ○此時, 我們管每一個 js 文件叫做一個 模塊

  ○頁面的完整功能, 就是由一個一個的模塊來完成的

  ○這就叫做 模塊化 開發

  ●學到這里大家應該知道,一個模塊就是實現特定功能的文件,有了模塊,我們就可以更方便地使用別人的代碼,想要什么功能,就加載什么模塊

JavaScript全解析

  模塊化開發的規則

  ●如果你想使用 ES6 的模塊化開發語法

  ○頁面必須在服務器上打開。本地打開不行

  ○vscode 下載插件, live server

  ○打開頁面的時候, 鼠標右鍵 open with live server*

  ●當你使用了 模塊化語法以后

  ○每一個 js 文件, 都是一個獨立的 文件作用域

  ○該文件內的所有變量和方法, 都只能在這個文件內使用

  ○其他文件不能使用

  ○如果像使用, 需要導出

  ●每一個 js 文件, 也不能使用任何其他 js 文件內部的變量

  ○如果像使用,那么你需要導入該文件

  語法: 導出和導入

  ●導出語法:

  ○export default { 你要導出的內容 }

  ●導入語法:

  ○import 變量 from 'js文件路徑

tags: ES6模塊化
聲明:本站稿件版權均屬千鋒教育所有,未經許可不得擅自轉載。
10年以上業內強師集結,手把手帶你蛻變精英
請您保持通訊暢通,專屬學習老師24小時內將與您1V1溝通
免費領取
今日已有369人領取成功
劉同學 138****2860 剛剛成功領取
王同學 131****2015 剛剛成功領取
張同學 133****4652 剛剛成功領取
李同學 135****8607 剛剛成功領取
楊同學 132****5667 剛剛成功領取
岳同學 134****6652 剛剛成功領取
梁同學 157****2950 剛剛成功領取
劉同學 189****1015 剛剛成功領取
張同學 155****4678 剛剛成功領取
鄒同學 139****2907 剛剛成功領取
董同學 138****2867 剛剛成功領取
周同學 136****3602 剛剛成功領取
相關推薦HOT
開班信息
北京校區
  • 北京校區
  • 大連校區
  • 廣州校區
  • 成都校區
  • 杭州校區
  • 長沙校區
  • 合肥校區
  • 南京校區
  • 上海校區
  • 深圳校區
  • 武漢校區
  • 鄭州校區
  • 西安校區
  • 青島校區
  • 重慶校區
  • 太原校區
  • 沈陽校區
  • 南昌校區
  • 哈爾濱校區
主站蜘蛛池模板: 麻豆国产精品va在线观看不卡| 久久99久久99精品| 公交车上性配合享受视频| 萌白酱喷水视频| 国产乱码精品一区二区三区四川人| 好男人在线社区www| 把数学课代表按在地上c视频| 全彩里番acg海贼王同人本子| 成人毛片全部免费观看| 欧美激情一区二区三区蜜桃视频| 品色堂永久免费| 99久久国产综合精麻豆| 伊人快播| 欧美黑人xxxx性高清版| 亚洲国产精品一区二区久久| 久久精品一区二区三区不卡| 国产在线视频www色| a级毛片高清免费视频| 在线免费观看色片| 亚洲女初尝黑人巨高清| 2018国产大陆天天弄| 国产悠悠视频在线播放| 日本v电影| 篠田优在线一区中文字幕| 久久这里只精品99re免费| xl上司带翻译无马赛樱花| 护士的诱惑电影| 美女张开腿让男人桶的视频| 亚洲一区二区三区免费| 一个男的操一个女的| 日本bbw搡bbbb搡bbbb| 把胡萝卜立着自己坐上去| 日日日操| 免费观看黄页| 女人被男人狂躁视频免费| 大象视频在线免费观看| 性美国xxxxx免费| 日本电影娼年| 波多野结衣1048系列电影| 国产欧美va欧美va香蕉在线 | 黑人异族日本人hd|