Home >Web Front-end >JS Tutorial >Detailed syntax of ES6

Detailed syntax of ES6

巴扎黑
巴扎黑Original
2017-09-11 11:48:323654browse

First, define the variable let (similar to var)

There has always been a bug in js which is var:

1. Variables declared by var will have variable promotion


console.log(name);  //jhonvar name = 'jhon';

2. Var does not have block-level scope


var name2 = 'jjjon';
{    var name2 = 'tom';
}
console.log(name2);     //tom

3. var can be used to define a variable multiple times, and the subsequent variable replaces the previous variable


var name3 = 'jond';var age = 18;var name3 = 19;var name3 = 'rose';
console.log(name3);     //rose

Newly defined variables let:

1. Variables declared by let will not be promoted. They can only be used later if they are defined in the front.


console.log(name4);     //报错let name4 = '1112';

2. let has block-level scope


let name5 = '222';
{
    let name5 = ' ttt';
}
console.log(name5);  //222

3. let cannot redefine a variable multiple times


let name6 = 'aa';
let name6 = 'bb';    //报错console.log(name6);  //aa

Second, const declares a constant

Constant: refers to data that will not change

1. The value cannot be changed


const pi = 3.01415;//pi = 3;     //报错
    {
        const arr = [5,6,8,9,];
        arr.push(7);
        console.log(arr);  //(5) [5, 6, 8, 9, 7]
        arr = 10;     //值不能改变,否则报错
    }

2. Constants have block-level scope


{
    const ban = "vin";
}
console.log(ban);     //报错

3. There is no variable promotion, declare first and then use


console.log(ba);     //报错const ba = 'liu';

4. Constants with the same name cannot be declared

5. An initial value must be assigned, otherwise an error will be reported


const bb;     //报错

6. If an object is declared, the address of the object cannot be changed, but its internal attributes can be changed


const obj = {
    na:"jjjj",
    age:20};
console.log(obj.na);  //jjjjobj.na = "ccs";
console.log(obj.na);  //ccs

For example: application scenarios, fixed addresses can use constants


// var path = 1122// var path = '1243';const path = 'path';
console.log(path);  //path

3. String expansion

1. Determine whether the string "hello word" exists "word"


var str = 'hello word';var result = str.indexOf('word');
console.log(result);  //6

2. ES6 provides includes(): returns a Boolean value, used to determine whether the string contains certain characters


var bool = str.includes('word');
console.log(bool);    //true

3, startsWith(str[,num]): Returns a Boolean value, used to determine whether the string starts with a certain character


 bool2 = str.startsWith('hello'

//Pass in 2 parameters to this method
var bool3 = str.startsWith('word',6);
console.log(bool3); //true

4, endsWith(str[,num]): Returns a Boolean value, used to determine whether the string ends with certain characters


var bool4 = str.endsWith('d');
console.log(bool4);  //true//给这个方法传入两个参数var bool5 = str.endsWith('o',7);
console.log(bool5);  //false

5, repeat(num): Pass in a number, this method will repeat the string the number of times corresponding to the number


var str322= '我爱我家,\n';
console.log(str322.repeat(3));        //3行 我爱我家,

Four, 5.0 template syntax:`Template string`


var obj33 = {
    name:'zhuzhu',
    age:18,
    sex:'男',
    hobby:'女',
    veight:120,
    height:180};// 字符串拼接方法var str4 = '大家好,我叫:'+obj33.name+',今年'+obj33.age+',性别'+obj33.sex+',爱好'+obj33.hobby+'。';
console.log(str4);        //大家好,我叫:zhuzhu,今年18,性别男,爱好女。// 但是字符串的拼接太麻烦了,有没有简单的方法来解决这个问题呢,有的,模板字符串就可以了var temp111 = `大家好,我叫${obj33.name},今年${obj33.age},性别${obj33.sex},爱好${obj33.hobby}`;
console.log(temp111);    //大家好,我叫zhuzhu,今年18,性别男,爱好女//1,可以是变量let name8 = "美女";
let temp22 = `我叫${name8}`;
console.log(temp22);    //我叫美女// 2,可以是方法function getName(){    return "宝宝";
}
let temp3 = `我叫${getName()}`;
console.log(temp3);        //我叫宝宝// 3,可以是表达式let aa = 1 ;
let bb = 2;
let temp4 = `a + b=${aa+bb}`;
console.log(temp4);        //a + b=3

Five, 6.0 Arrow function: ( )=>{}


// 最原始函数var arr = [2,3,5,7];
 $(arr).each(function(index,item){
   console.log(item);
 }); // 箭头函数改造// 改造一:匿名函数中的funtion关键字我们可以省略,参数与方法体之间中=>$(arr).each((index,item)=>{console.log(item);})
 // 改造二:如果方法体中的代码只有一句我们可以去掉{},并且代码结尾的分号要去掉$(arr).each((index,item) =>console.log(item));

The above is the detailed content of Detailed syntax of ES6. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn