变量
var的缺点
- 1、可重复声明
- 2、无法限制修改,不能规定常量
- 3、没有块级作用域,只有函数可以限制作用域,比如闭包
let 、const 的好处(弥补var的缺点)
- 1、不能重复声明
- 2、变量-可改变、常量-不可改变
- 3、块级作用域
块级作用域:包含{}的就是一个块,比如if,都是
{
let a = 1;
}
console.log(a); //这里是访问不到a的,程序会报错,a is not defined
*let const 声明,不会被提前
cosole.log(a);// 会打印出undefined,因为var会把声明提前
var a = 3;
var换成let,同样的代码
console.log(a); // 程序报错 a is not defined
let a = 3;
函数—箭头函数
1、写法规则:
只有一个参数时,()可以省略,
前提只有一个参数,多一个少一个都不行,无参数时不能省
只有一个return语句时,{}可以省略
// 普通写法
var show = function (a){
return a*2;
}
// 箭头函数写法
let show = a => a*2; // 写法遵循规则即可
2、this的指向
箭头函数的this是在定义函数时绑定的,不是在执行过程中绑定的。简单的说,函数在定义时,this就继承了定义函数的对象。
var a=12;
function Test(){
this.a = 88;
return ()=>{console.log(this.a)};
}
var x = new Test();
x();// 88
函数—参数
1、参数扩展/数组扩展
… 三点运算符,可用于参数的收集,或数组的展开
注意: …必须是最后一个收集剩余参数,不能放在中间
// ...arg存放的参数是剩余参数
function test(a, b, ...arg){
console.log(...arg); // 3,4,5,6,7
console.log(a, b);// 1,2
}
test(1,2,3,4,5,6,7);
2、默认参数
传值就用传的值,不传值就用默认的
function test(a,b=3,c=4){
console.log(a,b,c);
}
test(1); // 1,3,4
test(7,8,9);// 7.8.9
3、解构赋值
左右两边结构必须一样
右边必须是个东西,有效的东西
声明和赋值不能分开(必须在同一行完成)
// 正确写法
let [a,b,c] = [1,2,3];
let {e,f,g} = {e:12,f:13,g:14};
let [[n1,n2,n3],{e1,f1}] = [[2,3,4],{e1:12,f1:13}];
let [arr,json] = [[2,3,4],{e:12,f:13}];// 数组、json可以单独赋值也可以整体赋值
// 错误实例
let [a,b,c] = {e:12,f:13,g:14}; // 结构不一样
let {e,f,g} = {12,13,14}; // 右边非东西,非数组非对象
let [a,b];
[a,b] = [1,2]; // 声明和赋值不在一行
数组
map 映射,一个对一个
作用于数组每一项,返回一个新值,不改变原数组
一个参数,对应数组的每一个
arr.map( function (item) {return …})
// 示例1: 将[1,2,3,4,5] 变成 [1,4,9,16,25]
let arr = [1,2,3,4,5];
let arr2 = arr.map(item=>item*item);
console.log(arr2);
// 示例2: 成绩对应
let grade= [23,45,99,86,75,39];
let grade2 = grade.map(item => item>60 ? "及格" : "不及格")
console.log(grade2);
reduce 汇总,一堆对应一个结果
arr.reduce( function (tmp,item,index) {return …})
//示例:平均数
let arr = [1,2,3,4,5,6,7,8,9];
let result1 = arr.reduce((tmp, item, index) => {
if (index != arr.length - 1) { // 不是最后一次,求和
return tmp + item;
} else {
return (tmp + item)/arr.length; // 最后一次,除数组长度
}
})
console.log(result1);
三个参数
tmp 两两计算得出的值,第一次是数组的第一个值,相当于多数值运算
item 相加的第二个值(a+b 中的b),第一次是数组的第二个值
index 代表运算次数,从1开始
三个参数示意图
filter 过滤器,留一部分删一部分,true留,false删
arr.filter( function (item) {return …})
let arr = [1,2,3,4,5,6,7,8,9];
let result = arr.filter(item => item % 3 == 0 ? true : false);
console.log(result); // 能整除3的留下 [3,6,9]
forEach循环
forEach(item,index){…}
let arr = [1,2,3,4,5,6,7,8,9];
arr.forEach((item,index) => {
console.log("第" + index + "个,的值是" + item);
});
字符串
- 1、增加了两个方法
startswith 以…开始
endswith 以…结束
var str = "http://123.com";
if (str.startsWith("http://")) {
console.log("这是一个网址")
}
if (str.endsWith(".com")) {
console.log("这是一个网址")
}
- 2、模板字符串
反引号包裹 ``,
可以将变量直接加进去 $(变量)
可以折行
友情提示:反引号的位置在键盘1的左边
举个例子对比下,超好用的
let title = "标题";
let con = "内容";
// 普通拼接
let str = '<div>\
<h1>'+title+'</h1>\
<p>'+con+'</p>\
</div>';
// 字符串模板拼接
let str2 = `<div>
<h1>${title}</h1>
<p>${con}</p>
</div>`