es6---js的下一代标准,抓紧学起来

2017-12-21  本文已影响0人  2dcc2b155e1e

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

1、let命令
基本用法

ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。

{
let x=10;
var y=20;
console.log(x,y);
}
console.log(x);//不可以打印,会报错
console.log(y);//可以打印

这表明,let声明的变量只在它所在的代码块有效。

2、const命令
基本用法

const声明一个只读的常量。一旦声明,常量的值就不能改变。
//常量:不能被重复定义,再次定义会报错 es6

const PI="3.14159";
console.log(PI);

3、模板字符串---${}包裹变量,``包裹模板

let name="王五";
let stres6=`姓名是${name}年龄是20`;
console.log(stres6);//姓名是王五年龄是20

4、es6定义对象
(1)es5写法:

var myname="莉莉";
var pwd="123”;
var obj={
name:myname,
pwd:pwd
}
console.log(obj);
(2)es6写法:
var myname="莉莉";
var pwd="123”;
var obj6={
    myname,
    pwd
}
console.log(obj6);


es5定义对象属性和方法并调用                 
var Dog={
name:"妞妞",
sex:"母",
action:function(){
console.log("我爱吃骨头");
}
}
//调用属性
console.log(Dog.name);
//调用方法
Dog.action();

es6定义对象属性和方法并调用--在方法的定义上简化
var Dog={
name:"妞妞",
sex:"母",
action(){
console.log("我爱吃骨头");
}
}
//调用属性
console.log(Dog.name);
//调用方法
Dog.action();

5、箭头函数
es6 :箭头函数(自带return)

//有参函数es5写法
function test1(str){
return str;
}
console.log(test1("你好"));
//有参函数es6写法
var test2=(str)=>str;
console.log(test2("你也好"));
//无参函数es5写法
var test3=function(){
var str="哈哈";
return str;
}
console.log(test3());
//无参函数es6写法
var test4=()=>{
var str="哈哈";
return str;
};
console.log(test4());

6、es6——this穿透

//this穿透
var objThis1={
name:"七宝",
age:22,
action:function(){
console.log(this);
}
}
objThis1.action();//es5 打印的就是这个对象
var objThis2={
name:"七宝",
age:22,
action:()=>{
console.log(this);
}
}
objThis2.action();//es6  this穿透到上一层  Window
上一篇下一篇

猜你喜欢

热点阅读