随笔分类 - 前端技术栈 / JavaScript
摘要：1 关于Proxy Proxy，代理，是ES6推出的一个特性。通过Proxy我们可以拦截对象的某些操作，并在其中加入定制化代码，使这些操作变得更加丰富灵活 语法: let proxy = new Proxy(target,handle) Proxy表示创建代理实例的类,target为被代理的对象，h
阅读全文
摘要：一、关于new运算符 这篇博客主要关注如何实现new运算符，不太了解new的同学可以看看这篇博客 链接: 谈谈JS new运算符到底做了些什么 二、前期准备: 实现一个new运算符需要做哪些事情 创建一个空对象 instance 绑定构造函数的this,使其指向instance,执行构造函数为ins
阅读全文
摘要：一、关于new 在面向对象的语言中，new关键字总是用于实例化一个对象 在JavaScript中，作为一个运算符，new常与构造函数一起使用 let map = new Set() function Apple(size,color){ this.size = size this.color = c
阅读全文
摘要：前言 无论是做项目还是找工作，数组扁平化都是一种重要的知识技巧 在2019年发布的ES10中，js更是对数组新增了扁平化的API：Array.protoytype.flat 下面将给出flat实现的几种方式，顺便谈谈这些方式的优缺点 一、转成字符串处理 思路是将数组转成成字符串处理，通过join或者
阅读全文
摘要：思路是使用race这个api, 同时开启定时器和请求两个异步任务 如果定时器的timeout到达之后请求还没返回，就可以看做是请求超时 promise.race[req,timer]
阅读全文
摘要：1 js 几种 for 循环的区别 测试 loop 类型: for forEach forOf forin forof Object.keys 测试维度: 1. 是否可访问非索引的属性 2. 是否会访问到empty元素 3. 是否可中断循环 4. 是否可访问原型属性 5. 是否可访问不可枚举属性 6
阅读全文
摘要：1 CommonJS规范 CommonJS规范中，每个文件都可以当做一个模块，并且模块的加载是同步阻塞的，也是缓存的 在服务器端，NodeJS本身实现了CommonJS 在浏览器端，在使用Browserify编译之后可以支持CmmonJS 1.2 服务器端 Node环境中，一般使用module.ex
阅读全文
摘要：1 关于amd Asynchronous Module Definition 异步模块定义 https://github.com/amdjs/amdjs-api/wiki/AMD 专门用于浏览器端，再amd规范中，模块的加载是异步的 2 暴露模块 使用define定义暴露的模块,在暴露之前需要在入口
阅读全文
摘要：1 ES6模块化 使用export 或 export default暴露,使用import引入 ES6比较独特的一点就是，使用export暴露时，一个模块可以暴露多个对象 2 暴露模块 单次暴露 export default { fn: () => console.log('module1 fn')
阅读全文
摘要：定义与区别 seal: 封闭。只允许操作入参对象原本就可写的属性 freeze: 冻结，不允许操作所有属性，包括原型与原型链 应用 React源码，开发模式下 初次渲染，ref会被赋值为一个具有current的seal对象，而props.children则是一个childArray的冻结对象 fre
阅读全文
摘要：在js中，NaN作为一种特殊的number类型，和自己比较时并不严格相等 可以用Object.is(NaN, param), 或者isNaN来进行判断 在一些判断严格相等的场景，如数组去重、深拷贝等，需要注意这个问题
阅读全文
摘要：提取外层关键数据(如果需要)，将双层数组扁平化为单层 单层再做转换，很容易得到O(n)的实现 const infos = [ { time: '2022-02-21', data: [{ Duration: 22, Spec: "h264" }, { Duration: 33, Spec: "h26
阅读全文
摘要：const a = {query:{b:1}} const {query:{b}} = a console.log(b) // 1 const t = {query:{b:{d:{e:2,f:3}}}} const {query:{b:{d:{e}}}} = t const {query:{b:{d
阅读全文
摘要：消息订阅与发布 订阅: pubsub.subscribe(name,callback) 发布: pubsub.publish(name,payload) 取消订阅: pubsub.unsubscribe(id) 案例 App.vue <script> import pubsub from "pubs
阅读全文
摘要：let a = { n: 1 } a.x = a = { n: 2 } console.log(a.x); /** 这道题打印undefined 第一行 开辟了堆内存o1, 存储{n:1} 第二行 a.x 指向后续的运算结果， 即此时o1.x = undefined a = {n:2}, 即开辟了堆
阅读全文
摘要：实现bind 需要注意的是要考虑作为构造函数的case 构造函数会指定this为new出来的实例对象，此时bind指定的目标无效 /** * fn.bind(context) * Function.bind(this: Function, thisArg: any, ...argArray: any
阅读全文
摘要：手写apply /** * Function.apply(this: Function, thisArg: any, argArray?: any): any * @param {*} context */ Function.prototype._apply = function(context){
阅读全文
摘要：手写call /** * 实现call * @param {*} context * fn.call(target,...args) * 让fn中的this指向target * 思路是函数默认指向调用者，在目标对象上挂载fn，执行的时候fn中的this默认指向目标对象， 执行完拿到结果并删除这个挂载
阅读全文
摘要：实现reduce /** * * @param {*} cb callbackfn: (previousValue: any, currentValue: any, currentIndex: number, array: any[]) => any): any * @param {*} thisA
阅读全文
摘要：实现filter /** * 实现filter * @param {*} cb cb : (predicate: (value: any, index: number, array: any[]) => value is S, thisArg?: any): S[] * @param {*} thi
阅读全文
