变量申明
引入let,const来区分作用域
- let:适用于块级作用域,"{}"之间有效,尽量使用let替换原来的var
- const:常量申明,申明之后就必须初始化,且不能进行修改
赋值-解构化赋值,详情
数组
let [a,b] = [1,2];
//a = 1
//b = 2
说明:左侧可以和右侧不是一一对应的关系例如[,b] b也会被赋值2。
对象
let {a,b} = {a:1,b:2};
//a = 1
//b = 2
说明: 左侧变量名需要和右侧属性名一致,如改成别的名字则会赋值失败
默认值
let [a=3,b] = [undefined,2];
//a = 3
//b = 2
说明:当右侧数组或对象没有左侧对应值时会取默认值进行赋值操作,可以用在方法的参数传递上,需注意只有undefined或者对象中没有左侧变量同名的内容时才会取默认值,如右侧结果为null,那么会赋值为null
别名
let {a:aa,b} = {a:1,b:2};
//a:VM81:1 Uncaught ReferenceError: a is not defined
//aa = 1
//b = 2
说明:适用于对象赋值
剩余赋值
let [a,...b] = [1,2,3,4];
//a = 1
//b = [2,3,4]
let {a,...b} = {a:1,t1:1,t2:2,t3:3}
//a = 1
//b = {t1:1,t2:2,t3:3}
动态赋值
let test = "a";
let {[test]:temp} = {a:1,b:2};
// temp= 1
等号右侧可以是固定对象,也可以是函数的返回值,且操作会在代码中混合使用,需牢记
其它
等号右侧会优先转换为js对象进行处理
let [a,...b] = "test"
// a="t"
// b = "est"
let {length:len} = "test";
// len = 4
字符串
新增一些常用方法
函数名 | 说明 |
---|---|
includes(str) | 是否包含 |
startsWith(str) | 是否以参数开始 |
endsWith(str) | 是否以参数结束 |
padStart(int,str) | 补全原字符串,常用于补全编号, |
padEnd(int,str) | 是否以参数结束 |
matchAll | 返回一个正则表达式在当前字符串的所有匹配 |
模板字符串
使用反引号` 键盘上1左边那个键,包裹的内容可以字符串与变量混用
let test = "my test"
let str = `in ${test}`
// str = "in my test"
说明:
- ${}中可以是函数,表达式
- ``包裹的内容可以换行符等
- 带标签的模板字符串
模板字符串可以和函数一起使用:函数名模板字符串
,详细请看例子
var person = 'Mike';
var age = 28;
function myTag(strings, personExp, ageExp) {
var str0 = strings[0]; // "that "
var str1 = strings[1]; // " is a "
// There is technically a string after
// the final expression (in our example),
// but it is empty (""), so disregard.
// var str2 = strings[2];
var ageStr;
if (ageExp > 99){
ageStr = 'centenarian';
} else {
ageStr = 'youngster';
}
return str0 + personExp + str1 + ageStr;
}
var output = myTag`that ${ person } is a ${ age }`;
//等价于myTag(["that ","is a "],person,age)
console.log(output);
// that Mike is a youngster
- 在标签函数中第一个参数可以通过strings.raw[0]来访问原始模板字符串
箭头函数
let a = function (t){return t+1;};
//等价于
let a = t=>t+1;
说明:
- 与lamda表达式类似,如函数体有多行需要使用{}包裹,需返回时需显示使用return
- 箭头函数中this继承上层,如上层也为箭头函数则一直向上找
- 箭头函数中this为申明时绑定的,不会动态变化,例如onClick如用箭头函数则函数体中this为window对象而不是触发onClick的事件源对象
- 当箭头函数只包含一个返回的json对象时不能直接写:{a:1} 因为{}是关键字会参与解析,需使用括号包裹var func = () => ({foo: 1});
箭头函数嵌套使用
const add = (a) => (b) => a + b;
//等价于
function add(a) {
return function(b) {
return a + b;
}
}
// 使用
// add(1)(3)
柯里化:又译为卡瑞化或加里化,是把接收多个参数的函数变换成接收一个单一参数(最初函数的第一个参数)的函数,并返回接受剩余的参数而且返回结果的新函数的技术。这个技术由克里斯托弗·斯特雷奇以逻辑学家哈斯凯尔·加里命名的。