摘要:聲明的變量不得改變值,這意味著,一旦聲明變量,就必須立即初始化,不能留到以后賦值。解構賦值允許按照一定模式,從數組和對象中提取值,對變量進行賦值,這被稱為解構。對象的解構賦值對象的屬性沒有次序,變量必須與屬性同名。
ES6 新增特性整理講解
新增命令
1.let命令
ES6新增了let命令,用來聲明變量。它的用法類似于var,但是也存在新的特性。
- **let所聲明的變量,只在let命令所在的代碼塊內有效。適用于for循環**
var a = 3; var a = 4; let b = 4; { var a = 5; let b = 5; //作用域僅在代碼塊內部 let c = "this is inner c"; var d = "this is inner d"; console.log(b); //b = 5 } console.log(a); //a = 5 console.log(b); //b = 4 console.log(d); //this is inner d console.log(c); //c is not defined
for循環
按理說,在執行完for循環后,應該釋放變量的值,否則可能會對全局變量造成影響,因此,聲明為let,會更好。
//使用var 聲明 var result = 0; for(var i = 0;i<100;i++){ result += i; }; console.log(result); //5050 console.log(i); //101
//使用let 聲明 var result = 0; for(let i = 0;i<100;i++){ result += i; }; console.log(result); //5050 console.log(i); // i is not defined
- **不存在變量提升**
//先操作 console.log("var變量提升",a); //undefined console.log("let沒有變量提升",b); //報錯:b is not defined //再聲明 var a = 3; let b = 4;
- **暫時性死區**
var tmp = 123; if (true) { tmp = "abc"; // ReferenceError let tmp; }
- **不允許重復聲明** ``` var a = 3; var a = 4; let b = 4; let b = 5; //TypeError:Duplicate declaration "b" console.log(a);//a = 4 console.log(b); ```
2.const命令
基本用法:const聲明一個只讀常量。一旦聲明,常量的值就不能改變。類似于Java中的final關鍵字。
const PI = 3.1415; PI = 3; // TypeError: Assignment to constant variable
const聲明的變量不得改變值,這意味著,const一旦聲明變量,就必須立即初始化,不能留到以后賦值。
const foo; // SyntaxError: Missing initializer in const declaration
其余特點與let一樣,具有不能重復聲明,具有塊級作用域,暫時性死區。
解構賦值
ES6 允許按照一定模式,從數組和對象中提取值,對變量進行賦值,這被稱為解構(Destructuring)。例如:
let [a, b, c] = [1, 2, 3];
本質上,這種寫法屬于“模式匹配”,只要等號兩邊的模式相同,左邊的變量就會被賦予對應的值。如果解構不成功,變量的值就等于undefined。另一種情況是不完全解構,即等號左邊的模式,只匹配一部分的等號右邊的數組。這種情況下,解構依然可以成功。
1.對象的解構賦值
a>對象的屬性沒有次序,變量必須與屬性同名。
在ES5中
var obj ={ name = "tom, age = 12, }; var name = obj.name; var age = obj.age;
在ES6中
let {name:name,age:age} = obj; let{name,age} = obj; console.log(name,age);
b>如果變量名與屬性名不一致,必須寫成下面這樣。
var { foo: baz } = { foo: "aaa", bar: "bbb" }; //baz = "aaa”
c>嵌套解構
let obj = { p: [ "Hello", { y: "World" } ] }; let { p: [x, { y }] } = obj; //x = "Hello”; y = "World”
d>默認值(默認值生效的條件是,對象的屬性值嚴格等于undefined)
var {x: y = 3} = {}; y // 3
2.數組的解構賦值
let [a, b, c] = [1, 2, 3];
a>不完全解構
let [a, [b], d] = [1, [2, 3], 4]; //a = 1; b = 2; d = 4
b>集合解構
let [head, ...tail] = [1, 2, 3, 4]; //head = 1; tail = [2, 3, 4]
c>默認值(當匹配值嚴格等于undefined時,默認值生效)
let [x, y = "b"] = ["a"]; // x="a", y="b’
d>默認值也可以為函數
function f() { console.log("aaa"); } let [x = f()] = [1]; let [a,b,...c] = ["terry","lerry","tom","jack"]; console.log(a); //terry; console.log(b); //lerry; console.log(c); //["tom","jack"]
3.字符串的解構賦值
a>解構時,字符串被轉換成了一個類似數組的對象。
const [a, b, c, d, e] = ‘hello’; //a=h;b=e;c=l;d=l;e=o
b>也可以對數組的屬性解構
let {length : len} = ‘hello’; //len = 5
c> 數值和布爾值解構賦值
解構時,如果等號右邊是數值和布爾值,則會先轉為對象 let {toString: s} = 123; //s === Number.prototype.toString true let {toString: s} = true; //s === Boolean.prototype.toString true
4.函數參數的解構賦值
基本語法:
function add([x, y]){ return x + y; } add([1, 2]);
默認值:
function move({x = 0, y = 0} = {}) { return [x, y]; } move({x: 3, y: 8}); // [3, 8] move({x: 3}); // [3, 0] move({}); // [0, 0] move(); // [0, 0]
解構賦值的常見用途
1.交換變量的值
let x = 1; let y = 2; [x, y] = [y, x];
2.從函數返回多個值
function example() { return [1, 2, 3]; } let [a, b, c] = example();
3.函數參數的定義
function f([x, y, z]) { ... } f([1, 2, 3]);
4.提取JSON數據
let jsonData = { id: 42, status: "OK", data: [867, 5309] }; let { id, status, data: number } = jsonData;
5.輸入模塊的指定方法
const { SourceMapConsumer, SourceNode } = require("source-map");
6.函數參數的默認值
jQuery.ajax = function (url, { async = true, cache = true, global = true, beforeSend = function () {}, complete = function () {}, // ... more config }) { // ... do stuff };
7..指定參數的默認值,就避免了在函數體內部再寫var foo = config.foo || "default foo";這樣的語句
遍歷map結構
var map = new Map(); map.set("first", "hello"); map.set("second", "world"); for (let [key, value] of map) { console.log(key + " is " + value); }
--------------------------------------------------------------------本次結束-------------------------
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/52440.html
摘要:聲明的變量不得改變值,這意味著,一旦聲明變量,就必須立即初始化,不能留到以后賦值。解構賦值允許按照一定模式,從數組和對象中提取值,對變量進行賦值,這被稱為解構。對象的解構賦值對象的屬性沒有次序,變量必須與屬性同名。 ES6 新增特性整理講解 新增命令 1.let命令 ES6新增了let命令,用來聲明變量。它的用法類似于var,但是也存在新的特性。 - **let所聲明的變量,只在le...
摘要:知識點總結一,,能重復聲明,有前置功能。淺拷貝一個數組設置原型。永遠是唯一的,不可能和別的重復,可以阻止對象的屬性被篡改前面不能使用操作符。和的區別鍵名可以是任何數據類型初始化的時候必須一次性指定鍵名和鍵值。 es6知識點總結(一) let,var,const var:能重復聲明,有前置功能。 let:有塊級作用域,沒有前置功能,不能重復聲明。 const:有塊級作用域,用來聲明常量(...
摘要:結合工作中使用情況,簡單對進行一些復習總結,包括常用的語法,等,以及短時間內要上手需要重點學習的知識點不同工作環境可能有一些差別,主要參考鏈接是阮一峰的博客以及外文博客阮老師大部分文章是直接翻譯的這個博客簡介先說一下,是一個標準化組織,他們 結合工作中使用情況,簡單對es6進行一些復習總結,包括常用的語法,api等,以及短時間內要上手需要重點學習的知識點(不同工作環境可能有一些差別),...
閱讀 3146·2021-11-22 12:01
閱讀 3767·2021-08-30 09:46
閱讀 784·2019-08-30 13:48
閱讀 3209·2019-08-29 16:43
閱讀 1657·2019-08-29 16:33
閱讀 1847·2019-08-29 13:44
閱讀 1410·2019-08-26 13:45
閱讀 2228·2019-08-26 11:44