发表于 | 分类于 | 阅读次数:

1、pm2简介

pm2（process manager）是一个进程管理工具，维护一个进程列表，可以用它来管理你的node进程，负责所有正在运行的进程，并查看node进程的状态，也支持性能监控，负载均衡等功能。

1.1、使用pm2管理的node程序的好处

  1. 监听文件变化，自动重启程序

  2. 支持性能监控

  3. 负载均衡

  4. 程序崩溃自动重启

  5. 服务器重新启动时自动重新启动

    阅读全文 »

发表于 | 分类于 | 阅读次数:

函数防抖(debounce)

概念：事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。

使用场景：

  • input 搜索联想且在不断输入时，可用防抖来节约请求资源

  • Window触发resize、浏览器滑动scroll时，不断的触发事件，用防抖来让其只触发一次

代码实现：

1
2
3
4
5
6
7
8
9
10
11
function debounce(func, ms = 1000) {
  let timer
  return function (...args) {
    if (timer) {
      clearTimeout(timer)
    }
    timer = setTimeout(() => {
      func.apply(this, args)
    }, ms)
  }
}
阅读全文 »

发表于 | 分类于 | 阅读次数:

reduce方法

reduce 方法对数组的每个元素执行提供的reducer函数，将结果汇为单个返回值。

1
arr.reduce(callback(accumulator, currentValue, index, array), initialValue)
  • callback 执行数组中每个值的函数，包括四个参数。
  1. accumulator回调callback方法执行后的返回值
  2. currentValue数组中正在处理的当前值
  3. index数组中正在处理的当前值的索引
  4. array调用reduce方法的数组
  • initialValue设置的初始值（可选）

注意：若提供了初始值 initialValue，将作为第一次调用callback函数时的第一个参数 accumulator 的值，索引 index从0开始，迭代次数为 arr.length；若没有提供初始值initialValue，则把数组第一个值作为callback第一个参数的值，索引 index从1开始，迭代次数为 arr.length - 1

阅读全文 »

发表于 | 分类于 ， | 阅读次数:

示例数组

1
const baseArr = [1, 1, '1', '1', 2, true, 'true', false, false, null, null, {}, {}, [], [], undefined, undefined, NaN, NaN]

ES6 的 Set 去重

Set数据类似于数组，但是成员的值都是唯一的，没有重复的值。它可以接收一个数组，类于：let a=[1,2,3,1,2] Set(a)=>1,2,3 所以可以使用Set()实现去重。

1
2
3
4
5
const resultArr = [ ...new Set(baseArr) ]
// 或者
const resultArr = Array.from(new Set(baseArr))

console.log(resultArr)  // [1, "1", 2, true, "true", false, null, {}, {}, [], [], undefined, NaN]

Set内部判断两个值是否不同，使用的算法叫做“Same-value equality”，它类似于精确相 等运算符（ === ），主要的区别是 NaN 等于自身，而精确相等运算符认 为 NaN 不等于自身。 另外，两个对象总是不相等的。

阅读全文 »

发表于 | 分类于 | 阅读次数:

原理

利用Set的 .has(value) 方法 ，判断值是否为 Set 的成员，并组合数组的 .filter()方法，返回新的数组。

简单的数组

1
2
3
4
5
6
7
8
9
10
11
const arr1 = [1, 2, 3, 4]
const arr2 = [3, 4, 5]

// 并集
const merge1 = [...arr1, ...arr2])]

// 交集
const intersect = [...new Set([...arr1].filter(item => arr2.has(item)))]

// 差集
const diff = [...new Set([...arr1].filter(item => !arr2.has(item)))]
阅读全文 »

发表于 | 分类于 | 阅读次数:

基础属性

draggable：true，表示元素可以被拖动; false，表示元素不可以被拖动

拖拽事件

Event On Event Handler Fires when…
drag ondrag 当拖动元素或选中的文本时触发
dragend ondragend 当拖拽操作结束时触发 (比如松开鼠标按键或敲“Esc”键)
dragenter ondragenter 当拖动元素或选中的文本到一个可释放目标时触发
dragexit ondragexit 当元素变得不再是拖动操作的选中目标时触发
dragleave ondragleave 当拖动元素或选中的文本离开一个可释放目标时触发
dragover ondragover 当元素或选中的文本被拖到一个可释放目标上时触发（每100毫秒触发一次）
dragstart ondragstart 当用户开始拖动一个元素或选中的文本时触发
drop ondrop 当元素或选中的文本在可释放目标上被释放时触发
阅读全文 »

发表于 | 分类于 | 阅读次数:

基础属性

draggable：true，表示元素可以被拖动; false，表示元素不可以被拖动

拖拽事件

Event On Event Handler Fires when…
drag ondrag 当拖动元素或选中的文本时触发
dragend ondragend 当拖拽操作结束时触发 (比如松开鼠标按键或敲“Esc”键)
dragenter ondragenter 当拖动元素或选中的文本到一个可释放目标时触发
dragexit ondragexit 当元素变得不再是拖动操作的选中目标时触发
dragleave ondragleave 当拖动元素或选中的文本离开一个可释放目标时触发
dragover ondragover 当元素或选中的文本被拖到一个可释放目标上时触发（每100毫秒触发一次）
dragstart ondragstart 当用户开始拖动一个元素或选中的文本时触发
drop ondrop 当元素或选中的文本在可释放目标上被释放时触发
阅读全文 »

发表于 | 分类于 ， | 阅读次数:

问题点

MacOS，安装npm全局包提示没有写入权限，提示如下：

npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules

如图：

解决方法：

修改npm包所安装目录的权限，代码如下：

1
sudo chown -R $USER /usr/local

注意：$USER 为Mac用户名，sudo操作需要输入用户密码

查看目录是否已切换权限，代码如下：

1
$ls -l /usr/local

完毕，即可进行npm全局包安装

阅读全文 »