前端日记

npm常用命令简介npm是跟随node一起安装的包（模块）管理器。常见的使用场景有以下几种： 允许用户从npm服务器下载别人编写的第三方包到本地使用。 允许用户从npm服务器下载并安装别人编写的命令行程序到本地使用。 允许用户将自己编写的包或命令行程序上传到npm服务器供别人使用。 常用命令检测是否安装及版本1npm -v # 显示版本号说明已经安装相应的版本 生成package.json文件1npm init package.json用来描述项目中用到的模块和其他信息 安装模块123456789101112131415161718192021npm install # 安装package.json定义好的模块，简写 npm i# 安装包指定模块npm i <ModuleName># 全局安装npm i <ModuleName> -g # 安装包的同时，将信息写入到package.json中的 dependencies 配置中npm i <ModuleName> --save# 安装包的同时，将信息写入到package.json中的 de ...

Set、Map、WeakSet、WeakMap如果要用一句来描述，我们可以说Set是一种叫做集合的数据结构，Map是一种叫做字典的数据结构 那什么是集合？什么又是字典呢？ 集合 集合，是由一堆无序的、相关联的，且不重复的内存结构【数学中称为元素】组成的组合 字典 字典（dictionary）是一些元素的集合。每个元素有一个称作key 的域，不同元素的key 各不相同 那么集合和字典又有什么区别呢？ 共同点：集合、字典都可以存储不重复的值 不同点：集合是以[值，值]的形式存储元素，字典是以[键，值]的形式存储 背景大多数主流编程语言都有多种内置的数据集合。例如Python拥有列表（list）、元组（tuple）和字典（dictionary）,Java有列表（list）、集合（set)、队列（queue） 然而 JavaScript 直到ES6的发布之前，只拥有数组（array）和对象（object）这两个内建的数据集合 在 ES6 之前,我们通常使用内置的 Object 模拟Map 但是这样模拟出来的map会有一些缺陷，如下: Object的属性键是String或 ...

React UI 组件库 Ant Design React Bootstrap MATERIAL-UI Vue UI组件库 Element UI PC端 Vant 移动端 View UI 常用效果组件 Animate.css 动画库 Swiper 轮播组件 mescroll 下拉刷新和上拉加载框架-基于原生JS 工具类 Lodash.js Day.js 处理日期 Timeago.js 相对时间，如N小时前 Echarts 百度图表 Meditor.md 开源在线 Markdown 编辑器 validator.js 验证库 Vue工具类 vue-draggable 基于Sortable.js实现的vue拖拽插件 vue-qr 文本转二维码 vue-cropper 图片裁剪插件 vue-lazyload 懒加载 vue-simple-upload 上传组件 其他 H5带笔锋手写签名，支持PC端和移动端

使用Intersection Observer API 检测元素是否出现在可视窗口API解读：Intersection Observer API提供了一种异步检测目标元素与祖先元素或视口(可统称为根元素)相交情况变化的方法。 注意点：因为该 API 是异步的，它不会随着目标元素的滚动同步触发，而IntersectionObserver API是通过requestIdleCallback()实现，即只有浏览器空闲下来，才会执行观察器。 Intersection observer 的重要概念Intersection observer API 有以下五个重要的概念： 目标(target)元素 — 我们要监听的元素 根(root)元素 — 帮助我们判断目标元素是否符合条件的元素 以下两种情况根元素会默认为顶级文档的视口(一般为 html)。 目标元素不是可滚动元素的后代且不传值时 指定根元素为 null 交叉比(intersection ratio)—目标元素与根根的交集相对于目标元素百分比的表示(取值范围 0.0-1.0)。 阈值(threshold) — 回调函数触发的条件。 ...

正则表达式用来处理字符串特别好用，在JavaScript中能用到正则表达式的地方有很多，本文对正则表达式基础知识和Javascript中正则表达式的使用做一个总结。 第一部分简单列举了正则表达式在JavaScript中的使用场景；第二部分详细介绍正则表达式的基础知识，写出一些例子方便理解。 本文的内容是我自己看完正则表达式写法，和犀牛书中js正则表达式的章节后的总结，所以内容可能会有疏漏和不严谨的地方。若有大神路过发现文中错误的地方，欢迎斧正！ Javascript中正则表达式的使用一个正则表达式可以认为是对一种字符片段的特征描述，而它的作用就是从一堆字符串中找出满足条件的子字符串。比如我在JavaScript中定义一个正则表达式： 1var reg=/hello/ 或者 var reg=new RegExp("hello") 那么这个正则表达式可以用来从一堆字符串中找出 hello 这个单词。而“找出”这个动作，其结果可能是找出第一个hello的位置、用别的字符串替换hello、找出所有hello等等。下面就列举一下JavaScript中可以使用正则表达 ...

