ES6 基本语法
ECMAScript 6 简介
ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。
ECMA:国际标准组织
let 和 const 命令
ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。
{
let a = 10;
var b = 1;
}
a // ReferenceError: a is not defined.
b // 1
上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。
const声明一个只读的常量。一旦声明,常量的值就不能改变。
const PI = 3.1415; PI // 3.1415 PI = 3; // TypeError: Assignment to constant variable.
上面代码表明改变常量的值会报错。
本质
const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指针,const只能保证这个指针是固定的,至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。
模板字符串
<script>
var name = '小明', age = '83';
// var str = name+"今年"+age+",下午我们去吃鸡";
var str = `${name}今年${age},下午我们去吃鸡`;
alert(str)
</script>
箭头函数
伪代码: function 函数名(){} === var 函数名 = ()=>{}
<script>
// es5 写法
function add1(x,y) {
return x+y
}
alert(add1(1,2));
// es6 箭头函数
var add2 = (a,b)=>{
return a+b
}
alert(add2(2,3));
</script>
字面量方式创建对象以及对象的单体模式
<script>
var person = {
name:'小明',
age:18,
fav:function() {
// es5的函数中的this指向了当前对象
alert(this.name)
}
};
person.fav() // 小明
</script>
<script>
var person2 = {
name: '小明2',
age: 18,
fav: () => {
// es6注意事项:箭头函数会改变this的指向 父级
alert(this)
}
}
person2.fav() // [object Window]
</script>
<script>
//对象的单体模式
// 使用对象的单体模式解决了this的指向问题
var person = {
name: '小明',
age: 18,
fav() {
alert(this.name)
}
}
person.fav() // 小明
</script>
es6中的面向对象
es6使用class 类方式创建
<script>
class Cat{
// constuctor 构造器 class方式创建 单体模式之间不要有逗号
constructor(name,age){
this.name = name;
this.age = age
}
showName(){
console.log(this.name)
}
showAge(){
console.log(this.age)
}
}
var c = new Cat('xiaohong',12)
c.showName()
</script>
阮一峰的es6教程:http://es6.ruanyifeng.com/#docs/intro
ES6 基本语法的更多相关文章
- ES6常用语法
ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...
- ECMAScript简介以及es6新增语法
ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...
- ES6新语法
ES6新语法概览 简介 ES6是JavaScript语言的新一代标准,加入了一些新的功能和语法,正式发布于2015年6月,亦称ES2015:该标准由ECMA(欧洲计算机制造联合会)的第39号技术专家委 ...
- ES6新语法的介绍
对于ES6新语法,阮一峰有一篇文章介绍的挺详细 http://es6.ruanyifeng.com/#docs/destructuring
- ES6最新语法
ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...
- ES6新语法之let关键字;有别于传统关键字var的使用
ES6新语法于2015年发布:而我这个前端小白在17年才接触到.惭愧惭愧!!不过到目前为止,似乎只有FireFox和Chrome对ES6的支持相对良好.不过既然人家ES6已经出来了,还是要跟上技术的潮 ...
- 让 Node.js 支持 ES6 的语法
为了让 Node.js 支持 ES6 的语法, 需要使用 Babel. 安装 es-checker 在使用 Babel 之前 , 我们先检测一下当前 node 对 es6 的支持情况. 在命令行下执行 ...
- Vue(1)- es6的语法、vue的基本语法、vue应用示例,vue基础语法
一.es6的语法 1.let与var的区别 ES6 新增了let命令,用来声明变量.它的用法类似于var(ES5),但是所声明的变量,只在let命令所在的代码块内有效.如下代码: { let a = ...
- JavaScript ES6部分语法
ES6是JavaScript语言的新版本,它也可以叫做ES2015,之前学习的JavaScript属于ES5,ES6在它的基础上增加了一些语法,ES6是未来JavaScript的趋势,而且vue组件开 ...
- ES6常用语法简介import export
ES6常用语法简介import export let与var用法区别 //var var a = []; for (var i = 0; i < 10; i++) { a[i] = functi ...
随机推荐
- guxh的python笔记七:抽象基类
1,鸭子类型和白鹅类型 1.1,白鹅类型 白鹅类型对接口有明确定义,比如不可变序列(Sequence),需要实现__contains__,__iter__,__len__,__getitem__,__ ...
- 依赖注入demo
让我们看一个例子: class UserProvider{ protected $connection; public function __construct(){ $this->connec ...
- Linux - 7种运行级别
目录:etc/rc.d/init.d 1. linux开机过程 2. 运行级别(0-6) 存储位置 etc/inittab,开机加载,也可以用命令init [数字]切换. # 0 - 停机(默认时为0 ...
- 『流畅的Python』第1~4章笔记_数据结构、编码
由于1~4章内容零散且基础,所以统计一下涉及到的内容,记录一下,方便查阅(第一张图右键新页面打开即可看到清晰大图)
- .net asp 实现json 格式跨域访问 的方法
在<configuration> 配置目录下添加允许跨域的头部信息 //webapi 默认的web.config有配置 //1)删除 下面参数 否者WEB API 会 出现405 错误 没 ...
- Descriptors;Hello1 project中的Web.xml
Deployment Descriptors(描述符)是一个xml文件,用来描述如何部署一个模块或者应用(根据描述符中定义的配置和容器选项).举例来说,一个EJB的部署描述符会向EJB容器传递如何管理 ...
- mysql索引 ->创建索引、修改索引、删除索引的命令语句
查看表中已经存在 index:show index from table_name; 创建和删除索引索引的创建可以在CREATE TABLE语句中进行,也可以单独用CREATE INDEX或ALTER ...
- django2_开发web系统接口
1.单独创建.../sign/views_if.py文件,开发添加发布会接口 from django.http import JsonResponse from cmdb.models import ...
- xftp免费版使用
转自https://www.jb51.net/softs/621774.html
- windows下安装rabbitmq的步骤详解
(仅作为个人的备忘记录) Rabbit MQ 是建立在强大的Erlang OTP平台上,因此安装Rabbit MQ的前提是安装Erlang.通过下面两个连接可以下载安装最新的版本: 下载并安装Eral ...