La syntaxe es6 est-elle une norme ?

La syntaxe ES6 est un standard. Le nom complet d'ES6 est ECMAScript 6, qui est une norme officiellement publiée pour le langage JavaScript. L'objectif de cette norme est de permettre au langage JavaScript d'être utilisé pour écrire des applications complexes à grande échelle et de devenir un langage de développement au niveau de l'entreprise. La relation entre ECMAScript et JavaScript est la suivante : le premier est une spécification du second et le second est une implémentation du premier.

L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.

Le nom complet d'ES6 est ECMAScript 6, qui est une norme officiellement publiée pour le langage JavaScript. L'objectif de cette norme est de permettre au langage JavaScript d'être utilisé pour écrire des applications complexes à grande échelle et de devenir un développement au niveau de l'entreprise. langue.

ES6 est un standard de nouvelle génération de langage JavaScript publié après ES5, ajoutant de nombreuses nouvelles fonctionnalités et syntaxe. Le standard a été publié en version officielle le 17 juin 2015 et a été officiellement nommé ES2015.

La relation entre ECMAScript et JavaScript est que le premier est une spécification du second, et le second est une implémentation du premier (d'autres dialectes ECMAScript incluent JScript et ActionScript)

En 2011, après la sortie de la version ECMAScript 5.1 , la formulation a commencé la version 6.0. Par conséquent, la signification originale du mot ES6 fait référence à la prochaine version du langage JavaScript. La première version d'ES6 a été publiée en juin 2015 et son nom officiel est « ECMAScript 2015 Standard » (ES2015 en abrégé). En juin 2016, la « norme ECMAScript 2016 » légèrement révisée (appelée ES2016) a été publiée comme prévu. Cette version peut être considérée comme la version ES6.1, car la différence entre les deux est très faible et elles sont fondamentalement identiques. standard. Selon le plan, la norme ES2017 sera publiée en juin 2017.

Par conséquent, ES6 est à la fois un terme historique et un terme général. Il désigne le standard de nouvelle génération de JavaScript après la version 5.1, couvrant ES2015, ES2016, ES2017, etc., et ES2015 est le nom officiel, faisant spécifiquement référence à la version publiée. cette année-là. La version officielle de la norme linguistique. Quand on parle d'ES6, on fait généralement référence à la norme ES2015, mais parfois on fait aussi référence au « langage JavaScript nouvelle génération » en général.

1. La portée du bloc construit let et const

La portée du bloc existe : à l'intérieur de la fonction, dans le bloc (c'est-à-dire : la zone entre les caractères "{" et "}")

Déclaration 1.let

• Il existe un mécanisme de promotion de variable pour les variables déclarées via var, mais les variables déclarées par let ne seront pas promues et la portée de la variable peut être limitée au bloc de code actuel

