衣乌安、随笔

●词法作用域的this: 箭头函数内部的this值绑定到定义时所在的上下文环境，而不是调用时的上下文环境。●无法设置原型链: 箭头函数不具备通过new关键字设置原型链的功能。因此，箭头函数不适合用作构造函数。如果你需要创建类或构造函数，请使用普通的函数声明或 ES6 的类语法。

在 JS 世界中，目前已经有了三种作用域：●●●○ 由let或者const声明的变量，如果被一个大括号{}这样括住了，那么这个大括号就是一个代码块，大括号括住的这些变量就形成了一个块作用域在js引擎中执行上述语句分为两个阶段（一边编译一边运行）：●var a===》 编译时声明●a = 1===》 运行时赋值在运行时js引擎会找当前作用域下是否有a的声明，没有的话就会往上级作用域查找，一直到最外层全局作用域还没有的话会抛出异常。

是一种强大的工具，用于保护对象不受意外修改。它适用于多种场景，特别是在需要保持数据不变的情况下。

记住就好。

中间件是软件开发过程中架构的一个通用概念，其目的在于为运行的主程序提供一个供外部自定义拓展的能力。比如：wen服务的controller层中间件针对request请求处理的前后进行通用的扩展处理、redux中间件针对store数据获取前后的扩展处理。。。

大概思路就是创建一个看不见的video标签，然后监听canplay事件获取视频实际宽高，然后除以最大公约数即为宽高比// 获取最大公约数function getGcd(a, b) { let n1,n2; if (a > b) { n1 = a; n2 = b; } else { n1 = b; n2 = a; } let

