ES6基本使用(語法和js差不多,這里制只做區別)
-
let變數和var變數的區別
- 作用域
- js定義變數為var,var定義的變數,代碼塊里外都能用
- es6定義變數為let,let定義的變數,只能在當前代碼塊里面使用
- 特點
- var可多次定義同一變數
- let只能定義一次變數,不能在定義同一個變數
- 作用域
-
const常量
- const定義變數時,需要賦值,復制之后就是一個常量,不能再改變了
-
資料型別解構
- 陣列解構
//傳統寫法 let a=1,b=2,c=3 console.log(a, b, c) //es6寫法 let [x,y,z] = [10,20,30] console.log(x, y, z) - 物件解構
//定義物件 let user = {"name":"lucy","age":20} //傳統從物件里面獲取值 let name1 = user.name let age1 = user.age console.log(name1+"=="+age1) //es6獲取物件值,定義的變數必須和物件的鍵一致 let {name,age} = user console.log(name+"**"+age)
- 陣列解構
-
模板字串
- 自動換行
let str1 = `hello, es6 demo up!` - 其里面可使用運算式獲取變數值
let name = "Mike" let age = 20 let str2 = `hello,${name},age is ${age+1}` - 呼叫方法
function f1() { return "hello f1" } let str3 = `demo, ${f1()}`
- 自動換行
-
物件簡寫
- 只有鍵值對的變數名稱一致,es6才可以簡寫
const age = 12 const name = "lucy" //傳統方式定義物件 const p1 = {name:name,age:age} // console.log(p1) //es6定義變數 const p2 = {name,age} console.log(p2)
- 只有鍵值對的變數名稱一致,es6才可以簡寫
-
方法簡寫
- 省略:function
//傳統方式定義的方法 const person1 = { sayHi:function(){ console.log("Hi") } } //呼叫 person1.sayHi() //es6 const person2 = { sayHi(){ console.log("Hi") } }
- 省略:function
-
物件拓展運算子
- 物件復制
let person1 = {"name":"lucy","age":20} let person2 = {...person1} - 物件合并
let name = {name:'mary'} let age = {age:30} let p2 = {...name,...age}
- 物件復制
-
箭頭函式
//1.傳統方式創建方法 //引數 => 函式體 var f1 = function(m) { return m } //使用箭頭函式改造 var f2 = m => m //2.復雜一點方法 var f3 = function(a, b) { return a+b } //使用箭頭函式 var f4 = (a,b) => a+b
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/432013.html
標籤:JavaScript
上一篇:影像檢索技術怎樣準如“雷達”,從一張到億張精準定位圖片違規?
下一篇:聊聊動效降級
