ECMA Script6

发表于 | 分类于 | 阅读次数:

一. let声明变量

1
2
3
4
let a;
let b,c,d;
let e = 100;
let f = 521, g = 'iloveyou', h = [];
  1. 变量不能重复声明
1
2
3
let star = '罗志祥';
let star = '小猪';
// "star" has already been declared
  1. 块级作用域
1
2
3
4
5
6
{
  let girl = '周扬青';
}
console.log(girl);
// referenceError: girl is not defined
// if else while for循环
  1. 不存在变量提升
1
2
3
console.log(song);
var = song = '恋爱达人';
// Cannot access 'song' before initialization
  1. 不影响作用域链
1
2
3
4
5
6
7
8
{
  let school = 'peking';
  function fn(){
    console.log(school);
  }
  fn();
}
// peking

二. const声明常量

1
2
const SCHOOL = '尚硅谷';
console.log(SCHOOL);
  1. 一定要赋初始值
1
2
const A;
// Missing initializer in const declaration
  1. 一般常量使用大写(潜规则)
1
const a = 100;
  1. 常量的值不能修改
1
2
SCHOOL = 'ATGUIGU';
// Assignment to constant variable
  1. 块级作用域
1
2
3
4
5
{
  const PLAYER = 'UZI';
}
console.log(PLAYER);
// PLAYER is not defined
  1. 对于数组和对象的元素修改,不算做对常量的修改,不会报错
1
2
const TEAM = ['UZI', 'MXLG', 'Letme'];
TEAM.push('Meiko');

三. 变量解构赋值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
// ES6 允许按照一定模式从数组和对象中提取值,对变量进行复制
// 这被称为解构赋值
// 1. 数组的解构
const F4 = ['小沈阳', '刘能', '赵四', '宋小宝'];
let [xiao, liu, zhao, song] = F4;
console.log(xiao);
console.log(liu);
console.log(zhao);
console.log(song);
//小沈阳
//刘能
//赵四
//宋小宝

// 2. 对象的解构
const zhao = {
  name: '赵本山',
  age: '不详',
  xiaopin: function(){
    console.log("我可以演小品");
  }
};

let {name, age, xiaopin} = zhao;
console.log(name);
console.log(age);
console.log(xiaopin);
xiaopin();
//赵本山
//不详
//f (){
// console.log("我可以演小品");
// }
// 我可以演小品

四. ES6引入新的声明字符串的方式 [``] ‘ ‘ “ “

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 1. 声明
let str = `我也是一个字符串哦!`;
console.log(str, typeof str);
//我也是一个字符串哦! string

// 2. 内容中可以直接出现换行符
let str = `<ul>
						<li>沈腾<li>
    				<li>玛丽<li>
    				<li>魏翔<li>
    				<li>艾伦<li>
    				<ul>`;
// 3. 变量拼接
let lovest = '魏翔';
let out = `${lovest}是我心目中最搞笑的演员!!`;
console.log(out);
// 魏翔是我心目中最搞笑的演员!!

五. 简化对象写法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// ES6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法
// 这样的书写更加简洁
let name = '尚硅谷';
let change = function(){
  console.log('我们可以改变你');
}

const school = {
  name, // name: name,
  change,
  improve: function(){
    console.log("我们可以提高你的技能");
  }
}

console.log(school);

六. 箭头函数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
// ES6允许使用[箭头] (=>)定义函数
// 声明一个函数
// let fn = function(){

// }
// 声明
let fn = (a, b) => {
  return a + b;
}
// 调用函数
let result = fn(1, 2);
console.log(result);

// 和之前区别:
// 1. this 是静态的. this 始终指向函数声明时所在作用域下的this的值
function getName(){
  console.log(this.name);
}
let getName2 = () => {
  console.log(this.name);
}
// 设置 window对象的name属性
window.name = '乐乐';
const school = {
  name: "LELE"
}

// 直接调用
getName();
getName2();
// 乐乐
// 乐乐

// call方法调用
getName.call(school);
getName2.call(school);
// LELE
// 乐乐

// 2. 不能作为构造实例化对象
let Person = (name, age) => {
  this.name = name;
  this.age = age;
}
let me = new Person('xiao', 30);
console.log(me);

// 3. 不能使用arguments变量