本文将实现一个符合Promise/A+规范的Promise类(目前只有then方法)具体规范参考上篇文章：你该知道的promise（1）：A+规范中英文对照翻译/** * 规范2.1. */const PENDING = 'PENDING';const FULFILLED = 'FULFILLED';const REJECTED = 'REJECTED';class MyPromise { constructor(fun) { this.status = PEN

自 es6 推出promise以来，promise强大的异步处理功能被广大开发者认可并广泛使用，那么其实现逻辑真的都非常清楚吗？这里我断断续续花了几天的时间将Promises/A+ 规范结合自己的一丝丝理解和实践做了翻译，方便大家更加容易的来理解 promise 的真实情况。1. Terminology（术语）1.1. “promise” is an object or function with a then method whose behavior conforms to this specif

面试中经常会遇到这样的问题了解call或者apply函数吗？有什么作用？第一反应就是：改变this指向。。巴拉巴拉。。。那手写一个呢？Function.prototype.myCall = function (context = window, ...args) { if (this === Function.prototype) { return undefined; // 用于防止 Function.prototype.myCall() 直接调用 } contex

推荐使用： decimal.jsgithub： https://github.com/MikeMcl/decimal.js/文档： http://mikemcl.github.io/decimal.js/

JSON.stringifyconst isEqual = (a, b) => { return JSON.stringify(a) === JSON.stringify(b)}缺点：会忽略 undefined会忽略 symbol不能序列化函数如果确定不会有上述内容，可以使用递归判断每个字段const isEqual = (a, b) => { ...

旋转： nameRotate, 旋转度数名称与坐标轴间距: nameGap , 间距大体位置调整：nameLocation, end、start、center三种选项but想要是坐标轴名称放到任意位置的话，比如：可以使用nameTextStyle.padding来做调整...

Access-Control-Allow-Credentials首先介绍一下Access-Control-Allow-Credentials这个响应头字段：Access-Control-Allow-Credentials,标志是否允许客户端请求携带Credentials(凭证)。Credentials可以是 cookies, authorization headers 或 TLS client...

验证码的通用作用就是防止机器（爬虫）大规模的采集数据，防止不法分子通过抓包获取数据来模拟用户操作而产生危害用户的行为等。为满足以上简单需求，首先验证码的字符不能放在html标签里面，这可以被爬虫直接获取，因此采用canvas来绘制。为增加爬虫识别难度，对字符进行一定程度是旋转，添加干扰线和干扰点。（虽然以现在机器学习的能力这些别没有什么卵用，但简单的验证码都是这么做的，考虑更为安全的方式可以选择...

from： https://github.com/ronffy/immer-tutorial/blob/master/README.md前言Immer 是 mobx 的作者写的一个 immutable 库，核心实现是利用 ES6 的 proxy，几乎以最小的成本实现了 js 的不可变数据结构，简单易用、体量小巧、设计巧妙，满足了我们对JS不可变数据结构的需求。无奈网络上完善的文档实在太少，所...

往往做项目时会有一些特殊的需求，需要将一些信息存储到本地，如鉴权token、登录信息等这时一些不必要的请求就可以通过使用浏览器本地存储的方式来避免。常用的浏览器存储方案有哪些呢？主要有：cookie、localStorage、sessionStorage以及indexDB。本文将对此进行简要介绍cookie属于文档对象模型DOM树根节点document，而 sessionStorage、loc...

from：https://github.com/alivebao/clean-code-js本文从Clean Code JavaScript中提取出一些个人认为的重点，并掺杂了部分个人见解。对功能类似的变量名采用统一的命名风格反例:getUserInfo();getClientData();getCustomerRecord();正例:getUser();getClient...

const KeyCode = { /** * MAC_ENTER */ MAC_ENTER: 3, /** * BACKSPACE */ BACKSPACE: 8, /** * TAB */ TAB: 9, /** * NUMLOCK on FF/Safari Mac */ NUM_CENTER: 12, // ...

Node.contains()返回的是一个布尔值，来表示传入的节点是否为该节点的后代节点。下面的函数用来检查一个元素是否是body元素的后代元素且非body元素本身.function isInPage(node) { return (node === document.body) ? false : document.body.contains(node);}node...

toLocaleString介绍toLocaleString用于将对象根据语言的不同转换成某种语言环境下的字符串，同时也可以根据传入的参数来判断具体的表现形式。本文主要介绍Number和Date类型的toLocaleString方法Number.prototype.toLocaleString首先谈一个曾经遇到的问题：如何对数字进行千位符格式化？当时想到的做法是换成字符数组循环手动插入,...

全局变量默认是全局对象（window）的属性，常常使用 window.variableName语法来设置和访问全局变量。这边还需要记住：ES5之中，顶层对象的属性等价于全局变量 (浏览器环境中顶层对象是window，Node中是 global对象);ES6之中， var/ function声明的全局变量，依然是顶层对象的属性，但是 let/ const/ class声明的全局变量不属于顶层...

如果想要在某个事件触发后不断的执行某项操作，直到另一个契机才停止，比如另一个事件触发，可以在开始事件中设置 setInterval,然后在结束事件中取消。let interval = null;// 开始事件回调function startEvent() { interval = setInterVal(() => { //do something ...

概述  MutationObserver接口提供了监视对DOM树所做更改的能力，当DOM对象树发生任何变动时，MutationObserver会得到通知。  可以理解为，当DOM发生变动会触发MutationObserver事件。但是，它与事件有一个本质不同：事件是同步触发，也就是说DOM发生变动立刻会触发相应的事件；MutationObserver则是异步触发，DOM发生变动以后，并不会马上...

// 十六进制转RGBAfunction hexToRgba(hex) { let reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; if(hex && reg.test(hex)){ let sColor = hex.slice(1); if (sColor.length == 3) { ...

/** * 千位分隔符 * * 小数位不分割 */function thousandDivide(number) { let isNegative = number < 0; if (isNegative) { number = - number; } let numberArr = number.toString().spli...

不知道有多少人和我一样，以前对于JSON.stringify()的理解就单纯是，传入一个js对象，序列化成一个JSON字符串。其实这么解释的话也毫无问题，但更多是只使用其第一个参数，而对于其第二个参数所知甚少。这篇文章便是讲其第二个参数的用法。JSON.stringify()的第二个参数可以为数组，也可以说是函数。若为数组，则JSON.stringify()的返回值只包含数组中的属性。l...

console 调试技巧目录console 调试技巧前言基本输出分类输出断言输出分组输出表格输出计次输出计时输出最后前言如果统计一番前端最常用的方法，那么 console.log 一定位列其中。无论你写的是原生 JS 亦或者是 JQuery、Vue等等，调试之时，都离不开 console.log 方法。但是，console 对象中...

无论是console.log()还是console.info()或者其他输出，都可以为输出内容添加样式。方法很简单：第一个参数为字符串%c开头表示使用CSS，第二个参数为css样式以log()为例：console.log("%c 绿色的字+背景","color: green; background-image: url(https://www.baidu.com/img/baidu_resu...

柯里化是一种将使用多个参数的一个函数转换成一系列使用一个参数的函数的技术。 function add(a,b) { return a + b }add(1, 2) =&gt; 3// 对于以上函数如果使用柯里化可以这样改造function add(a) { return b =&gt; { return a + b }}add(1)(2) =&gt;...

简介比如有这样的需求，要输入一个名字，这个名字有由firstName,lastName组合而成，然后把这个名字全部变成大写输出来，比如输入jack，smith我们就要打印出来，‘HELLO，JACK SMITH’ 。我们考虑用函数组合的方法来解决这个问题，需要两个函数greeting, toUppervar greeting = (firstName, lastName) =&gt; ...

在某些用户操作中会有些严重影响页面性能,例如:同一时间动态创建大量节点,想一想如果当类似于qq的好友列表中有大量好友,每一个好友占据一个节点,需要大量在页面上添加渲染出来时,假如有10000个同时加载,页面肯定会吃不消会影响性能的.就像这样: &lt;div id="inner"&gt;&lt;/div&gt; /** parentName:容器节点对象 ...

对于全局变量来说如果没有主动销毁则将永远存在.即如果没有主动的将其置为 null ,其始终会占据一部分内存.而对于函数内使用 var 声明的局部变量来说,当函数执行完毕后局部变量会自行销毁.function f(){ var a = 1; //函数执行结束后局部变量a会被自行销毁 alert(a)}f()而闭包的结构则可以改变变量的生存周期,使局部变量不被销毁var...

该方法允许精确添加或修改对象的属性.Object.defineProperty(obj, prop, descriptor)obj:要在其上定义属性的对象。 prop: 要定义或修改的属性的名称。 descriptor: 将被定义或修改的属性描述符。---------------------------------------------------------...

6种方式实现数组扁平化数组扁平化概念数组扁平化是指将一个多维数组变为一维数组[1, [2, 3, [4, 5]]] ------> [1, 2, 3, 4, 5]实现1. reduce遍历数组每一项，若值为数组则递归遍历，否则concat。function flatten(arr) { return arr.reduce((result, ...

逻辑运算符：||    &amp;&amp;　　大家都很熟悉应该，但是今天在javascript中发现了一个不为人知的地方，那就是他们返回的操作数是两个操作数中的一个（且仅有一个）．而不是像ｃ语言中那样返回的是一个布尔值．例如：var a = 42;var b = 'abc';var c = null;console.log(a||b); //42console.log(a...

 都知道sort()可以用来排序，但他具体的过程呢？看下面例子：var arr = [1,5,3,7,3,1];console.log(arr.sort(function(a,b){ console.log(arr) console.log('____________') console.log(a,b); return a-b}))输出结果：[ 1, ...

// 赋值给ａ一个引用类型var a = {n:1};// 拷贝给ｂ，ｂ指向{n:1}var b = a;/*根据js引擎语法解析，从左向右寻找有没有未声明的变量，如果有将该变量提升至作用域顶部并声明该变量．因为a.x不存在，而ａ指向是是{n:1}因此在{n:1}的内存区声明了ｘ属性；而ｘ属性指向的是ａ指向的内存区．后面a={n:2},将ａ指向了一个新的内存区{n:2};而ｂ...

typeof 对于基本类型，除了 null 都可以显示正确的类型typeof 1 // 'number'typeof '1' // 'string'typeof undefined // 'undefined'typeof true // 'boolean'typeof Symbol() // 'symbol'typeof b // b 没有声明，但是还会显示 undefined...

&lt;body&gt; &lt;textarea placeholder="sss" id="t" class="tabIndent" &gt; &lt;/textarea&gt; &lt;input type="text"&gt;&lt;/body&gt;注意　要加　class="tabIndent"