基本类型、引用类型、let、var、const
1 基本类型:
基本类型有:Number、String、BigInt(ES6新增的),还有一些空值NULL、NAN、undefine,Boolean
1.1 这几种空值的区别
NULL:表示无值,例如
var a
console.log(a)//这里a打印的是null
undefine:表示未定义过的变量的类型,例如
//之前没有定义过变量
console.log(typeof a)//这里打印undefined
NAN:表示未定义的数字,例如
var a=NAN
console.log(typeof a)//这里打印a的类型为Number
1.2 Number的常用对象属性、方法
属性调用方式是Number.xxx
属性 | 描述 |
---|---|
MAX_VALUE | 可表示的最大的数。 |
MIN_VALUE | 可表示的最小的数。 |
NEGATIVE_INFINITY | 负无穷大,溢出时返回该值。 |
POSITIVE_INFINITY | 正无穷大,溢出时返回该值。 |
正无穷、负无穷在ES6中可以直接用infinity和-infinity表示
方法调用方式:NumberObject.xxx
方法 | 描述 |
---|---|
toString | 把数字转换为字符串,使用指定的基数。(后面可以跟参数,表示转换成几进制的字符串,参数范围是2-36) |
toFixed(num) | 把数字转换为字符串,结果的小数点后有指定位数的数字。(num为需要多少位小数) |
toExponential(num) | 把对象的值转换为指数计数法。(num规定了指数计数中的小数的位数) |
toPrecision(num) | 把数字格式化为指定的长度。(num规定了指数计数中有效数字的位数) |
valueOf | 返回一个 Number 对象的基本数字值。(这个方法多用于字符串转换为数字) |
1.2 String的常用对象属性、方法
属性 | 描述 |
---|---|
length | 字符串的长度 |
方法 | 描述 |
---|---|
anchor() | 创建 HTML 锚。 |
indexOf() | 检索字符串。(必须一个字符串的值,返回的是这个字符串首次出现的位置) |
replace(regexp,replacement) | 替换与正则表达式匹配的子串。(两个必要值,regexp表示被替换的字符串或者正则、replacement为替换文本,也可以是一个函数) |
search(regexp) | 检索与正则表达式相匹配的值。(regexp是被检索的正则,返回的是与正则匹配的初始位置) |
slice(start,end) | 提取字符串的片断,并在新的字符串中返回被提取的部分。 |
toString() | 返回字符串。 |
split(separator,howmany) | 把字符串分割为字符串数组。(separator必须,字符串或者正则没从什么地方开始分割) |
2 引用类型
引用性有Array,Object,Set,Map
2.1 Array[]
数组,常用方法有:
方法 | 描述 |
---|---|
concat() | 连接两个或更多的数组,并返回结果。 |
pop() | 删除并返回数组的最后一个元素 |
push() | 向数组的末尾添加一个或更多元素,并返回新的长度。 |
reverse() | 颠倒数组中元素的顺序。 |
shift() | 删除并返回数组的第一个元素 |
slice() | 从某个已有的数组返回选定的元素 |
sort() | 对数组的元素进行排序 |
splice() | 删除元素,并向数组添加新元素。 |
toString() | 把数组转换为字符串,并返回结果。 |
unshift() | 向数组的开头添加一个或更多元素,并返回新的长度。 |
valueOf() | 返回数组对象的原始值 |
2.2 Object{}
所有对象都是Object的实例
2.3 Set[]
集合,k-v对的形式,set中的值是唯一的,
基本操作
mySet.add(value):在Set
对象尾部添加一个元素。返回该Set
对象。
mySet.has(value):返回这个元素是否在set中
mySet.delete(value):从一个 Set
中删除指定的元素。
mySet.entries():一个新的包含 [value, value] 形式的数组迭代器对象,value 是给定集合中的每个元素,迭代器 对象元素的顺序即集合对象中元素插入的顺序。
Set的三个第二迭代器:
mySet.forEach(callback):回调函数有两个参数,currentValue 是正在被操作的元素。并且由于集合没有索引,所以 currentKey 也表示这个正在被操作的元素。
mySet.keys()与**values()
**方法相同,返回一个新的迭代器对象,该对象包含Set
对象中的按插入顺序排列的所有元素的值。
mySet.values()返回一个新的迭代器对象,该对象包含Set
对象中的按插入顺序排列的所有元素的值。
2.4 Map{}
基本操作
myMap.set(k, v):向map中添加一个元素
myMap.get(key)返回键对应的值,如果不存在,则返回undefined。
myMap.has(key)返回一个布尔值,表示Map实例是否包含键对应的值。
Map的三个迭代器
myMap.forEach(callbackFn)按插入顺序,为 Map
对象里的每一键值对调用一次callbackFn函数。如果为forEach提供了thisArg,它将在每次回调中作为this
myMap.set(key, value)设置Map对象中键的值。返回该Map对象。
myMap.values()返回一个新的Iterator
对象,它按插入顺序包含了Map对象中每个元素的值。
3 let、var、const
3.1 let、const
作用域规则:let声明的变量只在声明的块或者子块中可用,在程序的最顶端声明一个变量时,let不会把这个变量放在全局对象中
let a=0
console.log(this.a)//这里的a是undefine,是取不到的
const是全局常量,是不可更改的,也不会变为window的对象属性
3.2 暂存死区
var有变量提升,例如:
console.log(a)//undefined
var a=1
相当于:
var a
console.log(a)
a=1
但是let和const则不可以提升
console.log(a) //Uncaught ReferenceError:a is not defined
// 以上区域则为暂存死区
let a=1
3.3 防抖、节流
防抖:在定时器的时间内,如果重复操作就会延长定时器,实现原理是,重复操作的时候重新新建一个定时器;
节流:按照定时器的时间,定时器时间一到就会进行一遍操作,定时器时间内的操作时不会有效的
实现:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button type="button" onclick='throttle()'>节流</button>
<button type="button" onclick='debounce()'>防抖</button>
<span id="xixi">0</span>
<script>
let xixi = document.querySelector('#xixi')
var haha//定时器
function throttle(){//节流
if(!haha){//当有定时器时
xixi.innerText++//加1
haha = setTimeout(()=>{//创建一个定时器
clearTimeout(haha)//时间结束后将定时器清零
haha=null
},2000)
}
}
function debounce(){//防抖
if(haha){
clearTimeout(haha)//有定时器直接清零
}
haha = setTimeout(()=>{//新建一个定时器
haha = null
},2000)
if(!haha) xixi.innerText++//没有定时器,就+1
}
</script>
</body>
</html>