JavaScript ES6新語法入門

1.let&const

let：聲明的變量是局部變量

const：聲明的變量是常量，不能被修改

var a = 10;

function run1(){

    var a = 20;

    console.info(a);

}

run1();

console.info(a);

//結果爲 : 

//20

//20



var a1 = 10;

function run2(){

    console.info(a1);

}

run2();

console.info(a1);

//結果爲 : 

//20

//20

使用let

let a = 10;

function run2(){

    let a = 20;

    console.info(a);

}

run2();

console.info(a);

//結果爲 : 

//10

//20



let a1 = 10;

function run3(){

    console.info(a1);

}

run3();

console.info(a1);

//結果爲 : 報錯,a未定義
//由於a是在run3函數外定義的,run3拿不到a的值

2.字符串擴展

ES6爲字符串擴展了幾個新API:

1)includes():返回布爾值,表示是否找到了這個字符串。

2)startsWith():返回布爾值，表示參數字符串是否在原字符串的頭部。

3)endsWith():返回布爾值，表示參數字符串是否在原字符串的尾部。

 

4）模板字符串

let a = "你好";

let b = "你們好";

let str = `holle ${a} 

           World ${b}`

//能夠直接換行空格

//能夠直接使用${變量名},插入變量
// 注: ` 符號在鍵盤上的esc的下面,1的左面,tab的上面

5)解構

//1.數組:
let arr = [1,2,3];
let [a,b,c] = arr;
console.info(`${a},${b},${c}`);
// 結果爲1,2,3
// 會直接將數組裏面的值拿出來,[a,b,c]至關於定義了三個變量

//2.對象:
//2.1
let obj = {name:'jack',age:18};
let {name,age} = obj;
console.info(name+","+age);
// 直接將對象中的字段拿出來了, 前提是必須對應對象中的字段

//2.2
let {name:username,age:userage} = obj;
console.info(username+","+userage);
// 拿出數據能夠給變量起別名

//2.3
let obj1 = {name:'jack',age:18};
let {name:username1 = 'rose',age:userage1 = 123,sex = '男'} = obj1;
console.info(`${username1},${userage1},${sex}`);
// 拿不到數據,能夠定義默認數據

//2.4
let obj2 = {name:'jack',age:18,sex:'男'};
let {name:username2,...property} = obj2;
console.info(`${username2}`);
console.info(property);//解構出來一個對象
//就不解釋了....



//js強大啊。。java何時也出個，哈哈

3.箭頭函數

//定義函數的簡寫方式:
//一個參數時:
var print = function (obj){
   console.info(obj);
}
//簡寫爲:
var paint = obj => console.info(obj);

//多個參數:
//兩個參數的狀況:
var sum = function(a,b){
   return a+b;
}

//簡寫:
var sum2 = (a,b) =>{
   return a+b;
}
console.info(sum2(1,2));


// 返回值爲一行代碼的狀況下: 必須省略return
var sum3 = (a,b) => a+b;
console.info(sum3(1,2));

//是否是特別簡單,告訴你,java中也有相似箭頭函數的語法,交lambda表達式,
//在我前幾天的博客中有寫,感興趣能夠去看,地址放在下面。

lambda表達式博客鏈接

舉例箭頭函數結合解構

 

let student = {

   name: "jack",
   age: 18
};

let run = ({name,age}) =>{
   console.info(name,age)
}

run(student);

//一個對象參數,一解構的方式傳入方法,使代碼更加簡化。。

4.map&reduce

//map: 
//接收一個函數,將原數組中的全部元素用這個函數處理後放入新數組返回

//舉例: 有個字符串數組,轉爲int數組
let arr = ['1','10','-1','5'];
console.info(arr);

arr = arr.map(a => parseInt(a));
console.info(arr);
//結果: [1,10,-1,5]

//reduce:
// 接收一個函數(必須)和一個初始化值(可選),該函數接收兩個參數:
// 參數一: 是上次reduce處理的結果
// 參數二: 是數組中要處理的下一個元素
// reduce() 會從左到右依次把數組中的元素用reduce處理, 並把處理的結果做爲下次
//   reduce的結果做爲下次reduce的第一個參數。若是是第一次，會把前兩個元素做爲計算參
//   數，或者把歐諾用戶指定的初始化值做爲起始參數。
//舉例:
const arr = [1,10,-1,5];
console.info(arr.reduce((a,b) => a+b));
//結果:19
console.info(arr.reduce((a,b) => a*b));
//結果:-300
console.info(arr.reduce((a,b) => a*b,-1));
//結果:300

有幫助點個贊啊o(*￣︶￣*)o