- 博客(49)
- 收藏
- 关注
RSS订阅原创 npm ERR! gyp ERR! find VS msvs_version was set from command line or npm config报错，解决办法！
npm ERR! gyp ERR! find VS msvs_version was set from command line or npm config报错，解决办法！
2023-03-03 10:32:16
6335
原创 创建umi-app踩坑
windows下 create-umi-app -v 文件名、目录名或卷标语法不正确。是因为create-umi-app.cmd文件中路径不对查阅此博客解决问题create-umi-app系统找不到指定的路径。是因为路径中出现了中文字符查阅此博客解决问题...
2022-04-02 22:08:30
433
原创 node中的global对象
什么是global对象？global对象，是node中的全局变量，类似浏览器中的window对象。global对象也有一个global属性引用自身。module,exports,require,__dirname,__filename虽然可以全局访问，但他们并不属于global的属性，他们是每个模块引入时，包裹的匿名函数中的参数。global对象的属性，是全局属性，在node中都可以直接访问。常见的全局属性process：当前运行地进程Buffer：二进制对象setImmediate……
2021-11-19 10:35:31
3592
原创 node中的事件循环
简介node中的js也是单线程的，所以为了实现非阻塞，它需要和浏览器同样实现一个事件循环机制。最新版本的node执行和浏览器表现行为是一致的。node中底层libuv库 实现了一套事件环机制。node中的宏任务和微任务由于node没有dom对象，所以没有MutationObserver对象，所以node中的微任务只有promise。在微任务队列之前，还有一个队列：nextTick队列。node中的宏任务分为：消息队列Timerpoll队列（I/O操作）check队列（setImmedia
2021-11-18 18:17:05
190
原创 node中的事件模块
Node.js事件模块官方文档常见用法首先引入events模块，然后创建一个类继承这个模块。这里采用了发布订阅模式通过使用on方法，来注册一个事件，可以给一个事件添加多个动作。通过使用emit方法，来触发一个事件，触发事件后，将注册事件中的所有动作依次执行。const EventEmitter = require('events');class Girl extends EventEmitter { // ...}let girl = new Girl();girl.on('我失恋了
2021-11-16 11:47:41
739
原创 实现commonjs的原理
策略模式在策略模式（Strategy Pattern）中，一个类的行为或其算法可以在运行时更改。这种类型的设计模式属于行为型模式。在策略模式中，我们创建表示各种策略的对象和一个行为随着策略对象改变而改变的 context 对象。策略对象改变 context 对象的执行算法。...
2021-11-15 17:21:17
256
原创 ejs模板引擎的编译原理
模板引擎的编译原理就是动态编译JavaScript字符串，使用with + new Function。with：扩展一个语句的作用域链。new Function：动态将一个字符串创建为一个匿名函数，字符串参数之前的参数，都是向这个匿名函数中传的值。以ejs模板为例：html代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-
2021-11-15 12:02:48
1016
原创 node学习第二天
什么是node？node就是js的一个运行时 ，可以让js运行在服务端 （js由什么组成 3部分 BOM DOM ECMASCRIPT , NODE中不能使用BOM和DOM 只有ECMASCRIPT + 内置的模块 自己写的功能 + 第三方模块）node 依旧是“主线程是”单线程的 （通常情况下 单线程 好处就是如果做的事简单 并发量高）node的优点是：异步非阻塞，处理高并发性能好node的一些基本概念node中的全局对象是global，不是windowglobal有一些自己特有的方法
2021-11-13 14:10:46
1049
原创 Node.js文件系统模块
Node.js文件系统模块（fs模块）入门教程链接fs 模块提供了许多非常实用的函数来访问文件系统并与文件系统进行交互。无需安装。 作为 Node.js 核心的组成部分，可以通过简单地引用来使用它：const fs = require('fs');关于 fs 模块的特殊之处是，所有的方法默认情况下都是异步的，但是通过在前面加上 Sync 也可以同步地工作。例如：fs.rename()fs.renameSync()fs.write()fs.writeSync()这在应用程序流程中会产
2021-11-11 17:41:21
870
原创 SEO技术总结
一、SEO是什么概念：搜索引擎优化（英语： Search Engine Optimization ，缩写为 SEO ），根据维基百科的解释是：它是一种透过了解搜索引擎的运作规则来调整网站，以及提高目的网站在有关搜索引擎内排名的方式。由于不少研究发现，搜索引擎的用户往往只会留意搜索结果最前面的几个条目，所以不少网站都希望透过各种形式来影响搜索引擎的排序，让自己的网站可以有优秀的搜索排名。当中尤以各种依靠广告维生的网站为甚。搜索引擎爬虫的工作原理：搜索引擎用一些网络爬虫，跟踪网页中的链接和内容，通过对抓
2021-11-11 09:53:56
442
原创 2021.9.19 《HTTP权威指南》第一章总结
HTTP概述一、什么是HTTP？HTTP——因特网的多媒体信使。HTTP全名叫做“超文本传输协议”（Hyper Text Tranfer Protocol），是一个简单的请求—响应协议。它经常用于在HTTP客户端和HTTP服务器中传输信息。它是一个可靠的数据传输协议，因此即使数据来自地球的另一端，它也能够确保数据在传输的过程中不会被损坏或产生混乱。什么是协议呢？我个人理解：协议就是人们商量好，一起制定的一个标准，这个标准规定了一系列规范，其中包含了数据是如何传输的，数据应该从哪传输到哪等等。当我们
2021-09-20 00:13:25
141
原创 2021-9-1 vue3中有关vuex中数据不是响应式的问题
记录一下今天踩到的坑今天写项目的时候，在一个组件的 div 中用了 v-show='show' 绑定了vuex中的一个数据，下面代码是刚开始写的从 vuex 中拿数据setup(){ let store = useStore(); let show = store.state.show;}然后发现，这个数据不是响应式的，即使数据在vuex中改变了，并且在console.log中输出也是改变过后的，但是在页面中显示还是原来的值。后来通过万能的百度发现，原来获取 vuex 中的
2021-09-01 23:45:56
3626
7
原创 2021.7.22 HTTP网络通信及优化指南
从输入URL到看到页面“CRP关键节点的性能优化【HTTP网络层面】浏览器一共进行七个步骤：URL解析缓存检查DNS解析TCP的三次握手HTTP传输TCP的四次挥手渲染页面URL解析传输协议：HTTP / HTTPS(SSL) / FTP(文件上传）…域名：顶级、一级、二级…端口号：0~65535 区分同一台服务器上的不同服务 [默认端口号：HTTP: 80 HTTPS: 443 FTP: 21] 默认端口号是浏览器处理的问号参数：可以把一些信息传递给服务器“get系列”；
2021-07-22 21:23:11
343
1
原创 2021.7.22 封装数组和对象的深浅合并
// 自定义可以用于数组和对象上门的each方法const each = function each(obj, callback) { if (obj == null || typeof obj !== "object") throw new TypeError("obj must be an array/like-array/object"); if (typeof callback !== "function") callback = function () { }; if (Arra
2021-07-22 20:29:07
89
原创 2021.7.19 浏览器渲染机制和CRP优化
CRP：关键渲染路径(critical rendering path)围绕渲染的机制和步骤，去详细的进行每一步优化，以此来提高页面的渲染速度和运行性能从服务器基于HTTP网络请求回来的数据是一串16进制的文件流浏览器把它解析为字符串（HTML字符串）按照W3C规则识别为成为一个个的HTML节点[词法解析]生成xxx树（CSS叫CSSOM树，HTML叫DOM树）在浏览器中输入一个网址：首先请求回来的是一个HTML文档，浏览器开始自上而下解析和识别代码（渲染）接下来渲染页面，此过
2021-07-19 19:47:49
182
原创 2021.7.16 GIT的基础知识和各种命令
GIT：分布式版本控制系统版本空制系统开发中我们把每一次的修改都有效的进行记录（记录成一个版本），后期如果有需要回退到原有的某个版本或者是用当前的版本和某一个版本相比较，都可以进行有效的管理。常用的版本控制系统：SVN（集中式）/GIT（分布式）GIT相较于SVN的优点：+ GIT是按照源数据（文件流）来实现文件传输的，而SVN是按照文件传输的，所以GIT比SVN更快，GIT也推荐经常进行文件传输+ GIT如果不需要上传到中央仓库，一个人在本地服务器就可以不联网拉取之前的版本，这就是分布式的好
2021-07-16 10:32:42
91
原创 2021.7.14 AJAX基础
什么是AJAX?ajax全名：async javascript and xmlajax核心作用：实现了数据请求 + 客户端渲染的局部刷新AJAX核心：基于XMLHttpRequest创建HTTP请求操作步骤：创建xhr实例：let xhr = new XMLHttpRequest;打开一个URL地址（发送请求前的一些配置信息）—— open方法和它常见的一些参数method主要两个请求方式：GET和POST(get/delete/head/options/post/put/patc
2021-07-14 09:24:47
159
原创 2021.7.12 手撕async/await源码
async和await其实是Promise和Ganerator函数的语法糖用async关键字修饰一个函数，会使这个函数内部可以使用await关键字await 操作符用于等待一个Promise 对象。它只能在异步函数 async function 中使用如果await后面跟着的不是一个Promise对象，会自动将其变为Promise对象执行遇到await关键字，会立即执行跟在await后面的代码，然后将await下方的代码变成一个微任务，加入到webAPI中进行监听，等待状态改变后加入到Event
2021-07-12 11:44:32
305
原创 2021.7.11 Iterator迭代器接口
Iterator迭代器接口迭代器（Iterator）是一种机制（接口）：为各种不同的数据结构提供统一的访问机制，任何数据结构只要部署Iterator接口，就可以完成遍历操作（for…of）循环，依次处理该数据结构的所有成员。底层机制：迭代器接口是定义在Symbol.iterator属性上的一个方法迭代器接口拥有一个next方法用于依次遍历数据结构的成员每一次便利返回的结果是一个对象{ value: xxx, done: false }done：记录是否完成遍历。未完成，值为false；完成
2021-07-11 21:17:24
169
原创 2021-07-09 JS的Promise对象
PromisePromise也叫期约，是一种设计模式：承诺模式Promise在JS中是一个对象，用于表示一个异步操作的最终完成 (或失败)及其结果值。创建一个Promise对象：let p = new Promise([executor]);executor：可执行函数new Promise时必须传入这个函数，在Promise内部会立即把 [executor] 函数执行函数中一般用来管理一个异步编程代码（不管控异步编程也是可以的）Promise本身是同步执行的，立即将 [execu
2021-07-09 15:29:57
256
原创 2021.7.8 浏览器中的进程与线程
进程： 一个程序（浏览器打开一个页面就是开辟一个进程）线程： 程序中具体做事情的一个进程中会包含一个或多个线程浏览器是多线程的包括：GUI渲染线程：用于渲染页面JS引擎线程：用于渲染和解析JS事件触发线程：监听DOM事件触发定时器触发线程：监听定时器是否到时间异步HTTP请求线程：从服务器端获取资源/数据的WebWorker……利用多线程是可以实现“异步编程”的：同时做多件事情“同步编程”：单线程，一次只能处理一件事情，这件事情完成，才能继续处理后面的事情JS是单线程的JS
2021-07-08 09:13:35
178
原创 2021-07-06 封装深拷贝以及一些实用的函数
以下函数封装参照jQuery源码首先，将一些原生函数用自己的变量定义let getProto = Object.getPrototypeOf, // 获取Object.getPrototypeOf方法 class2type = {}, //创建一个空对象 toString = class2type.toString, //获取Object.prototype.toString方法 hasOwn = class2type.hasOwnPrototype,//获取Object.hasOwnProto
2021-07-06 21:42:47
128
原创 2021-07-03 JS中数据类型检测汇总
typeof [value]：检测的结果是一个字符串，字符串中包含了对应的数据类型缺点：typeof null => “object”typeof不能细分对象（除函数）优点：typeof检测速度快，性能好底层原理：所有数据类型值，在计算机底层都是按照“64位，2进制”来存储的，所有对象数据类型值，前三位都是“0”，而存储null的二进制代码全是0typeof就是按照二进制值来进行检测的（性能好），例如：它认为前三位是0的就是对象，在这基础上再看对象是否实现了call方法，如..
2021-07-04 01:29:49
109
原创 2021-6-30 JS中this的五种情况梳理以及手撕call/bind源码
This的五种使用情况事件绑定– 给当前元素的某个事件行为绑定方法，当事件行为触发，方法执行，此时方法中的this是当前操作的元素本身普通方法执行– 方法执行前看前面是否有“点”，如果有，那么“点”前面是谁，this就指向谁，如果没有，this就指向window/undefined自执行函数中的this一般指向window/undefined回调函数：一般都是window/undefined，除非在执行回调函数（方法内部）做了特殊处理括号表达式中：取出来括号表达式中最后一项执行，this指
2021-06-30 11:15:47
124
原创 2021/6/28 JS中的函数借用
鸭式辩型长得像鸭子，并且能够呱呱叫的就是鸭子类数组「还有类Promise…」结构很像数组，但是不是Array的实例，所以无法直接调用Array.prototype上的方法，而我们期望他可以使用这些方法的，这样就需要函数借用函数借用//这是一个类数组对象let obj = { 2: 3, //1 3: 4, //2 length: 2, //4 push: Array.prototype.push //将数组的方法借用给对象};obj.push(1);//
2021-06-28 09:36:53
116
原创 2021-06-28 JS重写内置方法NEW
new操作符的作用创建一个构造函数的实例对象把构造函数当作普通函数执行，让方法中的this指向创造实例对象观察方法执行的返回结果：如果没有写返回值，或者返回的是原始类型的值，都以返回的实例对象为主；如果返回的是一个对象/函数，则以自己的返回为主自己实现new操作符function _new(Ctor, ...params) { //格式校验：能被NEW的，首先是个函数，其次需要有prototype属性，而且还不能是Symbol/BigInt构造函数... let obj, result
2021-06-28 09:23:47
342
原创 2021.6.28 JS私有和公有属性的检测
检测对象的私有属性Object.prototype对象中实现的hasOwnPrototype方法用法：f.hasOwnPrototype(‘x’)检测x是否为f的私有属性检测对象的属性in操作符用法：‘x’ in f检测x是否为f的属性检测对象的共有属性（自己实现）思路：检测当前属性是否出现在当前对象的原型链上对象属性的私有和公有是相对而言的，对子类是公有的属性可能对父类是私有属性Object.prototype.hasPubPrototype = function has
2021-06-28 09:05:46
225
原创 2021.6.27 ES5和ES6创建构造函数的区别
ES5创建构造函数function Model(x, y) { //构造函数体，给Model的实例添加私有属性方法 this.x = x; this.y = y;}//在构造函数的原型链上给实例添加公有方法Model.prototype.z = 10;Model.prototype.getX = function() { console.log(this.x);}//给Model类添加私有属性Model.n = 200;Model.setNumber = function(
2021-06-27 17:45:31
114
原创 2021.6.27 JS中的原型链
Prototype属性大部分“函数数据类型”的值都具备“prototype（原型/显式原型）”属性，属性值本身是一个对象「浏览器会默认为其开辟一个堆内存，用来存储实例可调用的公共的属性和方法」函数数据类型普通函数（实名或者匿名函数）箭头函数构造函数/类「内置类/自定义类」生成器函数 Generator…不具备prototype属性的函数箭头函数基于ES6给对象某个成员赋值函数值的快捷操作（函数的增强写法）在浏览器默认开辟的这个堆内存中「原型对象」有一个默认的属性“c
2021-06-27 15:26:45
64
原创 2021-06-19 JS中的普通函数和构造函数的区别
一、JS中的内置类JS中常见的内置类每一种数据类型都有自己所属的内置类Number、String、Boolean、Symbol、BigIntObject、Function、Array、Date、RegExp、Error(ReferenceError/TypeError/RangeError/SyntaxError)…每一个元素对象也有自己所属的内置类其余的内置类XMLHttpRequest、Promsie、Proxy…自定义类「类->构造函数」ES5中：创建一个函数，执行函数的时
2021-06-19 13:40:37
88
原创 2021-06-17 JS函数的防抖和节流
防抖函数函数防抖{debounce}:在用户频繁触发某个行为的时候，我们只识别一次触发频繁触发条件是我们自己可以设定的，例如：我们设置的是500MS，这样只要用户在这段时间内操作两次及以上，就属于频发触发；但是如果是500MS之前触发一次，之后触发一次，这不算频繁触发…我们可以控制是在开始触发还是结束触发//公共类const clearTimer = function clearTimer(timer) { if (timer) { clearTimeout(timer
2021-06-17 14:30:24
121
原创 2021-06-16 JS惰性载入函数
惰性载入函数因为浏览之间行为的差异，多数JavaScript代码包含了大量的if语句，将执行引导到正确的代码中。如果if语句不必每次执行，那么代码可以运行地更快一些。解决方案就称之为惰性载入函数。以在不同的浏览器中获取元素的样式为例：// 每一次执行getCss方法，都需要验证当前浏览器是否兼容getComputedStylefunction getCss(element, attr) { if (typeof getComputedStyle !== 'undefined') {
2021-06-17 10:56:12
101
原创 2021-06-14 JS函数柯里化
函数柯里化思想预先存储(预处理)，利用闭包的“保存机制”，我们把一些值事先存储起来，供其下级上下文中后期使用例：（百度的一道面试题）实现函数，让其具有如下功能let res = fn(1,2)(3);console.log(res); //=>6 1+2+3答：const fn = (...params) => { return (...args) => { params = params.concat(args); return
2021-06-15 00:18:20
153
原创 2021-6-13 JS中的单例设计模式
单例设计模式：这种类型的设计模式属于创建型模式，它提供了一种创建对象的最佳方式。这种模式涉及到一个单一的类，该类负责创建自己的对象，同时确保只有单个对象被创建。这个类提供了一种访问其唯一的对象的方式，可以直接访问，不需要实例化该类的对象。其实就是创建一个对象。每一个对象都是Object的单独实例，基于每一个实例对象来管理自己的属性和方法，实现分组的效果作用：利用对象「单独堆内存」来进行分组管理，避免全局变量污染let AModule = (function () { let n = 10
2021-06-14 00:17:01
84
原创 2021-06-13 JS中的匿名函数
匿名函数的应用场景箭头函数（无法设置名字）const fn = () => {};函数表达式const fn = function () {};document.onclick = function () {};function fn() { return function () {};}回调函数setTimeout(function () {}, 1000);fn(function () {});自执行函数(function(){})();
2021-06-13 22:44:59
182
原创 2021.6.12 关于ES6函数形参默认值产生两个私有上下文的问题
ES6函数默认值产生两个私有上下文（阿里面试题）只要函数中有ES6形参赋值默认值（无论是否生效）函数体中出现基于let/const/var声明变量的操作（没有function），无论声明的是啥变量只要这两个条件同时成立，则函数执行会产生两个上下文函数私有上下文——形参赋值完即结束会把函数体当作一个块级上下文，并且上级上下文就是函数私有上下文（上面那个形参赋值）并且如果块级中的某个变量和函数私有上下文中的形参是一个名字，则默认会把函数私有上下文中形参的值，同步给块中这个上下文一份var
2021-06-12 00:30:55
156
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人