Lesson3(ES6简易入门(模板字符串,箭头函数))
模板字符串
let name = "Neo";
let occupation = "programmer";
//不使用模板字符串拼接
let str = "He is "+ name +",he is a "+ occupation;
//使用模板字符串拼接
let str = `He is ${name},he is a ${occupation}`;
模板字符串不再需要反复使用双引号(或者单引号)了拼接字符串,而是改用反引号标识符( ` 键盘右上角~键),插入变量的时候也不需要再使用加号(+),而是把变量放入${ }即可。
使用模板字符串的注意点: 1、可以定义多行字符串
let str = `write once ,
run anywhere`;
【Lesson3(ES6简易入门(模板字符串,箭头函数))】
?? 直接换行即可,但是要注意的是:所有的空格和缩进都会被保留。
2、${ }中可以放任意的javascript表达式
${ }中可以是运算表达式
var a = 1;
var b = 2;
var str = `the result is ${a+b}`;
//进行加法运算 结果:the result is 3
${ }中可以是对象的属性
var obj = {"a":1,"b":2};
var str = `the result is ${obj.a+obj.b}`;
//对象obj的属性
//结果:the result is 3.
${ }中可以是函数的调用
function fn() {
return 3;
}
var str = `the result is ${ fn() }`;
//函数fn的调用,结果:the result is 3
箭头函数
ES6给我们介绍一种全新的定义函数的方式,就是用箭头符号(=>),故得名为箭头函数。
//传统写法
var sum = function(value) {
returnvalue;
};
//箭头函数写法
var sum = value => value;
?? value=>value;
第一个value代表传进去的参数,箭头=>后面的value表示函数体;
//箭头函数写法
var sum = (a,b) => {return a+b}
sum(1,2);
//结果:3
注意上面的参数和函数体部分,如果参数超过1个的话,需要用小括号()括起来,函数体语句超过1条的时候,需要用大括号{ }括起来。
箭头函数中的this指向的是定义时的this,而不是执行时的this
推荐阅读
- ES6|ES6 箭头函数
- (二)ES6第一节变量(let|(二)ES6第一节变量(let,const)
- 六步搭建ES6语法环境
- 前端|web前端dya07--ES6高级语法的转化&render&vue与webpack&export
- 简易有效Api接口防攻击策略
- arrow|arrow function
- 家庭简易版金沙奶黄包
- PHP简易规则引擎
- es6官方文档
- 小程序简易轮播图