javascript
文章平均质量分 95
tangding12
这个作者很懒,什么都没留下…
展开
-
react之道
转载自翻自Alex Kondov的博文tao-of-react。翻译有纰漏和不足之处请多多指教。 我从2016年开始从事 react 相关的工作,到现在为止仍然没有找到一个适用于所有应用架构和设计的实践。当到代码细节的时候,大多数的团队总是喜欢在架构中加入一些自己的东西。 当然了,本身就不存在一个完美的架构能够适配一切的应用和场景,但是总存在一些通用的方法能够构建高效简洁的代码。 软件架构和设计的目的是为让开发更加的高效和灵活,开发者需要有效的进行代码的开发。 这篇文章收集了一些我和我翻译 2021-02-05 22:12:11 · 292 阅读 · 0 评论 -
实现 Promise 要讲武德——手把手实现一个遵循规范的 Promise
一步步实现一个 promiseA+ 规范的promise。Promises/A+ 规范 Promise 是一个解决js异步调用的方式,它于 ES6 以对象的形式实现和出现。 在 Promise 解决js异步调用的解决思路出现以后,Promise 标准出现以前,github上大大小小的 Promise 库出现了上千个,实现思路和调用方式各不相同,质量也参差不齐。各个类库经常出现引用了三四个 Promise 库功能互相间还不能互通兼容的情况。为了解决这个情况,社区出了一个开源的通用的 Promis原创 2021-01-24 02:22:08 · 286 阅读 · 2 评论 -
一文读懂react实现原理
转载自翻自Rodrigo Pombo的博文Build your own React。翻译有纰漏和不足之处请多多指教。 你可以在这里阅读原文,在这里提交勘误。本文已获得原作者翻译转载授权。如果需要转载翻译请联系原作者或者本人。 我们将一步一步重建一个属于我们自己的react。我们的react架构将和真实的react架构相同,但是去掉了大部分的优化和一些目前不必要的功能。接下来我们将逐步在自己的react中实现这些能力:createElement函数render函数Concurrent翻译 2020-10-04 19:06:36 · 3124 阅读 · 0 评论 -
async await的多异步处理方式
写爬虫时候遇到的批量异步处理的一些思考和总结。async/await是什么 async/await是ES2017加入的标准,它允许用同步的写法来进行异步的操作,它的本质是ES6引入的Promise和Generator函数的语法糖。async function sleepy() { await sleep(1000, 'I awake'); await sleep(500, 'and sleep'); console.log('awake now'); return 0;}/原创 2020-07-23 19:31:54 · 611 阅读 · 0 评论 -
react源码阅读4 ExpirationTime
react更新中优先级依赖的标识ExpirationTime。阅读React包的源码版本为16.8.6。 这一章节,让我们抛弃掉react代码中的联系,单纯的来看ExpirationTime以及一些计算方式。ExpirationTime是什么。 ExpirationTime是一个数字,你可以在react-reconciler包下的ReactFiberExpirationTime.js文件中找到它的定义。export type ExpirationTime = number;Expiratio原创 2020-06-01 09:28:18 · 395 阅读 · 0 评论 -
react源码阅读3 update与updateQueue
react-dom后续updateContainer部分。阅读React包的源码版本为16.8.6。 在上一章节中我们看到了react-dom中render函数的逻辑是给传入的React组件创建了一个fiberRoot对象,用于标识它是整个应用的起点,上面拥有很多应用更新相关的表示符。然后创建对应的fiber给fiberRoot节点,fiber对象是每一个ReactElement都拥有的节点,...原创 2020-04-01 19:09:41 · 575 阅读 · 0 评论 -
关于JS中number位(Bit)操作的一些思考
JavaScript中所有的数字都按照IEEE-754标准储存为64位。但是位操作符却是转换为32位数字进行操作的。关于这一点的可用性进行了一些思考。32带符号整数 先来复习一下32带符号整数的数据表示方式。在计算机中,所有的数据都是被储存为0和1的序列,数字也不例外。比如数字4,通过二进制转换,储存为100。但是整数在实际业务场景中是存在正负的,如何用01序列来表示一个负数呢。我们可以...原创 2020-03-30 14:17:54 · 2211 阅读 · 0 评论 -
不定期更新的源码阅读日常——lodash-3
今天我们来读lodash的节流防抖部分代码。 节流和防抖,是限制函数高频执行的一种手段。它们概念的区别在于,防抖合并多次函数执行为一次;节流是在一定的时间内函数只执行一次。具体的区别可以参考lodash官网推荐的这篇文章。 虽然明细了概念的区别,但是在lodash源码中,这两个方式其实是一个实现。lodash中_.debounce对应防抖,_.throttle则对应节流。我们先来看一...原创 2020-03-22 18:20:01 · 249 阅读 · 0 评论 -
react源码阅读-react-domRender
react-dom入口函数以及基本数据类型。阅读React包的源码版本为16.8.6。 在第一章节我们了解到,react包本质上是一个数据结构建立的抽象屏障,提供起来供react的其它包,诸如react-dom,react-native调用。在这一章中,进入react-dom的源码阅读。 根据package.json的main字段入口,我们可以找到react-dom的入口文件为src/...原创 2020-03-22 18:15:32 · 881 阅读 · 0 评论 -
不定期更新的源码阅读日常——lodash-2
今天我们来读lodash的深拷贝部分代码。 lodash的clone和cloneDeep两个方法分别对应浅拷贝和深拷贝。两个函数其实都依赖于baseClone方法,通过传入一个标识来进行深拷贝或者浅拷贝的区分,我们来简单看一下baseClone的入参。/** Used to compose bitmasks for cloning. */var CLONE_DEEP_FLAG = 1,...原创 2020-01-10 23:32:17 · 196 阅读 · 0 评论 -
react源码阅读-基础
react包基础概念以及React包的两个核心api阅读。阅读React包的源码版本为16.8.6。基础概念react包 react包的本质上是建立一个react相关数据类型的抽象屏障,它创建了一系列符合react渲染调度的数据结构,在各个react相关平台(dom,native,render)上进行渲染调度。 在阅读源码前,我一度认为诸如createElement和Compone...原创 2019-12-28 22:40:50 · 689 阅读 · 0 评论 -
《JavaScript函数式编程》4~8 读后感
《JavaScript函数式编程》4~8章讲了函数式编程通用的几种模式,以及在实际业务场景测试、异步操作的环境下的运用方式。函数的柯里化与管道模式 在《JavaScript函数式编程》1~3 读后感中曾经阐述过:在函数式编程思想中,需要把每一个函数功能拆分为最小单元的功能块。即:函数的设计要精简,每个函数实现的功能需要专一,以组合的方式来实现所需要实现的业务逻辑。函数柯里化就是这样思...原创 2019-12-23 17:06:25 · 113 阅读 · 0 评论 -
《JavaScript函数式编程》1~3 读后感
《JavaScript函数式编程》一书从语言,业务场景,程序设计的角度阐述了为什么JS需要函数式编程,JS函数式编程实际使用的场景及优势。 本书的1-3章,介绍了什么是函数式编程,JS语言中函数式编程的特性,以及如何使用函数式编程解决实际场景。 函数式编程是一种代码组织形式,它相对于命令式的编程概念。函数式编程思想简单来说,就是一个纯度的,最小功能化的,通过流方式组织上下文的编程模式。...原创 2019-12-14 03:31:49 · 156 阅读 · 0 评论 -
关于JS的Date你所要知道的二三事
半个多月没更新博文了……鬼知道我经历了什么。连续十几天的班赶项目,在五一加班两天后,终于闲暇一会,整理一下前些时间项目所用到的Date对象进行处理的知识点。Date Date是JavaScript中一个原生构造函数,可以生成时间对象。但实际上可以使用非构造函数的方式来调用Date,此时生成的是一个当前时间的字符串。 与其他原生构造函数不同,Date没有字面量的声明方法。var ne...原创 2019-12-04 13:05:31 · 163 阅读 · 0 评论 -
Promise的出现与实现
这篇文章总结一下JS本身单线程异步的局限性(promise出现的原因),以及实现一个简易的Promise。单线程与异步 JavaScript是一个单线程执行的语言,在不考虑异步编程的情况下,它执行的顺序就是一个eventLoop的简单循环。比如书写一段简单的JS代码:// 声明两个变量,和一个函数var demoVariA = 100;var demoVariB = 200;// 函...原创 2019-12-02 10:12:38 · 430 阅读 · 0 评论 -
JS模块的艺术
ES6的module导出引入总结。基本module语法 ES6提供了export和import语法,给予了JS模块化代码组织形式的能力。export语句用于从模块中导出函数、对象或原始值,以便其他程序可以通过import语句使用它们。export 我们假设我们拥有一个fileA.js的文件,它向外export了这些:// fileA.jsexport const DEMO_VALU...原创 2019-12-01 23:41:43 · 109 阅读 · 0 评论 -
隐藏在"=="后面的JavaScript隐式转换
逛遍各大程序社区论坛,不少自称编程“大牛”的人最喜欢调侃的语言就是JavaScript。这门被一周创建出来的动态语言被嘲讽没有任何编程的严谨性,其中最为被大家们津津乐道的就是JS中的"=="号。实际上你在使用时,经常会发现这样的情况:// 一个数字既不是true也不是false40 == true // false40 == false // false// 扑朔迷离的字符0null...原创 2019-12-01 23:06:07 · 99 阅读 · 0 评论