饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的


饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
使用Object.prototype.toString配合闭包 , 在保证判断数据类型的准确性时 , 同时能让这个函数非常灵活 , 通过传入不同的判断类型来返回不同的判断函数(注意传入type参数时首字母大写)
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
值得一提的是 , map的第二个参数为第一个参数回调中的this指向 , 如果第一个参数为箭头函数 , 那设置第二个this会因为箭头函数的词法绑定而失效
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
在这里小编建了一个前端学习交流扣扣群:132667127 , 我自己整理的最新的前端资料和高级开发教程 , 如果有想需要的 , 可以加群一起学习交流
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
执行some方法的数组如果是一个空数组 , 最终始终会返回false , 而另一个数组的every方法中的数组如果是一个空数组 , 会始终返回true
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
因为selfFlat是依赖this指向的 , 所以在reduce遍历时需要指定selfFlat的this指向 , 否则会默认指向window从而发生错误
原理通过reduce遍历数组 , 遇到数组的某个元素仍是数组时 , 通过ES6的扩展运算符对其进行降维(ES5可以使用concat方法) , 而这个数组元素可能内部还嵌套数组 , 所以需要递归调用selfFlat
同时原生的flat方法支持一个depth参数表示降维的深度 , 默认为1即给数组降一层维度
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
传入Inifity会将传入的数组变成一个一维数组
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
原理是每递归一次将depth参数减1 , 如果depth参数为0时 , 直接返回原数组
9.实现ES6的class语法
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
ES6的class内部是基于寄生组合式继承 , 它是目前最理想的继承方式 , 通过Object.create方法创造一个空对象 , 并将这个空对象继承Object.create方法的参数 , 再让子类(subType)的原型对象等于这个空对象 , 就可以实现子类实例的原型等于这个空对象 , 而这个空对象的原型又等于父类原型对象(superType.prototype)的继承关系
而Object.create支持第二个参数 , 即给生成的空对象定义属性和属性描述符/访问器描述符 , 我们可以给这个空对象定义一个constructor属性更加符合默认的继承行为 , 同时它是不可枚举的内部属性(enumerable:false)
而ES6的class允许子类继承父类的静态方法和静态属性 , 而普通的寄生组合式继承只能做到实例与实例之间的继承 , 对于类与类之间的继承需要额外定义方法 , 这里使用Object.setPrototypeOf将superType设置为subType的原型 , 从而能够从父类中继承静态方法和静态属性
饭后小八卦|27 个 JavaScript 技巧,中级前端工程师必须要掌握的
文章图片
使用方法: