我是张跑跑

IIFE

数组 fill 方法有坑呐

在工作中重复造轮子纯粹是浪费生命，但为了学习而尝试造一些 mini 版的轮子也是非常有意义的，而且全面的模拟常用的轮子还可以加深你对这些轮子的理解。

import-html-entry 是 qiankun 中一个举足轻重的依赖，用于获取子应用的 HTML 和 JS，同时对 HTML 和 JS 进行了各自的处理，以便于子应用在父应用中加载，那它究竟做了些什么呢？下面就让我们一起来揭开它神秘的面纱吧！！

发布订阅模式能够广泛地应用于异步编程中，同时还可以让对象松耦合的联系在一起。这种设计模式也常见用于各大框架中，来简单看看然后自己写一个吧！！

一次性弄清楚静态、动态类型，强、弱类型

ES6 Promise 相较于参照 Promises/A+ 规范完整地实现的 Promise 额外的增加了两个实例方法，七个静态方法，一起来实现看看吧！！

咋一看手写 Promise 无从下手，仔细一看原来如此简单。 跟着 Promises/A+ 规范，一步一步，纵享丝滑

细细看完 Promises/A+ 规范后才发现，原来 promise 的实现如此简单的，你也可以随手写个 promise 了！！ 喜欢都来看看吧！！

如果你曾维护过大型项目并且其中大量使用 vuex 进行状态管理，相信你曾遇到过因不知道某个状态是在哪一个组件初始化、哪一个组件更新而不得不逐个检查的困境，可项目中的确又需要这样的状态管理，那么如何”正确“的使用 Vuex 便成了本文的主题。

ES5类和继承，相信你在面试中老遇到了！老有意思了！

man.work().sleep(1000).firstSleep(5000).work().sleep(1000)\n这是什么？？来来来，我们来搞定它！！

树形结构和平铺的转换——JS基础（递归）

自己动手，丰衣足食；\n轮子嘛，自己搞起来！！\n手写模板引擎！！

防抖和节流是前端性能优化上非常重要的技术，如何实现一个防抖和节流，不仅能轻松拿捏面试官，更能在开发中提高应用性能

JS的魅力——sum(1)(2)通用函数

自己动手，丰衣足食；\n轮子嘛，自己搞起来！！\n手写Promise！！

文章目录详解 script 标签中 defer 和 async1. defer 和 async2. script 中 type=module详解 script 标签中 defer 和 async1. defer 和 asyncHTML 网页中，浏览器通过<script> 标签加载 JS 脚本。<!-- 页面内嵌的脚本 --><script type="application/javascript"> // module code</script&gt

JS 中 reduce 实现函数的 compose1. 前言如有以下三个函数，希望能执行 f3(f2(f1(n))) 也就是 f2 的入参是 f1 返回的结果， f3 的入参是 f2 返回的结果，直接写当然是可以的，如果我的函数有很多个呢？10个这样的函数，是不是得写成 f10(f9(…f2(f1(n))))呢？那有没有什么办法可以解决呢？const f1 = (n) => { console.log(1); return n + 1;}const f2 = (n) =>

文章目录1. 前言2. 用于准确得出数值类型的方法1. 前言JS 中有几个可以简单判断数值类型的方法，比如 typeof， instanceof, 但是都存在问题，比如typeof在判断引用类型的时候就存在问题，Array Date 都是 Object, instanceof 也不准确，它是用于判断原型链上是否有某个构造函数的 prototype。如下所示：typeofundefined 表示值未定义 或者 未初始化，其实这里非常让人疑惑，就是未定义和未初始化的变量都是 undefinedb

ES6 单例模式，数据库连接中常用！

文章目录JS 中 字符串 和 Base64 编码的转换1. 利用 buffer 机制转换JS 中 字符串 和 Base64 编码的转换1. 利用 buffer 机制转换const str = "张跑跑";const str_to_base64 = Buffer.from(str).toString("base64");console.log(str_to_base64);const base64_to_str = Buffer.from(str_to_base64, "base64").toS

操作数组的方法concat()连接两个或更多的数组，不影响原数组，返回一个新数组const a = [1, 2];const b = [3, 4];console.log(a.concat(b), a, b);// [ 1, 2, 3, 4 ] [ 1, 2 ] [ 3, 4 ]join()把数组的所有元素都放入一个字符串中。元素通过指定的分隔符进行分隔。返回字符串，不影响原数组。const a = [1, 2];console.log(a.join('--'), a);

其实很简单我记录一下过程，然后再整理获取系统环境变量env 查看 然后 $ 对应名字即可，比如 $PATHshell 获取这里关于变量的设置和使用#!/bin/bashpath=$PWD# 使用也很简单 菜鸟教程sed 文本替换这一步就是关键，sed -i "s/arrow/arrow_zb/g" ./master这样就实现了替换某个文件，自然可以实现，如sed -i "s/arrow/$path/g" ./master意思就是把arrow替换后成我们想要的系统变

目录基于verdaccio搭建私有npm仓库方案1. 前言2. 私有仓库搭建方案选择3. 搭建步骤(非docker)4. 基于docker搭建5. 上传packages基于verdaccio搭建私有npm仓库方案1. 前言前端的生态已经十分繁荣了，随着需求越来越复杂，前端的应用也越来越大了，为了更好地服务解耦、团队协作等原因，一般大型前端应用，都会将项目分成几个服务来维护，而在这些服务中，一般都会存在大量相同组件，特别是UI部分的组件，很显然这些组件我们不应该在每个服务都copy一份，这样如果我要增加

