内容主要为前端技术

*本文会讲解React中Error Boundaries的完整实现逻辑。

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言本文对微前端的概念和场景进行科普，介绍一些主流的微前端的实现库及其用法，并讲解部分这些库的原理和实践知识。一、微前端是什么？二、qiankun微前端框架总结前言本文对微前端的概念和场景进行科普，介绍一些主流的微前端的实现库及其用法，并讲解部分这些库的原理和实践知识。一、微前端是什么？在项目迭代中，随着业务的发展壮大，项目的功能模块通常也会越来越多。可能原来所有的代码模块都在一个仓库里，由一个团队负责。但随着功能模块.

柯里化和偏函数在一些js库中会有实现，如loadsh，underscore等，今天我们来探讨一下~柯里化会让一个多参数的函数转换成单参数的函数：fn(a,b,c) ——> fn(a)(b)(c )function add(a, b) { return a + b;}add(1, 2) // 3// 假设有一个 curry 函数可以做到柯里化var addCurry = curry(add);addCurry(1)(2) // 3它的实际应用如：// 虽然 ajax 这个函

本人用atom大概一年了，vscode大概两个月，但其实最近一两天才开始研究它们的不同，主要是插件这块和一些优缺点（自身感受）。atom：内存：占用大，插件越多，开启越慢git：有修改文件的标识界面：更加美观，有一个写代码特效的插件（当时选择的原因）插件：插件存储在packages里vscode：内存：占用小，感觉开启更快，更轻量git：无修改文件的标识稳...

