Is es6 a framework?

es6 is not a framework, but a JavaScript language standard. es6 is the 6th version of ECMAScript. It is a script programming language standardized by Ecma International (an international membership system for information and telecommunications standards organizations) through ECMA-262; it is the core of the scripting language JavaScript, providing the syntax and syntax of the language. Basic objects.

The operating environment of this tutorial: Windows 7 system, ECMAScript version 6, Dell G3 computer.

es6 is not a framework, but a JavaScript language standard.

es6 stands for ECMAScript6 (the 6th version of ECMAScript). It is a JavaScript language standard officially released in June 2015. It is officially called ECMAScript 2015 (ES2015). Its goal is to enable the JavaScript language to be used to write complex large-scale applications and become an enterprise-level development language.

AndECMAScript is a script programming language standardized by Ecma International through ECMA-262. This language is widely used on the World Wide Web. It is often called JavaScript or JScript, so it can be understood as a standard for JavaScript, but in fact the latter two are implementations and extensions of the ECMA-262 standard.

The relationship between JavaScript and ECMAScript

Sometimes people regard JavaScript and ECMAScript as the same, but in fact they are not. JavaScript contains far more content than ECMA-262 There are much more provisions in it. Complete JavaScript is composed of the following three parts:

• Core (ECMAScript): Provides the syntax and basic objects of the language;

• Document Object Model (DOM): Provides methods and interfaces for processing web content;

• Browser Object Model (BOM): Provides methods and interfaces for interacting with the browser interface.

ECMAScript is the core of JavaScript, describing the basic syntax of the language (var, for, if, array, etc.) and data types (numbers, strings, Boolean, functions, objects ( obj, [], {}), null, undefined), ECMAScript is a set of standards that defines what a language (such as JS) looks like.

ECMAScript is defined by ECMA-262. ECMAScript is an internationally recognized standard scripting language specification that has no dependency on Web browsers. The ECMA-262 standard mainly stipulates that the language consists of the following components:

• Syntax

• Variables and data types

• Keywords and reserved words

• Operators

• Control statements

• Object

ECMAScript 6 has basically become the industry standard. Its popularity is much faster than ES5. The main reason is that modern browsers support ES6 very quickly, especially Chrome and Firefox. Browsers already support most features in ES6. [Recommended learning: javascript advanced tutorial]

Why should you learn ES6? What is ES6 used for?

ES5 cannot meet the current situation where the front-end is becoming more and more complex and huge. It can be said to be outdated. ES6 is an enhancement and upgrade to ES5.

1. Mainstream browsers have fully supported ES6

2. Newer front-end frameworks in the industry have fully used ES6 syntax

3. WeChat applet , uni-app, etc. are all based on ES6 syntax

4. Starting from employment, small and medium-sized companies, full stack, one more skill on the resume, and the trial period can also get started faster.

Variable

• let
  Only one let variable can be declared in a scope. If the child If a let variable is also declared in the scope, it will not affect the let variable in the parent scope.
• var
  Multiple var variables can be declared in one scope. If a var variable is also declared in the child scope, it will also affect the var variable in the parent scope.
• const
  Constant, equivalent to final, cannot be modified.
• global
  Variables that do not declare a variable type default to global variables (window attributes).

Object-oriented

• ##Principle The object-oriented feature of JavaScript is based on prototypes and constructor ones, which are different from common class-based ones. JavaScript does not provide language-level features of object inheritance, but does so through prototype copying.
  
• Three methods of creating objects

  1. {pojo}（实例变量、实例方法、get、set） 
  2. function（实例变量、实例方法、prototype、apply、call） 
  3. class（实例变量、实例方法、prototype、extends、super）

prototype

Only functions and classes Only prototypes exist, and their significance lies in dynamically adding instance variables and instance methods and implementing inheritance.

inherit

• call/apply
  应用在继承关系中，子类向父类传参时应用此关键字
• extends
  继承关系中使用，A extends B，则A是B的父类
