一、let、var和const的區別
let:用法類似於var,但所宣告的變數,只在let
所在的**塊內有效,不存在變數提公升,存在塊級作用域,存在暫時性死區,變數一定要在宣告後使用。
var:用於宣告變數,用var
宣告的變數既是全域性變數,也是頂層變數,在**塊之外呼叫亦生效,存在變數提公升,不存在塊級作用域,變數在宣告之前可使用。
const:宣告乙個唯讀的常量。一旦宣告,常量的值就不能改變。const一旦宣告變數,就必須立即初始化,不能留到以後賦值。不存在變數提公升,存在塊級作用域,存在暫時性死區,變數一定要在宣告後使用。
二、陣列擴充套件
1.array.from
方法用於將兩類物件轉為真正的陣列:類似陣列的物件(array-like object)和可遍歷(iterable)的物件(包括es6新增的資料結構set和map),可以接受第二個引數,用來對每個元素進行處理,將處理後的值放入返回的陣列。
2.array.of
方法用於將一組值,轉換為陣列,彌補陣列建構函式array()
的不足。
3.array
方法沒有引數、乙個引數、三個引數時,返回結果都不一樣。只有當引數個數不少於2個時,array()
才會返回由引數組成的新陣列。引數個數只有乙個時,實際上是指定陣列的長度
array.from([1, 2, 3])等同於array.of(1, 2, 3)
三、解構賦值
解構賦值:針對陣列或者物件進行模式匹配,然後對其中的變數進行賦值,簡潔且易讀,語義更加清晰明了;也方便了複雜物件中資料字段獲取。
1. 陣列解構:陣列中提取值,按照對應位置,對變數賦值
//*****== 基本解構let [a, b, c] = [1, 2, 3]
//*****== 巢狀解構
let [a, [[b], c]] = [1, [[2], 3]]
//*****== 預設值解構
let [value=1]= [undefined]
//*****== 不完全解構
let [value=1]= [undefined]
//*****== 剩餘運算子
let [a, ...b] = [1, 2, 3]
2. 物件解構:物件的解構與陣列有乙個重要的不同。陣列的元素是按次序排列的,變數的取值由它的位置決定;而物件的屬性沒有次序,變數必須與屬性同名,才能取到正確的值
//*****== 基本let = ;
//*****== 巢狀
let ] } = ] }
//*****== 忽略
let ] }= ] }
//*****== 剩餘運算子
let =
//*****== 預設值
let =
//*****== 不完全解構
let , x ] } = ] }
變數的解構賦值用途很多。
(1)交換變數的值
let x = 1;let y = 2;
[x, y] = [y, x];
上面**交換變數x
和y
的值,這樣的寫法不僅簡潔,而且易讀,語義非常清晰。
(2)從函式返回多個值
函式只能返回乙個值,如果要返回多個值,只能將它們放在陣列或物件裡返回。有了解構賦值,取出這些值就非常方便。
// 返回乙個陣列function example()
var [a, b, c] = example();
// 返回乙個物件
function example() ;
}var = example();
(3)函式引數的定義
解構賦值可以方便地將一組引數與變數名對應起來。
// 引數是一組有次序的值function f([x, y, z])
f([1, 2, 3]);
// 引數是一組無次序的值
function f()
f();
(4)提取json資料
解構賦值對提取json物件中的資料,尤其有用。
var jsondata = ;let = jsondata;
console.log(id, status, number);
// 42, "ok", [867, 5309]
上面**可以快速提取json資料的值。
(5)函式引數的預設值
jquery.ajax = function (url, ,cache = true,
complete = function () {},
crossdomain = false,
global = true,
// ... more config
}) ;
指定引數的預設值,就避免了在函式體內部再寫var foo = config.foo || 'default foo';
這樣的語句。
(6)遍歷map結構
任何部署了iterator介面的物件,都可以用for...of
迴圈遍歷。map結構原生支援iterator介面,配合變數的解構賦值,獲取鍵名和鍵值就非常方便。
var map = new map();map.set('first', 'hello');
map.set('second', 'world');
for (let [key, value] of map)
// first is hello
// second is world
如果只想獲取鍵名,或者只想獲取鍵值,可以寫成下面這樣。
// 獲取鍵名for (let [key] of map)
// 獲取鍵值
for (let [,value] of map)
(7)輸入模組的指定方法
載入模組時,往往需要指定輸入那些方法。解構賦值使得輸入語句非常清晰。
const = require("source-map");
ES6 變數解構
es6允許按照一定的模式,從陣列和物件中提取值,對變數進行賦值,這被稱為解構 destructuring 語法 let a,b,c 1,2,3 console.log a,b,c 1 2 3 順序 從陣列中取值,按照對應位置,對變數取值,這種寫法屬於 匹配模式 只要等號兩邊模式相同,左邊的變數就會被...
ES6學習筆記 變數的解構賦值
let foo,bar baz 1,2 3 foo 1 bar 2 baz 3本質上,這種寫法屬於 模式匹配 只要等號兩邊的模式相同,左邊的變數就會被賦予對應的值 let x,y,z a x a y undefined z var foo foo undefined var bar,foo 1 ba...
ES6 變數的解構賦值學習筆記
陣列的解析賦值 本質為 模式匹配 如果解構不成功,變數的值就等於undefined var foo var bar,foo 1 foo的值為undefined let x,y,z a x a y undefined z let a,b d 1,2,3 4 上面的例子為不完全解構,但是可以成功。如果等...