- 博客(153)
- 资源 (11)
- 收藏
- 关注
RSS订阅原创 git commit 设置 eslint + pretter 格式化校验，导出报告
3.1 在.eslintrc 的 rules 中加入"quotes": ["error", "single"]， 不允许使用双引号。4.1 在package.json scripts 新增脚本 "prepare": "husky install"3.3 在main.js 中加入 console.log("hello world")，触发eslint。3.2 在 package.json scrtipt 中加入 "lint": "eslint src"4.2 生成 .husky 文件夹(当前文件夹)
2023-05-11 18:55:53
792
2
原创 vue2-ace-editor 代码编辑器、格式化代码
ace-editor 代码编辑器格式化使用插件使用 beautify 格式化代码 （github）使用 beautify
2022-06-22 09:31:41
2005
原创 VScode 插件路径修改（自用）
Plan A: 使用 mklink （是 NTFS 文件系统中指向文件系统中的另一个对象的一类对象），先找到 C盘的 vscode 插件目录，先备份然后再删除，然后用管理员打开 CMD ，输入mklink /D "C:\Users\{username}\.vscode\extensions" "D:\vscode\extensions"Plan B: 先找到 vscode的快捷方式的图标，将 目标 加入 --extensions-dir "D:\vscode\extensions"
2022-05-18 09:02:16
1095
原创 算法问题集合
说说你对树的理解？二叉树：本身是有序树 树中包含的各个结点不能超过 2，即只能是 0、1 或者 2满二叉树、完成二叉树前序：根左右中序：左根右后序：左右根
2022-04-24 10:36:13
92
原创 node 问题集合
Node.js 的理解？优缺点？应用场景？Node.js 是一个开源与跨平台的 Javascript 运行时环境。在浏览器外运行 V8 Javascript，利用事件驱动、非阻塞和异步输入输出模型等基础提高性能可以理解为 Node.js 就是一个服务端的、非阻塞式I/O（输入/输出）、事件驱动的 Javascript 运行环境优点：处理高并发场景性能更佳 适用 I/O 密集型应用，指的是应用在运行极限时，CPU 占用率仍然比较低，大部分时间再做 I/O 硬盘内存读写操作缺点：不适用.
2022-04-18 15:18:12
697
原创 Typescript
Typescript 的理解，与 JavaScript 的区别理解： Typescript 是 JavaScript 的超集，支持 ES6 语法，支持面向对象编程的概念，比如类、接口、继承、泛型等特性：类型批注和编译时的类型检查：在编译时批注变量类型 类型推断：ts 中没有批注变量类型会自动推断变量的类型 类型擦除： 接口：ts 中用接口来定义对象的类型 枚举 Mixin 泛型编程 名字空间 元祖Typescipt 数据类型新增有哪些？tuple （元祖类型
2022-04-18 10:00:01
462
原创 前端笔试整理
// 第一题window.name = 'NB'function A() { this.name = 123}A.prototype.getA = function () { console.log(this) return this.name + 1}let a = new A()let funA = a.getAfunA()// Window// NB1// 第二题var length = 10function fn(){ return this.le.
2022-04-14 15:35:45
107
原创 函数式编程
什么是函数式编程？主要的编程范式有三种：命令式编程、声明式编程和函数式编程函数式编程更加抢到程序执行的结果而非执行的过程，倡导利用若干简单的执行单元让计算结果不断渐进，逐层推导的运算，而非设计一个复杂的执行过程。简单的来说，就是吧过程逻辑编程函数，定义好输入参数，只关心它的输出结果。优点：更好的状态管理：因为它的宗旨是无状态，或者更少的状态，能最大化的减少这些未知、优化代码、减少出错情况 更简单的复用：固定输入 -> 固定输出，没有其他外部变量影响，并且无副作用。这样代码复用时，完全
2022-04-11 14:14:54
298
原创 ES6 问题集合
1. ES6 中数组新增了哪些扩展？扩展运算符 Array.from() [ 类似数组的对象和可遍历(iterable)的对象（ 包括 Set 和 Map ）转换为真正的数组] 和 Array.of() 将一组值转换为数组 数组实例对象新增的方法 （copyWithin()、find()、findIndex()、fill()、entries()、keys、values()、includes()、flat()、flatMap()）2. ES6 对象新增了哪些扩展？属性的简写（在 ES6 中，当.
2022-04-06 13:20:16
1142
原创 Vue 3.0 问题集合
1. Vue 3.0 与 Vue 2.0 的区别利用新的语言特性（ES6),解决架构问题速度更快 ( 重写了虚拟 Dom 实现，编译模块的优化，更高效的组件初始化，update 性能提高 1.3 ~ 2 倍，SSR 速度提高了 2 ~ 3 倍) 体积减少 （tree-shaking 功能） 更易维护 （更好的 Typescript 支持） 更接近原生 更易使用...
2022-04-06 10:38:26
734
原创 渲染 10W 条数据
主要思路是：使用文档碎片 ( createDocumentFragment) + 逐帧加载（requestAnimationFrame）// 10W 数据源const total = 100000// 每次插入的条数const once = 30// 插入需要的次数,可能除不尽，向上取整const loopCount = Math.ceil(total/once)// 渲染的次数let countRender = 0// 获取插入的父节点const ul = document.q
2022-04-02 11:16:14
168
原创 Webpack
1. 对 webpack 的理解？解决了什么问题？Webpack 是一个用于现代 Javascript 应用程序的静态模块打包工具静态模块：在开发阶段，可以被 webpack 直接引用的资源。webpack 能力：1. 【 编译代码能力 】 ，提高效率，解决浏览器兼容问题；2. 【 模块整合能力】，提高性能，可维护性，解决浏览器频繁请求文件的问题；3. 【 万物皆可模块能力 】，项目维护性增强，支持不同种类的前端模块类型，统一的模块化方案，所有资源文件的加载都可以通过代码控制。.
2022-03-30 10:28:21
1620
原创 JavaScript 判断对象是否为数组中的七种方法
let obj1 = {}let obj2 = [1,2,3]let obj3 = new Date()console.log( obj1, obj2, obj3)// 第一种console.log( Array.isArray(obj1), Array.isArray(obj2), Array.isArray(obj3),)// 第二种console.log( obj1 instanceof Array, obj2 .
2022-03-25 09:21:16
782
原创 http 问题
http 和 httpshttp:超文本传输协议，未加密，端口是80，https: 是基于 http + ssl 构建的，可进行加密身份认证的网络协议，端口是443https 作用：1. 建立安全的信息安全通道，来保证数据传输的安全2. 确认网站的安全性TCP 和 UDPTCP面向连接 （如打电话要先拨号建立连接）;UDP是无连接 的，即发送数据之前不需要建立连接三次握手1. 客户端先发一个请求（ SYN ）询问服务器能否连接；2. 服务器同意客户端连接（ SYN.
2022-03-21 08:56:26
2863
原创 虚拟 DOM 和 DIFF 算法
虚拟 DOM 就是 js 对真实 DOM 的模拟，是一个对象Vue 基于 Snabbdom 库 实现虚拟 DOM虚拟 DOM 的好处比较变化，计算最小需要更新的视图，然后在操作 DOMdiff 算法1. 遍历老的虚拟 DOM2. 遍历新的虚拟 DOM3. 重新排序只比较同一层级，不跨级比较只比较标签名，1. 标签名不同，直接删除，不继续深度比较； 2. 标签名相同，key 相同，就认为是相同节点，不继续深度比较；...
2022-03-19 12:53:07
805
原创 Vuex 状态管理
1. 什么是 VuexVuex 是实现组件全局状态( 数据 )管理的一种机制，可以方便的实现组件之间数据的共享。2. 使用 Vuex 统一管理状态的好处能够在 Vuex 中集中管理共享的数据，易于开发和后期维护 能够高效地实现组件之间的数据共享，提高开发效率 存储在 vuex 中的数据都是响应式的，能够实时保持数据与页面的同步3.用法1. stroe 文件 : index.jsimport Vue from 'vue'import Vuex from 'vu...
2022-03-18 15:05:48
961
原创 npm 整理
1.NPM 包的语义化版本规范包的版本号是以 “点分十进制” 形式进行定义的，共有三位数字，例如 2.24.0其中每一位数字代表含义如下：第 1 位数字 ： 大版本第 2 位数字 ：功能版本第 3 位数字 ：Bug修复版本版本号提升规则： 只要前面的版本号增长了，则后面的版本号就要归零2.快速创建 package.jsonnpm init -y3. devDependencies( 开发依赖包 ) 和 dependencies( 核心依赖包 )如果某些包只在项目
2022-03-16 10:33:09
1191
原创 css 问题积累
css1.盒子模型标准盒子模型： 宽度 = 内容的宽度(content) + padding + border + padding + margin传统盒子模型： 宽度 = (content + padding + border) + marginflex 弹性盒子BFC 块格式化上下文1.解决高度塌陷问题浮动元素会脱离文档流（绝对定位元素也会脱离文档流），导致无法计算准确的高度清除浮动：解决高度塌陷的问题是前提能够识别并且包含浮动元素 .container:after {
2022-03-14 11:00:53
487
原创 var 、let 和 const 区别
1. var var 定义的变量可以修改，如果不初始化会输出undefined，不会报错； 在相同作用域里，可以重复声明同一个变量; 会声明提升；（ if 内的 {} 不是作用域） 2. let let是块级作用域，函数内部使用let 定义后，对函数外部无影响； 在相同作用域里，不可以重复声明同一个变量； 声明的变量不会存在变量提升；（ if 内的 {} 是作用域 ） “暂时性死区”，在代码块内，使用let命令声明变量（或者con
2022-03-11 16:07:56
839
原创 px、em、 rem、vh、vw 的区别
1、px：相对长度单位。像素px是相对于显示器屏幕分辨率而言的。2、em：相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。3、rem：相对长度单位。r’是“root”的缩写，相对于根元素<html>的字体大小。4、vh and vw：相对于视口的高度和宽度，而不是父元素的（CSS百分比是相对于包含它的最近的父元素的高度和宽度）。5、vmin and vmax：关于视口高度和宽度两者的最小值或者最大值。...
2022-03-11 14:49:26
6333
2
原创 VUE 项目中遇到的问题归总
正常项目平时运行的好好，突然有一天项目启动报错了，多由于项目中的某些包的版本出现问题1.nodo 版本号和 npm版本号不匹配有时候手贱升级了node 版本，导致了 npm run serve 项目跑不起来 。解决方案：方案一：node 版本回退方案二： 如要一定要升级高版本的话，先回退node版本，再升级npm到指定版本，然后最后升级node 版本npm install -g [email protected] 版本号V16.12.0 对应的node-sass 和
2022-03-09 16:00:11
1613
原创 ES6 Class
// console.log('hello')// function Father () {// this.name = '父亲'// this.age = '66'// this.say = function () {// console.log(" I'm father")// }// }// const abb = new Father()// console.log(abb.name) // 父亲// ES6 新写法class Father {.
2022-03-08 11:09:58
103
原创 ES6 模块化 和 COMMON模块化
ES6 模块化// util.js// 模块私有成员const a1 = 1const a2 = 2// 默认导出export default { a1, a2 }// 按需导出export function show () { console.log('world')}export function say () { console.log('say')}/** 默认导出和按需导出*** 1. 有{}花括号的为按需导入，没有花括号的为默认导入*** 2
2022-03-08 09:51:28
108
原创 vue-router 路由整理
什么是路由？Hash 地址与组件之间的对应关系前端路由的工作原理？1.用户点击了页面上的路由链接；2.导致URL地址栏中的Hash值发生了变化；3.前端路由监听到了Hash地址变化；4.前端路由把当前Hash对应的组件渲染到浏览器中；vue-router 安装和配置的步骤1.安装vue-router 包npm i [email protected] -S2.创建路由模块,并声明路由的匹配规则在src 源代码目录下，新建router/index.js，并初始
2022-03-01 11:26:40
487
原创 async 函数
什么是async？async 函数是什么？一句话，它就是 Generator 函数的语法糖。// 前文有一个 Generator 函数，依次读取两个文件。const fs = require('fs');const readFile = function (fileName) { return new Promise(function (resolve, reject) { fs.readFile(fileName, function(error, data) {
2022-02-28 14:17:00
75
原创 使用 Ant Design Vue 的 RangePicker 组件
<template> <div> <a-form :form="searchform" layout="inline"> <a-form-item label="日期"> <a-range-picker :show-time="{ format: 'HH:mm:ss', defaultValue: defaultDate }" format="YYYY-MM-DD HH:m.
2022-02-24 16:23:58
1797
转载 使用MultiTab过程中，解决NavigationDuplicated: Avoided redundant navigation to current location: 问题
import VueRouter from 'vue-router'Vue.use(VueRouter)// 缓存原型上的push函数const originPush = VueRouter.prototype.pushconst originReplace = VueRouter.prototype.replace// 给原型对象上的push指定新函数函数VueRouter.prototype.push = function (location, onComplete, onA...
2022-02-21 14:47:28
394
原创 JavaScript 数据类型 ( 深拷贝和浅拷贝 )
简单类型 ( 值类型 ) 和复杂类型（ 引用类型 ）简单类型又叫做基本数据类型或者值类型，名值存储于栈内存中，String、Number、Boolean、null、undefined、Symbol、BigInt(ES10)复杂类型又叫做引用类型，（名在栈内存中，值存在于堆内存中 ），在存储时变量中的存储仅仅是地址（ 引用），通过 new 关键字创建的对象 （ 系统对象、 自定义对象），如Object、Function、 Array 、Date 等堆和栈（ JS 中没...
2022-02-14 16:07:20
526
原创 JavaScript 预解析----遍历提升和函数提升
浏览器分成两部分： 渲染引擎和JS引擎渲染引擎： 用来解析HTML与CSS,俗称内核，比如chrome浏览器的blink，老版本的webkitJS引擎：JS解析器。用来读取网页中的JavaScript代码，对其处理后运行，比如chrome浏览器的V8浏览器本身并不会执行JS代码，而是通过内置的JavaScript引擎（解释器）来执行JS代码。JS引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所有JavaScript语言归为脚本语言，会逐行解释执行。作用域（如果在
2022-01-28 10:10:07
902
原创 VUE 基础
VUE事件修饰符.prevent 阻止默认行为（例如：阻止a链接的挑战）.stop 阻止事件冒泡v-model 指令修饰符.number 自动将用户输入值转为数值类型.trim 自动过滤用户输入的收尾空白字符.lazy 在“change”时而非“input”更新v-if 和 v-showv-if 有更高的切换开销，v-show有更高的初始渲染开销如果有频繁的切换，用v-show如果在运行条件很少时，用v-if过滤器过滤器的注意点要定义到 filters 节点下，
2022-01-28 09:08:37
524
原创 javascript 基础汇总
文章目录javascript 汇总Javascript 由三部分组成继承， 继承可以使得子类别具有父类的的各种方法和属性（六种）闭包在浏览器中从输入Url并回车发生了什么？CSRF(跨站请求伪造)Referer原生javaScript节点BOM 浏览器对象模型遍历对象作用域函数表达式（匿名函数）深拷贝、浅拷贝预解析字符串浏览器的同源策略( 跨域 )javascript 汇总Javascript 由三部分组成ECMAScript 语法DOM 页面文档对象模型BOM 浏览器对象模型继承， 继承
2022-01-28 09:05:27
266
原创 Generator 函数的语法
执行 Generator 函数会返回一个遍历器对象，也就是说，Generator 函数除了状态机，还是一个遍历器对象生成函数。返回的遍历器对象，可以依次遍历 Generator 函数内部的每一个状态。形式上，Generator 函数是一个普通函数，但是有两个特征。一是，function关键字与函数名之间有一个星号；二是，函数体内部使用yield表达式，定义不同的内部状态（yield在英语里的意思就是“产出”）。Yield 表达式由于 Generator 函数返回的遍历器对象，只有调用ne
2022-01-27 17:28:26
327
原创 window.open() 被浏览器拒绝
现象：window.open()打开新页面时，闪了一下，窗口页面就被浏览器关闭。原因：大概率是跨域问题导致了浏览器的同源策略限制。什么是跨域？
2022-01-14 09:15:59
661
转载 【转载】JS数组遍历的几种方式
JS数组遍历，基本就是for,forin,foreach,forof,map等等一些方法，以下介绍几种本文分析用到的数组遍历方式以及进行性能分析对比第一种:普通for循环代码如下:for(j = 0; j < arr.length; j++) {}简要说明: 最简单的一种，也是使用频率最高的一种，虽然性能不弱，但仍有优化空间第二种:优化版for循环代码如下:for(j = 0,len=arr.length; j < len; j++) {}简要
2021-12-06 14:16:57
199
原创 防抖和节流
防抖：就是一定时间内，只会执行最后一次任务 //防抖debounce代码：function debounce(fn, delay) { var timeout = null; // 创建一个标记用来存放定时器的返回值 return function(e) { // 每当用户输入的时候把前一个 setTimeout clear 掉 clearTimeout(timeout); // 然后又创建
2021-10-27 09:52:56
57
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人