ES6實用的六個知識點

一、模板語言

var str  = `
    var a = 1;
    console.log(a)
`;

let userName = "Dean";
console.log( ` I'm ${userName } ` ) ; //  I'm Dean

二、var let const

塊級做用域:數組

{
    let a = 1;
    var b = 2;
}
console.log(a)  // a is not defined
console.log(b)  // 2

const定義的是常量
(const聲明的變量,內存地址不能夠改變,可是空間的值能夠改)promise

let a = 1;
a = 2;
const b = 2;
b = 3;  // 報錯:  Assignment to constant variable (常量不能改變)

三、解構賦值

const {
    resName,
    resPosition,
    parkAreaNum,
    parkStationNum,
    resDesImg
} = resProduct.data;

Object.assign(vm, {
    resName,
    resPosition,
    parkAreaNum,
    parkStationNum,
    resDesImg
});

傳統的寫法是: vm.resName = resProduct.data.resName異步

四、Spread Operator 展開運算符

function sum(...m){
      let total = 0;
      for(var i of m) {
        total += i;
      }
      console.log(`total: ${total}`)
    }
sum(4,5,6,9);

數組code

const color = ["red", "yellow"];
const colorful = [...color, "green", "pink"];
console.log(colorful); //[red, yellow, green, pink]

對象對象

const alp = { fist: "a", second: "b" };
const alphabets = { ...alp, third: "c" };
console.log(alphabets); //{ "fist": "a", "second": "b", "third": "c"

五、promise

function runAsync1() {
    var p = new Promise(function(resolve, reject) {
        //作一些異步操做
        setTimeout(function() {
            console.log('異步任務1執行完成');
            resolve('數據1');
        }, 1000);
    });
    return p;
}

function runAsync2() {
    var p = new Promise(function(resolve, reject) {
        //作一些異步操做
        setTimeout(function() {
            console.log('異步任務2執行完成');
            resolve('數據2');
        }, 2000);
    });
    return p;
}

function runAsync3() {
    var p = new Promise(function(resolve, reject) {
        //作一些異步操做
        setTimeout(function() {
            console.log('異步任務3執行完成');
            resolve('數據3');
        }, 2000);
    });
    return p;
}

runAsync1()
  .then(function(data) {
    console.log(data);
    return runAsync2();
  })
  .then(function(data) {
    console.log(data);
    return runAsync3();
  })
  .then(function(data) {
    console.log(data);
  });

六、import、export

import util from "../../js/util.js";
export default {
    name: 'home',
    data () {},
    methods: {}
}

(若有不足之處,請多指教)內存

相關文章
相關標籤/搜索