//通过var声明的变量
  //函数内部
        function changeState(flag) {
            if (flag) {
                var color = "red"
            } else {
                console.log(color);
                return null;
            }
        }
        changeState(false);
   //块中
        {
            var a = 1;
        }
        console.log("a=" + a);
   //for循环中
        for (var i = 0; i <p><img src="https://img.php.cn/upload/image/162/737/761/1666341173585140.png" title="1666341173585140.png" alt="La syntaxe es6 est-elle une norme ?"></p> <pre class="brush:php;toolbar:false"> //通过let声明的变量
            //函数内部
            function changeState(flag) {
                if (flag) {
                    let color = "red"
                } else {
                    console.log(color);
                    return null;
                }
            }
            changeState(false);
       
            //块中
            {
                let a = 1;
            }
            console.log("a=" + a);
      
            //for循环中
            for (let i = 0; i <p><img src="https://img.php.cn/upload/image/465/191/909/166634117986532La%20syntaxe%20es6%20est-elle%20une%20norme%20?" title="166634117986532La syntaxe es6 est-elle une norme ?" alt="La syntaxe es6 est-elle une norme ?"> </p>

• Dans la même portée, vous ne pouvez pas utiliser let pour déclarer à plusieurs reprises un identifiant existant, mais s'il est dans une portée différente, c'est possible.

// 在同一作用域下，不能使用let重复声明已经存在的标识符，但如果在不同的作用域下，则是可以的
    var a=0;
    var b=0;
    {
        let a=0;
    }
    let b=0;

• L'utilisation de let pour déclarer des variables peut empêcher la déclaration répétée de variables

 		var a=0;
        var a=10;//ok
        var b=1
        let b=100;

2. Déclaration const

• Chaque variable déclarée via le mot-clé const doit être déclarée en même temps. Initialisation.
• Déclarer un identifiant existant avec const dans la même portée provoquera également une erreur de syntaxe
• Utilisez const pour déclarer un objet. La liaison de l'objet lui-même ne peut pas être modifiée, mais les propriétés et les valeurs de l'objet peuvent être modifiées.

   	const person={
            name:"zhangSan"
        };
        person.name="lisi";	 //ok
        person.age=19;	//ok
        
        person={
            name:"wangwu"
        };

3. Liaison de portée de bloc global

• Les variables ou objets déclarés à l'aide de var dans la portée globale seront utilisés comme attributs de l'objet window dans l'environnement du navigateur (l'utilisation de var est susceptible d'écraser par inadvertance un Global existant propriétés)

 		var greeting="welcome";
        console.log(window.greeting);
        console.log(window.Screen);
        var Screen="liquid crystal";
        console.log(window.Screen);

• Utilisez let ou const pour déclarer des variables et des constantes afin d'éviter de remplacer les propriétés de l'objet window

 		let greeting="welcome";
        console.log(window.greeting);
        console.log(window.Screen);
        const Screen="liquid crystal";
        console.log(window.Screen==Screen);

Résumé

• 通过var声明的变量存在变量提升机制，而let声明的变量不会被提升，可将变量的作用域限制在当前代码块中
• 在同一作用域下，不能使用let重复声明已经存在的标识符，但如果在不同的作用域下，则是可以的
• 使用let声明变量，可以防止变量的重复声明
• 每个通过const关键字声明的变量必须在声明的同时进行初始化
• 在同一作用域下用const声明已经存在的标识符也会导致语法错误
• 使用const声明对象，对象本身的绑定不能修改，但对象的属性和值是可以修改的
• 在全局作用域中使用var声明的变量或对象，将作为浏览器环境中的window对象的属性（使用var很可能会无意中覆盖一个已经存在的全局属性）
• 使用let或const声明变量和常量，避免覆盖window对象的属性

二、解构赋值

解构赋值是对赋值运算符的扩展。

他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。

在代码书写上简洁且易读，语义更加清晰明了；

也方便了复杂对象中数据字段获取。

//1、数组解构
// 传统
let a = 1, b = 2, c = 3
console.log(a, b, c)
// ES6
let [x, y, z] = [1, 2, 3]
console.log(x, y, z)
/*********************************************************************************************************/
/*********************************************************************************************************/
//2、对象解构
let user = {name: 'Johon', age: 18}
// 传统
let name1 = user.name
let age1 = user.age
console.log(name1, age1)
// ES6
let { name, age } = user//注意：解构的变量必须和user中的属性同名
console.log(name, age)

三、模板字符串

模板字符串相当于加强版的字符串，用反引号 `,除了作为普通字符串，还可以用来定义多行字符串，

还可以在字符串中加入变量和表达式。

// 字符串插入变量和表达式。变量名写在 ${} 中，${} 中可以放入 JavaScript 表达式。
let name = 'Kuangshen'
let age = 27
let info = `My Name is ${name},I am ${age+1} years old next year.`
console.log(info)
// My Name is Kuangshen,I am 28 years old next year.

四、声明对象简写

const age = 12
const name = '小王'
// 传统
const person1 = {age: age, name: name}
console.log(person1)
// ES6
const person2 = {age, name}
console.log(person2) //{age: 12, name: '小王'}

五、定义方法简写

// 传统
const person1 = {
sayHi:function(){
console.log('Hi')
}
}
person1.sayHi();//'Hi'
// ES6
const person2 = {
sayHi(){
console.log('Hi')
}
}
person2.sayHi() //'Hi'

六、对象拓展运算符

符号 (...)

let person = {nameL:"oAk",age:23}
let someone1 = persion // 引用赋值
let someone2 = { ...person } // 对象拷贝
someone1.name = 'oAk_OLD'
someone2.name = 'oAk_NEW'
console.log(persion) // {name:'oAk_OLD', age:23}
console.log(someone1) // {name:'oAk_OLD', age:23}
console.log(someone2) // {name:'oAk_NEW', age:23}

【相关推荐：javascript视频教程、编程视频】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!