ES6的一些说明
一 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的一些说明的更多相关文章
- ES6模块import细节
写在前面,目前浏览器对ES6的import支持还不是很好,需要用bable转译. ES6引入外部模块分两种情况: 1.导入外部的变量或函数等: import {firstName, lastName, ...
- webpack+react+redux+es6开发模式
一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...
- ES6的一些常用特性
由于公司的前端业务全部基于ES6开发,于是给自己开个小灶补补ES6的一些常用特性.原来打算花两天学习ES6的,结果花了3天才勉强过了一遍阮老师的ES6标准入门(水好深,ES6没学好ES7又来了...) ...
- ES6(块级作用域)
我们都知道在javascript里是没有块级作用域的,而ES6添加了块级作用域,块级作用域能带来什么好处呢?为什么会添加这个功能呢?那就得了解ES5没有块级作用域时出现了哪些问题. ES5在没有块级作 ...
- es6小白学习笔记(一)
1.let和const命令 1.es6新增了let和const命令,与var用法类似,但它声明的变量只在let所在的代码块内有效(块级作用域,es5只有全局和函数作用域) { let a = 1; v ...
- ES6之变量常量字符串数值
ECMAScript 6 是 JavaScript 语言的最新一代标准,当前标准已于 2015 年 6 月正式发布,故又称 ECMAScript 2015. ES6对数据类型进行了一些扩展 在js中使 ...
- ES6之let命令详解
let与块级作用域 { var foo='foo'; let bar='bar'; } console.log(foo,'var'); //foo varconsole.log(bar ,'bar') ...
- ES6 箭头函数中的 this?你可能想多了(翻译)
箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...
- ES6+ 现在就用系列(二):let 命令
系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...
- ES6+ 现在就用系列(一):为什么使用ES6+
系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...
随机推荐
- 洛谷 P1744 采购特价商品
题目背景 <爱与愁的故事第三弹·shopping>第一章. 题目描述 中山路店山店海,成了购物狂爱与愁大神的“不归之路”.中山路上有n(n<=100)家店,每家店的坐标均在-1000 ...
- mohout安装
安装完成之后的环境变量的配置如下: JAVA_HOME=/usr/local/jdk1.8.0_144JRE_HOME=/usr/java/jdk1.8.0_144/jreCLASSPATH=.:$J ...
- Python学习日志9月15日
一周就要过去了,而我跟一周以前没什么区别.回想一下,我这周做了什么事情呢.恍然若失.这周的精力都浪费在很多不必要的事情上了.学过一片古文,讲后羿学射箭,他有一个同学跟他一样聪明,在一起学习.后羿呢,专 ...
- 单调栈3_水到极致的题 HDOJ4252
A Famous City 题目大意 给出正视图 每一列为楼的高度 最少有几座楼 坑点 楼高度可以为0 代表没有楼 贡献了两发RE 原因 if(!s.empty()&&tem){s. ...
- shell脚本,怎么实现每次新开一个shell都输出一个提示语?
[root@localhost wyb]# cat test.sh echo -e "\033[32mhello,This is wangyuebo's shell\033[0m" ...
- JAVA遍历map元素
第一种: Map map = new HashMap(); Iterator iter = map.entrySet().iterator(); while (iter.hasNext()) { Ma ...
- perl学习二:简单变量
字符串变量:${}1.单引号:不进行变量替换,不进行转义,字符串可以跨行.2.双引号:变量替换(贪婪匹配原则).支持转义字符(转义字符可以另外看)3.反引号 字符串的特殊表示方法:qq(...) q( ...
- python爬虫基础08-selenium大全2/8-Chrome Webdriver启动选项
Selenium笔记(2)Chrome Webdriver启动选项 本文集链接:https://www.jianshu.com/nb/25338984 在Selenium中使用不同的Webdriver ...
- ASP.NET使用Memcached高缓存实例的初级介绍
Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提供动态.数据库驱动网站的速度.Memcached ...
- Python日志(logging)模块,shelve,sys模块
菜鸟学python第十七天 1.logging 模块 logging模块即日志记录模块 用途:用来记录日志 为什么要记录日志: 为了日后复查,提取有用信息 如何记录文件 直接打开文件,往里写东西 直接 ...