• super
  在子类中调用父类的方法时应用次关键字
• ES5继承方式
  接下来我们手写一套组合继承（原型链继承（继承原型） + 构造继承（继承属性））。这种方式即可避免原型链继承中无法实现多继承，创建子类实例时，无法向父类构造函数传参的弊端，也可避免构造继承中不能继承原型属性/方法的弊端。

function Person(name,age){                                             /* 父类 */
    this.name = name || 'father';                            //实例变量
    this.namesonF = this.nameson;
    this.age = age;
    this.talk = function(){alert("talk");};                 //实例方法
};
function Son(name){                                                     /* 子类 */
    this.nameson = name || 'son';
    // Person.call(this,'name',18);                          //继承：构造继承，复制父类的实例属性给子类，不能继承原型属性/方法
    Person.apply(this,['name',18]);                          //继承：构造继承，复制父类的实例属性给子类，不能继承原型属性/方法
}
// Son.prototype = new Person("zhangsan",19);                   //继承：原型链继承，父类的实例作为子类的原型，拷贝属性两次，不合理
Son.prototype = Person.prototype;                            //继承：原型链继承，父类的实例作为子类的原型

Person.prototype.publicParam="param1";                       //动态添加实例变量
Person.prototype.talk=function(){alert("talk");}            //动态添加实例方法

var son = new Son();                                         //实例化对象，调用构造函数(constructor)

• ES6继承方式
  ES6的继承创造了一种新的写法，与Java、Scala等语言非常类似，默认使用组合继承（原型链继承（继承原型） + 构造继承（继承属性））的方式。

class Point {
    constructor(x, y) {
        this.x = x;                                           //实例变量
        this.y = y;
    }
}
class Son extends Point {
    constructor(z, w) {
        super(z,w);
        this.z = z;                                           //实例变量
        this.w = w;
    }
}
var son = new Son(1,2);

arrow functions

箭头函数，是ES6中新加入的语法，于Java的lambda，scala的函数式语法非常相似

• 代码

var single = a => console.log(a);
var single = (a) => (console.log(a));
var single = (a, b) => {console.log(a + b)};
var single = (a, b) => {return a + b};

template string

模版字符串，字符串拼接的新语法

• 代码

var templateStr = () => {
    var str1 = "adsf\nsdfa";

    var template1 = `<ul><li>first</li> <li>second</li></ul>`;

    var x = 1;
    var y = 2;
    var template2 = `${x} + ${y} = ${x + y}`;

    var template3 = `${lettest4()}`;
    console.log(str1)
    console.log(template1)
    console.log(template2)
    console.log(template3)
}

destructuring

重构/解构，变量交互的语法

• 代码

var destructuring = () => {
    var [a,b,...c]=[1,2,3,4,5,6,7,8,9,10];
    let [temp="replaceString"] = ["tempString"];
    let [age2, [{name: fname},{age: fname2="replaceString"}]] = [20, [{name: 'qc'},{}]];
    const [aa,bb,cc,dd,ee,ff]="hello";

    let {name="replaceName",age,id}={name:'cursor',age:19,id:'vc6dfuoc91vpdfoi87s'};
    let {type:tipType,min:minNumber}={type:'message',min:20};
    let {sin,cos,tan,log}=Math;

    var fun = function({x,y}={}){return [x,y];}
    fun({x:100,y:2});

    [a,b]=[b,a];                                        //交换

    var map = [1,2,3]
    var map=new Map();
    map.set("id","007");
    map.set("name","cursor");
    for(let [key,value] of map){}
    for(let [key] of map){}
    for(let [,value] of map){}

    var arr = [1,2,3,4]
    for(let val of arr){val}

}

arguments

实参，ES6中加入的直接读取参数的变量

• 代码

function argumentsTest(a,b) { 
	for(let val of arguments)
		{console.log(val)
	}
}

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

The above is the detailed content of Is es6 a framework?. For more information, please follow other related articles on the PHP Chinese website!