1. 首頁 > 生活百科 > >

1 Python全棧工程師之從網頁搭建入門到Flask全棧項目實戰 - ES6標準入門和Flex布局

生活百科python

1.簡述1.什么是ES6？ES6，全稱 ECMAScript 6.0 ， 是 JavaScript 的下一個版本標準，2015年6月份發版 。ES6的主要目的是為了解決 ES5 的先天不足 。
2.了解ES和JS之間的關系

    • ES = ECMAScript 是一個動態腳本語言的‘標準’，JS = JavaScript是對ES的標準，默認，主流的‘實現’，由于商標權的問題，歐洲計算機協會制定的語言標準不能叫做JS，只能叫ES；
    • ES6新標準的目的是：使得JS可以用來開發大型的Web應用，成為企業級開發語言 。而企業級開發語言就是：適合模塊化開發，擁有良好的依賴管理；

1 Python全棧工程師之從網頁搭建入門到Flask全棧項目實戰 - ES6標準入門和Flex布局

文章插圖
3.為什么要學
  • 更嚴謹的語法，更高效的編碼
  • 更新的特性 ， 更多的功能
  • 主流的瀏覽器都已經全面支持ES6
  • 行業內較新的前端框架都已經全面使用ES6的語法
  • 微信小程序,uni-app等都是基于ES6的語法
  • 從就業出發，中小型公司，全棧，簡歷上多一個技能，試用期也能更快的上手 。

1 Python全棧工程師之從網頁搭建入門到Flask全棧項目實戰 - ES6標準入門和Flex布局

文章插圖
4.前置知識鋪墊了解(筆記會具體詳述)
  • ES6 let 與const
    • let 和 const 是ES6新增的兩個重要的JavaScript關鍵字 。
    • let聲明的變量只能在let命令所在的代碼塊內有效
    • const聲明一個只讀的常量，一旦聲明，常量的值就不可以改變了 。意味著一旦聲明必須初始化 ， 否則就會報錯 。
  • let和var的區別：
    • let只在自己聲明的作用域有效，var是在全局作用域有效，盡量少用var，盡量可能的用let，因為var沒有封裝，容易污染別人的代碼 。
    • 同名的變量里，let不能重復聲明，且只能聲明一次 。var可以聲明多次 。for循環內改用let，而不是var 。
    • let嚴格遵守代碼的順序 ， 不存在變量提升 。而var聲明的變量，會忽略聲明的順序，可以變量提升 。
  • ES6 Map 與 Set
    • Map對象保存鍵值對 。任何值(對象或者原始值) 都可以作為一個鍵或一個值 。Map 中的key：Key是（字符串，對象 ， NaN ， 函數） 。
    • Set 對象允許存儲任何類型的唯一值，不管是原始值還是對象引用的 。對象存儲的值總是唯一的，需要判斷兩個值是否相等 。
  • Maps 和 Objects 的區別：
    • 一個Object 的鍵只可以是字符串或者 Symbols，而一個Map 的鍵可以是任意值 。
    • Map中的鍵值是有序的（FIFO原則），而添加到對象中的鍵則不是 。
    • Map的鍵值可以對個數從 size 屬性獲取 ， 而Object 的鍵值對個數只能手動計算 。
    • Object都有自己的原型 ， 原型鏈上的鍵名可能會和你自己在對象上的設置的鍵名產生沖突 。
2.ES6的變量及解構賦值2.1.ES6變量與常量聲明1）變量聲明
var a=100let b='hello'/*let的三大特性：1.不存在變量提升，必須要先聲明，再使用;2.不能重復聲明3.塊級作用域，變量只在代碼內有效*/ 2）常量聲明
const PAGE_SIZe=100const PI = 3.1415926/*const的三大特征：1.聲明必須賦值(必須初始化)2.常量是只讀的，不能重新賦值3.塊級作用域，常量只在代碼內有效、*/2.2.ES6解構賦值1）數組的解構賦值
  • 按順序將值賦值給對應的變量
    • 示例
let [a,b,c] = [1,2,3]console.log(a)console.log(b)console.log(c)


    • 實例
let a = [1,2,3]let [a1,a2,a3] = aconsole.log(a1) //1console.log(a2) //2console.log(a3) //3
  • ...三個點表示解構運算符，將剩余的內容賦值
    • 示例
let [c,...d] = [1,2,3]console.log(c) //1console.log(d) //[2,3]

推薦閱讀