JS知识点总结（八）

JS知识点总结

一、关于变量声明与逗号操作符

若使用逗号操作符，在最后一个变量的位置进行赋值，只会给最后一个变量赋上值，其余变量为undefined。

let p1, p2, p3 = 1;
console.log(p1); // undefined
console.log(p2); // undefined
console.log(p3); // 1

若使用=连接三个变量，在js环境下没问题，但是在ts环境下回报错！

js环境下

但是这样写会造成变量泄漏到全局环境中。

function testFn() {
    let p1 = p2 = p3 = 1; 找不到名称“p2”。
}
testFn();
// console.log(p1); // 1
console.log(p2); // 1
console.log(p3); // 1

这里在全局环境中可以访问到p2,p3。

ts环境下

function testFn() {
    let p1 = p2 = p3 = 1; 找不到名称“p2”。
}

二、怎么样判断null类型

null是基本数据类型，但是typeof null === object，所以并不能用typeof，那使用instance呢：null instanceof Object === false。可以使用Object.prototype.toString.call(null) === [object Null]来判断

三、防抖与节流（完善this指向版本）

完善关于this指向的防抖与节流

1.防抖

包裹一层箭头函数，这样fn函数的this指向就和实际调用的this指向相同了。

function debounce(fn, delay) {
	 let timer = null;
	
	  return function() {
	      const wrapper = () => {
	          fn.call(this, arguments);
	      };
	      if (timer !== null) {
	          clearTimeout(timer);
	      }
	      timer = setTimeout(wrapper, delay);
	  }
}

2.节流

function throttle(fn, delay) {
    let prev = Date.now();
    let timer = null;

    return function() {
        let now = Date.now();
        const wrapper = () => {
            fn.call(this, arguments);
            prev = Date.now();
        };
        const remainTime = delay - (now - prev);
        if (remainTime <= 0) {
            wrapper();
        } else {
            if (timer !== null) {
                clearTimeout(timer);
            }
            timer = setTimeout(wrapper, remainTime);
        }
    }
}