1. 简述经常使用 vue 和 react 的小伙伴就知道，很多时间我们需要使用当前时间戳来作为列表的 id；当然平时的获取也是可以的；博主就经常用到，经常忘记。2. JS获取当前时间戳2.1 Date.now()Date.now()最简单最有效2.2 new Date().getTime()new Date().getTime()...

1 概述addEventListener 和 直接添加事件的区别！2 详述首先，需要讲一下绑定事件的分类，也就是添加事件的方法，在js中，一般分两大类，直接添加和事件监听（这里的说法有待考究）；test.onclick = function(){}test.addEventListener(“click”, function(){})因为在 js 中不支持事件重载（也就是同时绑定两...

1 概述事件委托，也称为事件代理，主要目的包括以下两点：动态添加为未来的新元素添加事件提高性能：每一个函数（事件）都会占用内存空间，只需添加一个事件处理程序代理所有事件,所占用的内存空间更少；利用的原理是事件冒泡机制。2 详解2.1 事件这是博主的另一篇文章，里面简述了事件的分类和不同处！点击查看！2.2 事件触发机制事件捕获和事件冒泡机制事件捕获当一个事件触发后,从W...

1 概述arr.fill() 是 ES6 的新方法。fill() 方法用于将一个固定值替换数组的元素。2 fill()语法： array.fill(value, start, end)参数value 必需。填充的值。start 可选。开始填充位置。end 可选。停止填充位置 (默认为 array.length)填充是从 start 位置开始，到 end-1 位置结束，不包含en...

1 概述document.write() 方法可向文档写入 HTML 表达式或 JavaScript 代码。可列出多个参数(exp1,exp2,exp3,…) ，它们将按顺序被追加到文档中，默认情况是不会换行的。我们通常按照两种的方式使用 write() 方法：一是在使用该方在文档中输出 HTML，另一种是在调用该方法窗口之外的窗口。在第二种情况中，请务必使用 close() 方法来关闭文档...

1 概述前端路由是指，不同的url展示不同的页面，例如Vue React中，虽然是单页面，但是通过路由还是实现了我们想要的功能。前端路由的模式分为两种：hash模式：http://localhost/Day/hash.html#/home 存在一个 # 符号，和普通的url相比有些丑history模式：http://localhost/home 这和普通的URL没有区别，非常好看那...

1 概述jsonp能够实现跨域，那么其原理是什么呢？简单点说，就是利用script标签，因为script标签是不存在跨域限制的。2 详述假设目前有两个文件，一个前端html，一个后端文件php，所在位置分别为：html: http://localhost/jsonp/jsonp.htmlphp: http://127.0.0.1/jsonp/data.php要想前端直接访问此后端的数...

1 概述数组去重2. 代码示例var arr = [1,2,3,3,4,6,2,1];var len=arr.length;// 1. indexOffunction foo1(arr){ var result=[]; for(var i=0;i<len;i++){ if(result.indexOf(arr[i])==-1){ ...

1 概述这是在使用JQ时，当你想要通过事件绑定的方法来将现有的和未来的元素都绑定上某个事件时，使用$("").live(eventName,data,function)时报的错误，错误原因是live在jq1.7版本就已经移除了，目前使用的是on；2 解决办法使用on即可解决并且实现同样的效果！$("li").live("click",function(){}) // 报错$("li")...

如何禁止输入两个小数点利用正则，匹配到小数点，然后直接替换掉即可，详细的可见下面代码，如有不明白可评论或私信input 框禁止输入非数字和小数点以外的字符（两种思路和方法）这是博主的另一篇文章，与本文密不可分<body> <div> <input type="text" oninput="inputNumber(this)"> </div> <script> function inputNum

要实现 input 框禁止输入非数字和小数点以外的字符，一共有两种思路:利用input事件和正则，输入非数字和小数点以外的字符时，直接替换为空利用keydown事件和阻止默认事件，输入非数字和小数点以外的字符时，直接禁止输入下面就来实现上述两种方法，为了让更多的同学能够明白，看懂，因此我这里没有使用框架，直接采用原生的 js（好久没写，生疏了）input事件和正则<body> <div> <input type="text" oninput="

1 概述Ajax是前端中发送请求最最基础的方法，在jq中已经封装好了，在axios中更是多次封装，那Ajax的实现原理到底是怎样的呢？本博文就原生Ajax进行解析和代码展示，2 Ajax创建XMLHttpRequest对象； 注意兼容注册回调函数，在XMLHttpRequest中设置要发送的请求，利用的是open（first,second,third）方法1）param first：...

1 概述阻止冒泡和默认事件都是js中非常重要的，其实很简单，只需要一到两句语法即可，关键在于需要做兼容！2 阻止冒泡事件function stopBubble(e) { if(e && e.stopPropagation){ e.stopPropagation(); } else { window.event.cancelBubbl...

1 概述浮点数指的是带有小数的数值，浮点运算即是小数的四则运算，常用来测量电脑运算速度。大部份计算机采用二進制（b=2）的表示方法。位(bit)是衡量浮点数所需存储空间的单位，通常为32位或64位，分别被叫作单精度和双精度。2 误差现象console.log(0.1+0.2); // 输出 0.30000000000000004console.log(0.15+0.15); // ...

1. 总述在JS 中scrollWidth、scrollHeight、scrollLeft 、scrollTop 属性在做一些复杂的交互效果中是非常常用的，因此在本博文中详细的介绍并给出实例。以上的4个属性是成对出现的，因此下面介绍中也成对的介绍，在实例中为了减少代码量，我直接用的id，实际开发中不推荐。2. scrollWidth和scrollHeight2.1 概念element...