前端新人入职3个月踩过的坑
本人前端小菜鸡，初来乍到，都是开发中比较简单的业务场景，有总结不到位的，希望各位大神们指教，在以后的开发中共同进步。
1.在做判断时候使用!!的意义
js中 ! 的含义：js中，!表示运算符“非”，如果变量不是布尔类型，会将自动转化为布尔类型再取值，!!（两个感叹号），就可以将变量转化为对应布尔值。一般认为 !! 表示将一个变量转为Boolean型，再加一个 ! 是对Boolean型取反，和 !faslse 或者 !true 一样。
意义：可以避免空指针的现象发生。
2.vue中forEach与splice连用删除元素出现的bug
在使用 Vue 中的 forEach 和 solice 连用删除元素时，可能会出现,bug，这是因为 forEach 是遍历数组的方法Q，而 splice 是对数组进行修改的方法，因此，当使用 spice 删除数组中的元素时，它会改变数组的长度，进而影响到 forEach 的遍历。因此，在使用 forEach 和splice 连用删除元素时，需要注意以下几点:
①不能在 forEach 内部直接使用 splice 进行删除，因为这样会导致数组长度的改变,
②使用 for...of或者 Array.filter()方法替代 forEach。
③将数组转换成一个新的数组
3.Js编码解码 decodeURL()与decodeURLComponent()的区别
① 定义和用法
decodeURL() 函数可对encodeURL() 函数编码过的 URL 进行解码 decodeURLComponent() 函数可对 encodeURLComponent() 函数编码的URL进行解码 从W3C的定义和用法来看，两者没有什么区别，但是两者的参数时有区别的： decodeURL(URLstring) 一个字符串，含有要解码的URL或其他要解码的文本 decodeURLComponent(URLstring) 一个字符串，含有编码URL组件或其他要解码的文本
②使用中区别用法
decodeURLComponent和encodeURLComponent可以编码和解码URL特殊字符（如#，/，￥等） 而decodeURL则不能
4.HTML5新特性dataset的使用方法
HTML5规定可以为元素添加非标准的属性，但是要添加前缀 data-，目的是为元素提供与渲染无关的信息，或者提供语义信息。这些属性可以任意添加、随便命名，只要以 data- 开头即添加了自定义属性之后，可以通过元素的 dataset 属性来访问自定义属性的值
5.Window.matchMedia()
返回一个新的 MediaQueryList 对象，表示指定的媒体查询字符串解析后的结果。返回的 MediaQueryList 可被用于判定 document 是否匹配媒体查询，或监控一个 document 来判定它匹配了或者停止匹配了此媒体查询。
6.Lodash工具库
是一个具有一致接口，模块化，高性能等特征的js工具库 Lodash的一大亮点开发者可以按需加载，而不是引用整个库，每个模块都暴露在npm中，可以单独引用
7.Window：btoa() 方法
Window 接口的 btoa() 方法可以将一个二进制字符串（例如：将字符串中每一个字节都视为一个二进制数据字节） 编码为 base64 编码的 ASCII 字符串
8. ?. ?? 的使用
?. 可选链
?? 空位合并运算符，使用 || 运算符，只要左边是undefined和null，就会返回右边的数据
9.在项目请求后端接口时，使用loding的作用
在请求接口前把 loading赋值为true，请求完成后赋值为false，这一操作可以防止用户重复请求
10.间接调用函数
利用call和apply来实现，this就是call和apply对应的第一个参数，如果不传值或者第一个值为null，undefined时this指向window通过call/apply如果第一个参数时string,number,boolean,call内部会调用其相应的构造器String、Number、Boolean将其转换为相应的实例对象
11.在渲染表格的列表的时候，使用tdesigin中的分页，出现第一页显示最后一页的数据
需要给table加一个key属性，在每次渲染的时候让key++，使得每次渲染的列表都有自己独特的key属性，这样就会在对应的页码中显示对应的数据。
12.出现页面的不更新
如果一个页面中的需要更新的数据需要别的页面根更新过之后才可以获取到，在同一个事件中触发：有可能会出现页面的不更新，是因为页面更新时最新的数据还未发生变化
解决方法：可以通过定时器来稍微等待一下数据的更新，再调用相应的接口，或者是把此方法放到另一个方法中去。
13.JS中加减乘除的精度损失问题
可以使用Number(number).tofxied(0) 来解决
可以使用具体的方法来解决
14.在模板中使用ref，三种使用场景
①ref + 普通dom标签：获取真实dom对象 this.$refs.box
②ref + 组件标签：获取组件实例对象(可以用于表单校验) this.$refs.form.validate()
③ref + v-for: 获取由dom对象(实例对象)组成的数组（不经常使用）
完结，撒花，希望对一些刚入职的同学们有帮助，后续会继续更新，我们共同加油！！！！