GitHub高级搜索技巧in:name <关键字> 仓库名称带关键字查询 in:description <关键字> 仓库描述带关键字查询 in:readme <关键字> README文件带关键字查询 stars(fork): >(=) <数字> <关键字> star或fork数大于(或等于)指定数字的带关键字查询 stars(fork): 10..20 <关键词> star或fork数在10到20之间的带关键字查询 size:>=5000 <关键词> 限定仓库大于等于5000K的带关键字查询 pushed(created):>2019-11-15 <关键字> 更新 或 创建 日期在2019年11月16日之后的带关键字查询 license:apache-2.0 <关键字> LICENSE为apache-2.0的带关键字查询 language:java <关键词> 仓库语言为Java的带关键字查询 user:<用户名> 查询某个用户的项 ...

GitHub Actions 实现自动部署静态博客在了解GitHub Actions之后，尝试使用它发现能够满足我的需求。GitHub Actions 入门教程 GitHub-Actionsactions顾名思义就是一堆动作，是一个持续集成服务，持续集成包含了拉代码、运行测试、编译代码、登录远程服务器，发布到第三方服务等等的操作，GitHub将这些操作称为actions。 概念：Workflows, Events, Jobs, Actions, Runners Workflows 工作流 一个 Workflow 由多个 Jobs 组成 Events 定义哪些事件可以触发 Workflow Jobs 一条 Job 由多个 step 组成，每个步骤可以是一条可执行的 shell 脚本或者是一个 action Actions 一个 Action 是一个复杂且重复的任务，可以看成是多个job的组合 Runners 跑工作流的 server，由 Github 提供一个工作流可以由一个或者多个 Job 组成，每个 Job 可以由一个或者多个 Step 和 Action 组成。工 ...

yaml语言教程简介YAML 是 “YAML Ain’t a Markup Language”（YAML 不是一种标记语言）的递归缩写。在开发的这种语言时，YAML 的意思其实是：”Yet Another Markup Language”（仍是一种标记语言）。 YAML 的语法和其他高级语言类似，并且可以简单表达清单、散列表，标量等数据形态。它使用空白符号缩进和大量依赖外观的特色，特别适合用来表达或编辑数据结构、各种配置文件、倾印调试内容、文件大纲（例如：许多电子邮件标题格式和YAML非常接近）。 YAML 的配置文件后缀为 .yml，如：runoob.yml 。 yaml常用来用作配置文件，和json类似 基本语法 大小写敏感 使用缩进表示层级关系 缩进不允许使用tab，只允许空格 缩进的空格数不重要，只要相同层级的元素左对齐即可 ‘#’表示注释 数据类型YAML 支持以下几种数据类型： 对象：键值对的集合，又称为映射（mapping）/ 哈希（hashes） / 字典（dictionary） 数组：一组按次序排列的值，又称为序列（sequenc ...

vue 的双向绑定、虚拟dom、diff算法等等面试常见问题你可能在几年前就学过了，其中有些人可能看过Vue的源码，了解过Vue是如何实现数据监听和数据绑定这些技术的。不过让从零开始实现一个 vue，你可以吗? 模板语法其实早就存在，在Vue发布之前就有了。Vue除了具备基本的模板编译功能外，新增了很多功能属性，比如数据集data、方法集methods、组件集components等等，当然还具备了数据的响应式功能，具备生命周期函数……我想如果能够从编译功能开始逐步增加这些功能属性，是否可以体会到尤大当初开发Vue的心路历程？或者至少能够更加清楚的理解Vue源码吧。 ==简易版Vue基本实现思路== 在这个背景下，我按照自己的理解决定从0开始，开发一个简版的Vue：Avue。 从类的创建开始创建一个类，参数为对象options，里面是Vue的各种数据集。这里采用es6语法，出于兼容性考虑的话，可以使用babel做处理。 12345class Avue { constructor(options) {
...

进程操作系统中最核心的概念就是进程，进程是对正在运行中的程序的一个抽象，是系统进行资源分配和调度的基本单位 操作系统的其他所有内容都是围绕着进程展开的，负责执行这些任务的是 CPU 进程是一种抽象的概念，从来没有统一的标准定义看，一般由程序、数据集合和进程控制块三部分组成： 程序用于描述进程要完成的功能，是控制进程执行的指令集 数据集合是程序在执行时所需要的数据和工作区 程序控制块，包含进程的描述信息和控制信息，是进程存在的唯一标志 线程线程（thread）是操作系统能够进行运算调度的最小单位，其是进程中的一个执行任务（控制单元），负责当前进程中程序的执行 一个进程至少有一个线程，一个进程可以运行多个线程，这些线程共享同一块内存，线程之间可以共享对象、资源，如果有冲突或需要协同，还可以随时沟通以解决冲突或保持同步 举个例子，假设你经营着一家物业管理公司。最初，业务量很小，事事都需要你亲力亲为。给老张家修完暖气管道，立马再去老李家换电灯泡—这叫单线程，所有的工作都得顺序执行 后来业务拓展了，你雇佣了几个工人，这样，你的物业公司就可以同时为多户人家提供服务了—这叫多线程，你是主线 ...