The following are the required syntax for developing 🔥.

let

Define a variable that is valid only in the same block of code as the “let”. In short, replace “var” with “let”.

{
  let a = 10;
  var b = 1;
}

a // ReferenceError: a is not defined.
b / / 1
Copy the code

const

Define a constant. The defined variable cannot be modified

const PI = 3.1415;
PI / / 3.1415

PI = 3;
// TypeError: Assignment to constant variable.
Copy the code

Array destruct assignment

let [a, b, c] = [1.2.3];

/ / equivalent
let a = 1;
let b = 2;
let c = 3;
Copy the code

Object

let { foo, bar } = { foo: 'aaa'.bar: 'bbb' };
foo // "aaa"
bar // "bbb"

let{ x, y, ... z } = {x: 1.y: 2.a: 3.b: 4 };
x / / 1
y / / 2
z // { a: 3, b: 4 }
Copy the code

Deconstruction and assignment of function parameters

function add([x, y]){
  return x + y;
}
add([1.2]); / / 3
Copy the code
function move({x, y} = { x: 0, y: 0 }) {
  return [x, y];
}
move({x: 3.y: 8}); / / [3, 8]
Copy the code

Template string

Variables can be gracefully inserted into strings.

const a = 'hello';
const b = `${a} Vue`;
// b == 'hello vue'
Copy the code

Default values for function arguments

function add(a,b=1){
	return a+b;
}

add(3) / / 4
Copy the code

Arrow function

function a(){
	return 'hello'
}

// Arrow function
const a = () = >{
	return 'hello';
}

// It can be even simpler
const a = () = >'hello'


Copy the code

The extension operator of an array

// equivalent to console.log(1,2,3);
console.log(... [1.2.3]);

// Merge the array
const a = [1.2.3];
const b = [...a,4.5]; / / [1, 2, 3, 4, 5]
Copy the code

A concise representation of object properties

const a = 1;

const obj = {a: 1};
/ / short
const obj = {a};  // {a: 1}
Copy the code

A concise representation of an object method

const obj = {
  say:function (){
  	return 'hello! '; }};// For short, omit ":function"
const obj = {
  say (){
  	return 'hello! '; }};Copy the code

Object property name expression

The property names of an object can support variables.

const a = 'abc';
let obj = {};
obj[`${a}123 `] = 1;
console.log(obj) // {abc123:1};
Copy the code

Chain judgment operator (?)

Implementation of “?” The expression on the left is null or undefined. If it is, stop immediately and return undefined or null.

const firstName = (message
  && message.body
  && message.body.user
  && message.body.user.firstName);

/ / short
constfristName = message? .body? .user? .firstName;Copy the code

Null judgment operator (??)

console.log(0 ?? 1); / / 0
console.log(false ?? 1); // false

console.log(undefined ?? 1); / / 1
console.log(null ?? 1); / / 1
Copy the code

Obviously only “??” Return “??” if the preceding value is null or undefined The following values.

Promise

Promise is a solution to asynchronous programming that makes more sense than the traditional “callback functions and events” solution. We use “async/await” in the development process, because most of the third party plug-ins we use are encapsulated in the Promise format, and there is very little need to encapsulate them.

// Encapsulate the code in the Promise format
const promiseA = () = > new Promise(function(resolve, reject) {
  
  // === your code ==
  setTimeout(() = >{
    if(0.5 < Math.random()){
    	resolve('success');
    } else {
    	reject('failure'); }},200);
  // === your code ==
  
});

/ / execution
promiseA().then(value= >{
	// 'success' == value
  console.log(value);
}).catch(error= >{
	// 'failed' == error
  console.log(error);
});
Copy the code

async/await

Use “promiseA “as an example:

function funA(){
  promiseA().then(value= >{
    console.log(value);
  }).catch(error= >{
    console.log(error);
  });
}

// Use a try/catch to catch an exception raised by "reject"
async function funA(){
  try{
    const value = await promiseA();
    console.log(value);
  } catch(error){
    console.log(error); }}Copy the code

More and more

Here I just explain a few common grammar, please refer to ruan Yifeng’s tutorial for more

⚡ Online Videos

www.bilibili.com/video/BV1Yw…

WeChat group

Thank you for reading, if you have any questions, you can add my wechat, AND I will pull you into the wechat group (because Tencent limits 200 people in the wechat group, after more than 200 people, the group members must pull you into the group)