学习资料 & 技术文章分享

[itboos]

一些学习的文档，资料整理

typescript 相关:

1. 官网 https://github.com/Microsoft/TypeScript
2. github: http://www.typescriptlang.org/
3. 学习文档:
   https://ts.xcatliu.com/introduction/what-is-typescript.html

[itboos]

文件上传：
是一款简单易用且功能强大的文件上传工具， 支持多种上传方式，包括html5, flash, silverlight, html4。会智能检测当前环境，选择最适合的方式，并且会优先采用Html5。
plupload.com

[itboos]

跨域的相关文章:

1. 不要再问我跨域问题了
   https://segmentfault.com/a/1190000015597029
2. 浏览器的同源策略
   https://developer.mozilla.org/zh-CN/docs/Web/Security/Same-origin_policy
3. Web测试之安全小坦克
   https://www.cnblogs.com/TankXiao/archive/2012/03/21/2337194.html

[itboos]

flex兼容性写法

[itboos]

关于浏览器缓存：和数据存储：cookie、Storage、indexedDB

[itboos]

一些可以想看源码的小的库:

https://github.com/erikolson186/zangodb
MongoDB-like interface for HTML5 IndexedDB
https://erikolson186.github.io/zangodb/

[itboos]

HTTP 相关:

通俗大白话来理解TCP协议的三次握手和四次分手
自己提炼的关于《HTTP权威指南》每章的知识点总结！

[itboos]

Git 学习资料：https://git-scm.com/book/zh/v2/Git-%E5%88%86%E6%94%AF-%E5%8F%98%E5%9F%BA

[itboos]

React.js 相关：

1. 官方github: https://github.com/reactjs
2. React 测试工具 https://github.com/airbnb/enzyme

[itboos]

You-Dont-Need-Momentjs 第三方库替代Moment.js的github文章

[itboos]

Redux 中文文档
awesome-redux
React + Redux 最佳实践

---

redux, redux-saga 数据流图

---

redux源码分析与设计思路剖析 👍
Redux入坑进阶-源码解析.md 👍

[itboos]

数据管理的另一个比较有名的库：
github-mobx
文章：
MobX 原理
mobx初探

[itboos]

github上创建 Pull Request

[itboos]

reselect源码学习

深度解析Reselect库源码
reselect源码分析和最佳实践思考
reselect源码解读

• 总结
• 一个selector 对于计算依赖函数和结果计算函数 使用的是同一个 Memoize函数（默认为defaultMemoize函数）
• 默认的记忆函数只能缓存一个参数和结果
• 定义自己的选中器，使得selector 可以缓存多个数据

// 第一个参数是记忆函数，第二个参数常见的是给参数比较函数
var deepSeletor = createSelectorCreator(customMemoize,  ...rest)

• 当调用selector 的时候，如果检测到传给selecttor的参数发生了变化（这里具体的检测方法取决于比较方法-即参数相等比较方法）

  // 原函数定义：
  export function createSelectorCreator(memoize, ...memoizeOptions) {
    return (...funcs) => {
        let recomputations = 0;         // 步骤二计算的次数（统计作用）
        const resultFunc = funcs.pop(); // 步骤二的结果函数，利用步骤一各个映射函数的结果作为输入，输出最终结果
        const dependencies = getDependencies(funcs); // 步骤一所涉及的映射函数

        /**
         * 将步骤二的结果函数也包装成记忆函数
         * 如果步骤二的函数被触发，将添加重新计算的次数
         */
        const memoizedResultFunc = memoize(
            function () {
                recomputations++; // 实际计算次数加1                
                return resultFunc.apply(null, arguments);
            },
            ...memoizeOptions // 这里把 调用 createSelectorCreator 的剩余参数传给了 记忆函数
        );

        // 如果选择器使用相同的参数进行调用，就无需进行步骤二的计算。
        const selector = memoize(function () {
            const params = [];                  // 要记忆的映射函数计算结果
            const length = dependencies.length; // 映射函数的个数
            for (let i = 0; i < length; i++) {                
                params.push(dependencies[i].apply(null, arguments));
            }
            // 把映射函数的计算结果传给步骤二的结果计算函数
            return memoizedResultFunc.apply(null, params); 
        });

        selector.resultFunc = resultFunc;     // 步骤二的结果计算函数
        selector.dependencies = dependencies; // 步骤一的映射计算函数数组
        selector.recomputations = () => recomputations; // 获得步骤二的结果计算函数的执行次数
        selector.resetRecomputations = () => recomputations = 0; // 重置步骤二的结果计算函数的执行次数
        return selector;
    };
};

[itboos]

前端模块化

CMD 模块定义规范
AMD
使用 AMD、CommonJS 及 ES Harmony 编写模块化的 JavaScript

[itboos]

Promise 相关

Promise 规范
Promises/A+规范-中文翻译版
Promise 的一种简单实现-写的比较详细

promise 的 社区实现

• then 的实现：then/promise
• ES6 Promise: A polyfill for ES6-style Promises

[itboos]

package.json

package.json doc

[itboos]

技术文章分享

• 2020.01
  1、【前端词典】进阶必备的网络基础 already - read
  2、【前端词典】输入 URL 到展现涉及的缓存环节 already - read
  3、优秀开发者应该具备的思维习惯 already - read