掘友等级
获得徽章 0
#每天一个知识点#
React 16.3版本之前，是不能够在函数组件里定义ref属性，因为函数组件没有实例。在16.3版本之后，引入了React.forwardRef,通过该函数就可以将父组件的ref传入子组件，子组件可以将该ref绑定在任何DOM元素上，但这样会将整个子组件暴露给父组件。通过useImperativeHandle就可以限制要将子组件里的哪些属性或方法暴露给父组件
#每天一个知识点#
为什么说单页面的SEO不友好
// 因为单页面的情况下的页面中的很多内容都是根据匹配到的路由动态生成并展示出来的,而且很多页面内容是通过ajax异步获取的,网络抓取工具并不会等待异步请求完成后再行抓取页面内容,
// 对于网络抓取工来说去准确模拟相关的行为获取复合数据是很困难的,它们更擅长对静态资源的抓取和分析
//搜索引擎要根据网页的内容才能给网页权重
// 前后端分离是seo的一大罪魁祸首, html页面不会立即渲染出来,而是等待ajax请求完成之后才渲染完整的html页面
#每天一个知识点#
前端常用git命令
git checkout 分支名
git merge 分支名
git pull
git stash
git stash pop
git reset HEAD^
#每天一个知识点#
函数声明和变量声明都会被提升。但是一个值得注意的细节（这个细节可以出现在有多个“重复”声明的代码中）是函数会首先被提升，然后才是变量。
而且，函数声明会被提升，但是函数表达式却不会被提升
#每天一个知识点#
this到底是什么？
this 是在运行时进行绑定的，并不是在编写时绑定，它的上下文取决于函数调
用时的各种条件。this 的绑定和函数声明的位置没有任何关系，只取决于函数的调用方式。
当一个函数被调用时，会创建一个活动记录（有时候也称为执行上下文）。这个记录会包含函数在哪里被调用（调用栈）、函数的调用方法、传入的参数等信息。this 就是记录的其中一个属性，会在函数执行的过程中用到
#每天一个知识点#
函数预编译的过程:
1、先看形参和变量声明（如果有if语句先不看条件是否成立变量直接提升）
2、实参值赋给形参
3、寻找函数声明
4、执行函数
function test(a=3){
console.log(b)
if(a){
var b=100
}
console.log(b)
a=2
}
test(1)
//undefined
//100
#每天一个知识点#
null和undefined的异同点有哪些？
相同点
1、都是空类型
2、转布尔值都是false，都是假值
3、null == undefined 为 true
不同点
1、typeof，前者为object，后者为undefined
2、null转数字为0，undefined转数字为NaN
3、null === undefined 为 false
#每天一个知识点#
var a = 2 / "foo";
a == NaN; // false
a === NaN; // false
NaN 是一个特殊值，它和自身不相等，是唯一一个非自反（自反，reflflexive，即 x === x 不
成立）的值。而 NaN != NaN 为 true，
var a = 2 / "foo";
var b = "foo";
Number.isNaN( a ); // true
Number.isNaN( b ); // false
很多 JavaScript 程序都可能存在 NaN 方面的问题，所以我们应该尽量使用 Number.isNaN(..)
这样可靠的方法，
如果你仍在代码中使用 isNaN(..)，那么你的程序迟早会出现 bug。
#每天一个知识点#
防抖：频繁去触发一个事件，但是只触发最后一次，一最后一次为准
场景：1、电脑息屏时间，每动一次电脑又重新计算时间
2、input的输入框变化频繁触发事件可加防抖
3、频繁点击按钮提交表单可加防抖
防抖函数
function debounce(fn, delay = 200) {
let timer
return function(...args) {
if (timer) {
clearTimeout(timer)
timer = null
}
timer = setTimeout(() => {
fn.apply(this, args)
clearTimeout(timer)
timer = null
}, delay)
}
}
节流：频繁触发一个事件，但是只能每隔一段时间触发一次
场景：1、滚动频繁请求列表可加节流
2、游戏里长按鼠标，但是动作都是每隔一段时间做一次
function throttle(fn, delay = 200) {
let flag = true
return function(...args) {
if(!flag) {
return
}
flag = false
let timer = setTimeout(() => {
fn.apply(this, args)
flag = true
clearTimeout(timer)
}, delay)
}
}
#每天一个知识点#
JavaScript 语言存在一个顶层对象，它提供全局环境（即全局作用域），所有代码都是在这个环境中运行。但是，顶层对象在各种实现里面是不统一的。
• 浏览器里面，顶层对象是window，但 Node 和 Web Worker 没有window。
• 浏览器和 Web Worker 里面，self也指向顶层对象，但是 Node 没有self。Node 里面，顶层对象是global，但其他环境都不支持。
