您的位置:首页 > 其它

ES6 基本语法

2018-03-01 13:55 127 查看

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

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: