let:用来定义变量的关键字
特点:
1.要求变量必须先定义后使用,不能声明提升
a = 666
console.log(a)
let a
2.不能重复定义变量
let a
let a
3.块级作用域(变量在该作用域中不会丢失)
var oLis = document.getElementsByTagName("li")
for(var i=0
oLis[i].index = i
oLis[i].onclick = function(){
console.log(this.index)
}
}
for(let i=0
oLis[i].onclick = function(){
console.log(i)
}
}
4.暂时性死区(当内部变量与外部变量同名时,内部变量屏蔽外部变量)
let a = 123
{
let a = 456
console.log(a)
}
console.log(a)
const:定义只读变量的关键字(创建有名的常量)
特点:
1.被const修饰的变量为只读变量
const a = 123;
console.log(a);
a = 666;写就报错
2.被const修饰的变量必须初始化(赋初值)
const a;
a = 123;
3.不能声明提升,必须先定义后使用
4.不能重复定义
5.块级作用域
6.暂时性死区
面试题:var,let,const的异同?
1.都是用来定义变量的关键字
2.var具备声明提升
3.let,const必须先定义后使用,不具备声明提升,不能重复定义变量
块级作用域,暂时性死区
4.const修饰的变量为只读变量,且必须初始化
this和bind
this:函数体内的内置对象,作用域只能在函数体内使用
1.与事件体连用:代表触发该事件的元素本身
var oInput = document.querySelector("input");
oInput.onclick = function(){
console.log(this.value);
}
2.与普通方法连用(除了事件体和构造方法),调用该方法的对象本身
function fun(){
console.log(this);
}
window.fun();
let json = {
a:1,
fun:function(){
console.log(this);
}
}
json.fun();
----------------------------------------------------
bind:函数对象的一个方法,作用就是用来改变该函数的this指向,主要修饰匿名函数的this
bind(被修改的this指向)
var oDiv = document.querySelector("div");
document.onclick = function(){
this.style.display = "none";
}.bind(oDiv);
var fun = function(){
}
fun.bind() == function(){}.bind()
json和字符串的相互转换
字符串->json对象
注意事项:使用以下转换方法的json对象和字符串,key必须用双引号引起来
var str = '{"name":"老王","age":18}'
var json = JSON.parse(str)
console.log(json)
json对象->字符串
var json = {"name":"老王","age":18}
var str = JSON.stringify(json)
console.log(str)
for...in和for...of
通常用来遍历json对象,因为遍历的是下标
for(let 索引 in json对象){}
let json = {
"name":"老王",
"age":8
}
for(let index in json){
console.log(json[index]);
}
let arr = [6,4,7,8,3];
for(let index in arr){
console.log(index);
}
针对于没有下标的容器,进行遍历
for(let 元素数值 of 容器){}
let arr = [6,4,7,8,3];
for(let item of arr){
console.log(item);
}
字符串扩展方法
判断字符串是否包含在另一个字符串中
在ES5 中使用的是 indexOf() 方法,在ES6中可以使用includes()、
startsWith()、endsWith()三个方法。
str.includes(参数): 返回布尔值,表示是否找到了参数字符串。
str.startsWith(参数):返回布尔值,参数是否在源字符串的头部。
str.endsWith(参数): 返回布尔值,参数是否在源字符串的尾部。
let str = "hello zheng zhou";
console.log(str.includes("zheng "));
console.log(str.startsWith("he222"));
console.log(str.endsWith("ou"));
-----------------------------------------------
打印中文的问题
unicode
中文解析默认是utf-16
0~65535
0000 0000 0000 0000~1111 1111 1111 1111
let str = "老王";
console.log(str.charAt(0));
let str1 = "𡱖";
console.log(str1.charAt(0));
超过65535的汉字,中文和编码的读取方式
console.log('\u{21c56}');
打印该汉字对应的编码
console.log(str1.codePointAt(0));
箭头函数
箭头函数:匿名函数的一种写法
let fun = function(){
console.log("郑州加油");
}
let fun = ()=>{
console.log("heiheihei");
}
fun();
document.onclick = ()=>{
console.log("hahaha");
}
特点:
1.如果只有一个参数,可以省略圆括号
let fun = a => {
console.log(a + 5);
}
fun(10);
2.如果函数体只有一条语句,则可以省略花括号
let fun = a => console.log(a + 10);
fun(40);
3.如果函数体只有一条语句,则自带return
let fun = a => a * 2;
console.log(fun(20));
解构赋值
1.解析结构进行赋值
let x,y,z
x = 1
y = 2
z = 3
a.数组
let [x,y,z] = [1,2,3]
console.log(x,y,z)
b.json对象
let {name,age} = {
"name":"老王",
"age":8
}
console.log(name,age)
去掉json的前缀
let json = {"name":"laowang","age":8}
let {name,age} = json
console.log(name,age)
2.交换两个变量的值
let [a,b] = [1,2]
let t
t = a
a = b
b = t
[a,b] = [b,a]
console.log(a,b)
Set集合
set:集合,没有下标,自动去重
let set = new Set(数组);
add(参数) 向集合中添加一个元素
delete(值) 删除集合中某个数
has(值) 判断集合中是否含有某个值
clear() 清空集合
let set = new Set([1,"heihei",1,2,2,3,4,4,5,5,1,"heihei"]);
set.add(7);
set.add(7);
set.delete("heihei");
console.log(set.has(22));
set.clear();
for(let item of set){
console.log(item);
}
console.log(set);
-----------------------------------------
数组去重
let arr = [1,"heihei",1,2,2,3,4,4,5,5,1,"heihei"];
let set = new Set(arr);
通过Array.from(集合):将集合转化为数组
arr = Array.from(set);
console.log(arr);
function doubleColorBall(){
let redArr = [];
let blueX = 0;
let set = new Set();
while(true){
set.add(rand(1,33));
if(set.size == 6){
break;
}
}
blueX = rand(1,16)
console.log(set,blueX);
}
doubleColorBall();