一 ES6 即 ECMAScript6

  ECMAScript 6.0(以下简称ES6)是JavaScript语言的下一代标准,已经在2015年6月正式发布了。它的目标,是使得JavaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

二  ECMAScript和JavaScript的关系

  一个常见的问题是,ECMAScript和JavaScript到底是什么关系?

要讲清楚这个问题,需要回顾历史。1996年11月,JavaScript的创造者Netscape公司,决定将JavaScript提交给国际标准化组织ECMA,希望这种语言能够成为国际标准。次年,ECMA发布262号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言称为ECMAScript,这个版本就是1.0版。

该标准从一开始就是针对JavaScript语言制定的,但是之所以不叫JavaScript,有两个原因。一是商标,Java是Sun公司的商标,根据授权协议,只有Netscape公司可以合法地使用JavaScript这个名字,且JavaScript本身也已经被Netscape公司注册为商标。二是想体现这门语言的制定者是ECMA,不是Netscape,这样有利于保证这门语言的开放性和中立性。

因此,ECMAScript和JavaScript的关系是,前者是后者的规格,后者是前者的一种实现(另外的ECMAScript方言还有Jscript和ActionScript)。日常场合,这两个词是可以互换的。

三 ES6的常用方法

  1 模板字符串,拼接变量使用`${变量名}`.

<script>
var name = 'tony';
var age = '';
console.log(`'今年${name} ${age}岁'`)
</script>

  2 箭头函数

  伪代码:function 函数名(参数){}  === var 函数名 = (参数)=>{}

<script>
function add(x,y) {
return x+y
}
// alert(add(1,2)) var minus = (x,y)=>{
return x-y
}
alert(minus(2,1))
</script>

  3 对象的单体模式,使用对象的单体模式解决了this的指向问题。

  创建对象的两种方法。ES5 与ES6的区别

<script>
// 1
var person = {
name:'king',
age:25,
fav:function () {
alert(this.name) // es5的函数中的this指向了当前对象
}
}
person.fav()
// 2
var person = {
name:'king',
age:25,
fav:()=>{
console.log(this.name) // es6注意事项:箭头函数会改变this的指向 父级
}
}
person.fav()
</script>

  如何解决?

<script>
var person = {
name:'king',
age:25,
fav(){
console.log(this)
}
}
person.fav()
</script>

  输出:

{name: "king", age: 25, fav: ƒ} 

四 ES6的面向对象

  ES5与ES6的区别

  1 ES5

    构造函数创建对象

<script>
function Dog(name,age) {
this.name = name;
this.age = age;
}
Dog.prototype.showName = function () {  //js中有原型prototype
alert(this.name)
};
Dog.prototype.showAge = function () {
alert(this.age)
};
var d = new Dog('二哈',''); !!这段代码,自己写忘记了var,new
d.showName();
d.showAge();
</script>

  2 ES6  使用class 类方式创建

<script>
// constructor 构造器 class方式创建 单体模式之间不要有逗号
class Cat{
constructor(name,age){
this.name = name;
this.age = age;
}
showName(){
alert(this.name);
}
showAge(){
alert(this.age);
}
}
var c = new Cat('波斯猫',8);
c.showAge();
c.showName();
</script>

ES6的一些说明的更多相关文章

  1. ES6模块import细节

    写在前面,目前浏览器对ES6的import支持还不是很好,需要用bable转译. ES6引入外部模块分两种情况: 1.导入外部的变量或函数等: import {firstName, lastName, ...

  2. webpack+react+redux+es6开发模式

    一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...

  3. ES6的一些常用特性

    由于公司的前端业务全部基于ES6开发,于是给自己开个小灶补补ES6的一些常用特性.原来打算花两天学习ES6的,结果花了3天才勉强过了一遍阮老师的ES6标准入门(水好深,ES6没学好ES7又来了...) ...

  4. ES6(块级作用域)

    我们都知道在javascript里是没有块级作用域的,而ES6添加了块级作用域,块级作用域能带来什么好处呢?为什么会添加这个功能呢?那就得了解ES5没有块级作用域时出现了哪些问题. ES5在没有块级作 ...

  5. es6小白学习笔记(一)

    1.let和const命令 1.es6新增了let和const命令,与var用法类似,但它声明的变量只在let所在的代码块内有效(块级作用域,es5只有全局和函数作用域) { let a = 1; v ...

  6. ES6之变量常量字符串数值

    ECMAScript 6 是 JavaScript 语言的最新一代标准,当前标准已于 2015 年 6 月正式发布,故又称 ECMAScript 2015. ES6对数据类型进行了一些扩展 在js中使 ...

  7. ES6之let命令详解

    let与块级作用域 { var foo='foo'; let bar='bar'; } console.log(foo,'var'); //foo varconsole.log(bar ,'bar') ...

  8. ES6 箭头函数中的 this?你可能想多了(翻译)

    箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...

  9. ES6+ 现在就用系列(二):let 命令

    系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...

  10. ES6+ 现在就用系列(一):为什么使用ES6+

    系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...

随机推荐

  1. URL URI URN的区别

    下面这张图可以完美的解释他们三者之间的关系 URI包含URL和URN Uniform Resource Identifier :统一资源标志符,用于标识某一互联网资源 Uniform Resoutce ...

  2. 用jquery操作xml文件

    一. xml文件\内容读取 1.读取xml文件 $.get( xmlfile.xml , function (xml){ //xml即为可以读取使用的内容,具体读取见第2点 }); 2.读取xml内容 ...

  3. Oracle旗下软件官网下载速度过慢解决办法

    平常下载Oracle旗下软件官网的产品资源,会发现速度很慢,如下载JDK和mysql时, 这样很浪费我们的时间 解决办法: 复制自己需要下载的资源链接 使用迅雷下载该资源 速度均很快 如下载Mysql ...

  4. Ukulele 那些花儿

  5. LeetCode 朋友圈

    班上有 N 名学生.其中有些人是朋友,有些则不是.他们的友谊具有是传递性.如果已知 A 是 B 的朋友,B 是 C 的朋友,那么我们可以认为 A 也是 C 的朋友.所谓的朋友圈,是指所有朋友的集合. ...

  6. CSS3-transform3D

    CSS3 3D位移 在CSS3中3D位移主要包括两种函数translateZ()和translate3d().translate3d()函数使一个元素在三维空间移动.这种变形的特点是,使用三维向量的坐 ...

  7. perl学习之文件句柄filehandle

    句柄handle 分为文件句柄和目录句柄,文件句柄实际上包含文件,进程和套接字的读写.   文件句柄的操作步骤 open(FD,"filename"); @lines=<FD ...

  8. Django中重定向页面的时候使用命名空间

    urls.py from django.urls import path from . import views app_name='front' urlpatterns = [ path('',vi ...

  9. [学习笔记]一个实例理解Lingo的灵敏性分析

    一个实例理解Lingo的灵敏性分析     线性规划问题的三个重要概念:    最优解就是反应取得最优值的决策变量所对应的向量.    最优基就是最优单纯形表的基本变量所对应的系数矩阵如果其行列式是非 ...

  10. 排序算法C语言实现——快速排序的递归和非递归实现

    /*快排 -  递归实现nlogn*//*原理:    快速排序(Quicksort)是对冒泡排序的一种改进.    快速排序由C. A. R. Hoare在1962年提出.它的基本思想是:通过一趟排 ...