今日讯!es6是不是框架

时间:2022-11-16 18:55:00       来源:PHP中文网

本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

es6不是框架,而是一种JavaScript语言的标准。


(资料图)

es6全称ECMAScript6(ECMAScript的第6个版本),是于2015年6月正式发布的JavaScript语言的标准,正式名为ECMAScript 2015(ES2015)。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

ECMAScript是一种由Ecma国际通过ECMA-262标准化的脚本程序设计语言。这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,所以它可以理解为是JavaScript的一个标准,但实际上后两者是ECMA-262标准的实现和扩展。

JavaScript 与 ECMAScript 的关系

有时人们会将 JavaScript 与 ECMAScript 看作是相同的,其实不然,JavaScript 中所包含的内容远比 ECMA-262 中规定的多得多,完整的 JavaScript 是由以下三个部分组成:

核心(ECMAScript):提供语言的语法和基本对象;

文档对象模型(DOM):提供处理网页内容的方法和接口;

浏览器对象模型(BOM):提供与浏览器进行交互的方法和接口。

而ECMAScript是JavaScript的核心,描述了语言的基本语法(var、for、if、array等)和数据类型(数字、字符串、布尔、函数、对象(obj、[]、{})、null、未定义),ECMAScript是一套标准,定义了一种语言(比如JS)是什么样子。

ECMAScript是由ECMA-262定义的ECMAScript是一种在国际认可的标准的脚本语言规范,与Web浏览器没有依赖关系。ECMA-262标准主要规定了这门语言由以下组成部分:

语法

变量和数据类型

关键字和保留字

操作符

控制语句

对象

ECMAScript 6 目前基本成为业界标准,它的普及速度比 ES5 要快很多,主要原因是现代浏览器对 ES6 的支持相当迅速,尤其是 Chrome 和 Firefox 浏览器,已经支持 ES6 中绝大多数的特性。【推荐学习:javascript高级教程】

为什么要学ES6?ES6的用处是什么?

ES5不能满足目前前端越来越复杂,庞大的现状,可以说已经过时了,ES6是对ES5的增强和升级。

1.主流的浏览器都已经全面支持ES6

2.行业内较新的前端框架都已经全面使用ES6的语法

3.微信小程序,uni-app等都是基于ES6的语法

4.从就业出发,中小型公司,全栈,简历上多一个技能,试用期也能更快的上手。

变量

let一个作用域中只能声明一个let变量,若子作用域中也声明了let变量,则不影响父作用域中的let变量。var一个作用域中可以声明多个var变量,若子作用域中也声明了var变量,也在影响父作用域中的var变量。const常量,相当于final,不可被修改。global不声明变量类型的变量默认为全局变量(window属性)。

面向对象

原理JavaScript 的面向对象特性是基于原型和构造函数的,与常见的基于类的不同。JavaScript 没有 提供对象继承的语言级别特性,而是通过原型复制来实现的。三种创建对象方法
1. {pojo}(实例变量、实例方法、get、set)   2. function(实例变量、实例方法、prototype、apply、call)   3. class(实例变量、实例方法、prototype、extends、super)
登录后复制

prototype

只有函数、class才有原型,意义在于动态添加实例变量和实例方法及实现继承。

继承

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 = `
  • first
  • second
`; 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视频教程、编程视频】

以上就是es6是不是框架的详细内容,更多请关注php中文网其它相关文章!

关键词: 实例方法 构造函数 数据类型