log为一个方法添加 log 函数，检查输入的参数：class Math { @log add(a, b) { return a + b; }}function log(target, name, descriptor) { var oldValue = descriptor.value; descriptor.value = function(...args) { console.log(`Calling ${name} with`, args); .

装饰器主要有两个用处:装饰类装饰方法或属性废话不多说，先上代码感受一下下面是装饰类的：function log(target, name, descriptor) { console.log(target)//Car console.log(name)//undefined console.log(descriptor)//undefined}@log // 装饰类的装饰器class Car { run() { console.log('Car is runni

首先写一个获取promise的函数：const getPromise = function(val){ return new Promise((resolve)=>{ setTimeout(()=>{ resolve(++val) },1000) })}再写一个generator函数：function *generatorFn(){ const res1 = yield getPromise(1) console.log(res1) const res2 = y

axios是xhr的封装，支持promise操作的请求库，并且提供了一系列方便的api接口。请求和返回的拦截// 添加请求拦截器axios.interceptors.request.use(function (config) { config.headers.token = 'added by interceptor'; return config;});// 添加响应拦截器axios.interceptors.response.use(function (data) { da

预加载(preload)：资源预加载是另一个性能优化技术，我们可以使用该技术来预先告知浏览器某些资源可能在将来会被使用到。预加载简单来说就是将所有所需的资源提前请求加载到本地，这样后面在需要用到时就直接从缓存取资源。预请求(prefetch)：是为了提前加载下一个导航所需的资源，提升下一次导航的首屏渲染性能。但也可以用来在当前页面提前加载运行过程中所需的资源，加速响应。预渲染(prerendering)：预渲染不像服务器渲染那样即时编译 HTML，它只在构建时为了特定的路由生成特定的几个静态html页面

无论是分布式计算系统、服务端应用程序还是 iOS、Android 原生应用都会存在内存泄漏问题，Web 应用自然也不可避免地存在着类似的问题。虽然因为网页往往都是即用即走，较少地存在某个网页长期运行的问题，即使存在内存泄漏可能表现地也不明显；但是在某些数据展示型的，需要长期运行的页面上，如果不及时解决内存泄漏可能会导致网页占据过大地内存，不仅影响页面性能，还可能导致整个系统的崩溃。前端每周清单推荐过的 How JavaScript works 就是非常不错地介绍 JavaScript 运行机制的系列文章，其

装饰器的原理其实就是Object.defineProperty()symbol使得对象属性可以不是字符串了，并且他的唯一性，避免属性别覆盖未来禁用第三方cookie，可以使用替代方案如：把id当请求字段，每次请求带上；浏览器指纹，浏览器的版本，系统版本等等一系列信息组合，很难出现重复http缓存，浏览器缓存，应用缓存都有区别csp（内容安全策略）防止xss是让网站配置白名单的方式...

1 浏览器缓存属于私有缓存，代理服务器缓存属于公有缓存，可以给多个用户使用。2 除了使用跳板机登录内部机器外，可以直接使用内部机器登录内部机器。

1 react使用rollup打包，flow做类型检测。2 解构赋值不仅可以用在对象上，也可以用在数组上。3 flow主要使用冒号来添加类型限制；不手动添加flow也可以自动识别部分类型错误。4 python2的print打印简单类型会做编码转换，打印对象不会；print打印单个参数会转换，两个参数也不会。5utf-8一般是\x带头的，后面跟两位字母或数字，例如\xe6\xb5\x8b\xe8\xaf\x95\xe5\x95\x8a，三个\x代表一个汉 ...

1 symbol可以消除魔法字符串；避免对象key被覆盖；class中定义私有方法。2 for of实现如下。function forOf(obj, cb) { let iterable, result; if (typeof obj[Symbol.iterator] !== "function") throw new TypeError(result + " is not iterable"); if (typeof cb !== "function..

1 原型链继承需要定义个空函数来过渡。2 html文件一般设置为协商缓存，Cache-Control:max-age=0表示过期，则会使用协商缓存的字段etag等来执行判断。3 async/await也有缺点，太同步化容易把一些并行请求写成串行，try/catch的错误机制不太友好等。4 清除浮动主要有两种，一种是clear方式，它包括加空标签，伪元素等；一种是overflow设置，它的原理是bfc。5 flex布局中,justify-content设置横向排列，align-ite...

1 fiber分片机制主要包括两个方向：一个是调度机制，把任务分成多个小任务，在浏览器空闲时调用，检测到用户输入等高优先级的事件及时让给渲染线程；二是数据结构，通过增加父节点和兄弟节点指针来让它可以随时中断，并且下次能找到正确位置继续执行。2 ajax会有跨域问题，但是表单提交不会有（img，script等也不会），因为表单提交到只能提交到另一个域，没法获取返回数据，ajax却可以，同源策略就是不让获取另一个域的内容。3 csrf如果是get请求可以使用img，script标签来实施攻击，po...

1 前端性能优化无非就这四点：资源优化（文件优化）、网络优化、渲染优化、用户体验优化。2 前端定时器是浏览器或node实现的，不是v8。3 ssr会有前后端不同时发布，前端js，css资源和后端html资源不一致问题。...

httponly能禁止js获取cookie，但是浏览器本身会把cookie添加到请求头的特性，导致xss中加个ajax请求，后端还是可以拿到cookiecookie太大会占用网络，应该只有需要发送到服务端的数据（如用户id）存cookie，其它存localstorage...

1 实现call或者apply，内部实现是把方法赋给没有此方法的对象（对象上新增方法，并给它赋值），并且执行；实现bind，内部实现是调用call或者apply即可。2 选择排序不是冒泡哦！...

就

在我们老大的要求下，准备一个月读完这本书，巩固下基础，并写十篇总结博客。1.语句和表达式区别let a = 1+ 3;等号右边是表达式，整行是语句，一般在一些框架中如vue中模板{{}}中可以写表达式，return可以写表达式等。2.变量声明可以连续声明多个变量如： let k=1,j下图是一些常规关于变量的一些报错：变量常规报错3.标识符最后一种...

问题一：之前如果有人问我这个问题，我一定回答是，因为经常上传会在找工作的时候给面试官看自己的github里面的提交日志，如果每天都有提交，那一定会让面试加分。而且，github上如果有很多粉丝或者star会是很酷的一件事。但是，github的核心追求是开源，而我们工作中几乎都是需要代码保密的（除非你的团队正在做着开源项目），当然也可以选择github上收费的私有库，但是如果团队选择的代码仓库并...

第一周react中props.children相当于vue里slot插槽作用，来展示父组件穿过来的内容。{…obj, attr:val} 和 Object.assign({}, obj, {attr:val})作用类似。vue的minix，react的高阶组件、render prop都是解决功能复用问题；react的hook是函数式编程的全新解决方案。扁平化的数据结构原则，Array+Object不要嵌套太深。Centos有yum（基于rpm），Ubuntu有apt-get，m

console.log(Object.prototype.toString.call([]));//[object Array]console.log(Object.prototype.toString.call({name: "jerry"}));//[object Object]这是因为toString为Object的原型方法，而Array ，function等类型作为Obje

闭包的概念和特性首先看个闭包的例子：function makeFab () { let last = 1, current = 1 return function inner() { [current, last] = [current + last, current] return last }}let fab = makeFab()console.log(fab()) // 1console.log(fab()) // 2console.log(fab())