飞鱼Code-CSDN博客

原创 brew小技巧—卸载

处理brew下载包以及下载相关依赖包的卸载方法$ brew tap beeftornado/rmtree$ brew rmtree <package>

2021-09-21 18:15:39 1478

原创 Thanks for inventing JavaScript!!!

2021-08-31 10:50:06 201

自定义loaderLoader是用于对模块的源码进行转换处理的loader本质上是一个导出为函数的JavaScript模块loader runner库调用这个函数，然后将上一个laoder产生的结果或者资源文件传入进去；所有的内容在经历过loader之后都必须转化为javascript字符串content ：读取到的相关模块文件Mate: 即一些元素参数需要传入的/* selfloader.js >> */// 这个了loader被称之为normalloa

2021-08-26 18:46:01 978

原创 webpack自定义plugin

自定义pluginTable与webpackwebpack中有Compile和Compilation，他们通过插件注入的方式监听webpack的生命周期Table这个库存在着各种个样的Hook实例，这个hook就可以帮助我们监听webpack生命周期同步const {SyncHook, SyncBailHook, SyncLoopHook, SyncWaterfallHook} = require("tapable");class test { constructor(){

2021-08-26 18:41:50 862

原创常用的 meta 标签

常用的 meta 标签<meta>元素可提供有关页面的元信息(meta-information)，比如针对搜索引擎和更新频度的描述和关键词。<meta> 标签位于文档的头部，不包含任何内容。标签的属性定义了与文档相关联的名称/值对。<!DOCTYPE html> H5 标准声明，使用 HTML5 doctype，不区分大小写<head lang=”en”> 标准的 lang 属性写法<meta charset=’utf-8′>

2021-08-22 22:14:04 1259

原创 js乱序之洗牌

// 从数组的最后位置开始，从前面随机一个位置，对两个数进行交换，直到循环完毕 function shuffleSort(arr) { let i = arr.length - 1 while(i>0) { let rIndex = Math.floor(Math.random()*i) let temp = arr[rIndex] arr[rIndex] = arr[i] arr[i] = temp

2021-03-15 16:59:13 811

转载从输入URL到页面加载完成期间经历了什么？

1、DNS域名解析回车敲响的那一刻，浏览器检查了输入框，www.sunjiaoshou.com是什么鬼东西？？我需要的可是IP地址呀！万般无奈之下找向了浏览器缓存，让其查找是否有这家伙的记录，结果并没有发现，此时找向系统缓存，主要去查找了系统中的hosts文件，同样没有，此时找向路由器缓存，查看路由器映射表，然而，并没有！于是，计算机将域名发给了本地DNS服务器（提供本地连接的服务商），本地DNS服务器找不到会将域名发送给其他服务器，进行递归过程，首先会发送到根域名服务器去找，返回顶级域名服务器的IP地址

2021-03-14 15:04:56 938

原创 ES5/ES6 的继承除了写法以外还有什么区别?

ES5 的继承实质上是先创建子类的实例对象，然后再将父类的方法添加到 this 上(Parent.apply(this)).ES6 的继承机制完全不同，实质上是先创建父类的实例对象 this(所以必须先调用父类的super()方法)，然后再用子类的构造函数修改 this。ES5 的继承时通过原型或构造函数机制来实现。ES6 通过 class 关键字定义类，里面有构造方法，类之间通过 extends 关键字实现继承。子类必须在 constructor 方法中调用 super 方法，否则新建实.

2021-03-11 17:17:40 1175

原创深度优先遍历和广度优先遍历

两者的区别对于算法来说无非就是时间换空间空间换时间深度优先不需要记住所有的节点, 所以占用空间小, 而广度优先需要先记录所有的节点占用空间大深度优先有回溯的操作(没有路走了需要回头)所以相对而言时间会长一点深度优先采用的是堆栈的形式, 即先进后出广度优先则采用的是队列的形式, 即先进先出const data = [ { name: 'a', children: [ { name: 'b', children: [{ name:

2021-03-11 16:59:50 887

原创介绍下 Set、Map、WeakSet 和 WeakMap 的区别?

Set——对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用 WeakSet——成员都是对象;成员都是弱引用，可以被垃圾回收机制回收，可以用来保存 DOM 节点，不容易造成内存泄漏; Map——本质上是键值对的集合，类似集合;可以遍历，方法很多，可以跟各种数据格式转换。WeakMap——只接受对象最为键名(null 除外)，不接受其他类型的值作为键名;键名是弱引用，键值可以是任意的，键名所指向的对象可以被垃圾回收，此时键名是无效的;不能遍历，方法有 get、set、has、delete。

2021-03-11 15:26:15 1189

原创 js面试题之一分享

第一眼看到这个题目的时候，脑海跳出的答案是 [1, 2, 3]，但是真正的答案是[1, NaN, NaN]。首先让我们回顾一下，map 函数的第一个参数 callback。这个 callback 一共可以接收三个参数，其中第一个参数代表当前被处理的元素，而第二个参数代表该元素的索引。arr.map(callback: (value: T, index: number, array: T[]) => U, thisArg?: any);而 parseInt则是用来解析字符串的，使字符串.

2021-03-11 14:42:55 889

转载 Event、默认事件、事件冒泡

这里打印出来的Event对象是 React 封装过的SyntheticEvent，可以看__proto__.constructor。React 标准化了事件对象，因此在不同的浏览器中都会有相同的属性。React 中事件绑定跟 Vue 中完全不同，Vue中事件绑定和触发的对象为同一元素，React中事件触发的对象为document，绑定元素为当前元素。React的所有事件都会被挂载到document上和DOM事件不同。Vue 的Event是原生，事件被挂载到当前元素和DOM事件一样Get Eventg

2021-03-01 17:40:33 940

原创组件的生命周期

组件的生命周期每个组件都包含“生命周期方法”，你可以重写这些方法，以便于在运行过程中特定的阶段执行这些方法。你可以使用此生命周期图谱作为速查表。在下述列表中，常用的生命周期方法会被加粗。其余生命周期函数的使用则相对罕见。挂载当组件实例被创建并插入 DOM 中时，其生命周期调用顺序如下：constructor()static getDerivedStateFromProps()render()componentDidMount()注意:下述生命周期方法即将过时，在新代码中应该避免使用它们：

2021-02-26 11:53:08 894

转载 js创建对象的几种方式

js常用的几种创建对象的方式有：{}new Ｏbject()使用字面量工厂模式构造函数模式（constructor）原型模式（prototype）构造函数+原型模式还有一些不常用的方式，如动态原型，寄生构造函数，稳妥构造函数。一、通过{}创建对象demo1： 01.newObj-1.html <script> 'use strict'; //使用strict模式 /** 使用{}创建对象，等同于 new Object();

2021-02-25 13:06:43 5955

原创 bfc

BFC（Block Formatting Context）格式化上下文，是Web页面中盒模型布局的CSS渲染模式，指一个独立的渲染区域或者说是一个隔离的独立容器。（自己理解就是触发bfc的元素会脱离文档流，也就是说别的元素看不到它了））脱离文档流：元素脱离文档流之后，将不再在文档流中占据空间，而是处于浮动状态（可以理解为漂浮在文档流的上方）。脱离文档流的元素的定位基于正常的文档流，当一个元素脱离文档流后，依然在文档流中的其他元素将忽略该元素并填补其原先的空间。触发bfc的条件1、浮动元素，float

2021-02-24 23:14:45 861

原创 px与rem

px 实际上就是像素，用PX设置字体大小时，比较稳定和精确。px是固定长度单位，不随其它元素的变化而变化em 就是根据基准来缩放字体的大小。em 是相对长度单位。em是相对于父级元素的单位，会随父级元素的属性（font-size或其它属性）变化而变化rem是CSS3新增的一个相对单位,rem是相对于根目录（HTML元素）的，所有它会随HTML元素的属性（font-size）变化而变化例如： ==屏幕宽度/设计宽度 = 1rem的值/预设定rem的值。1920/1920=100/100 ;所以 1r

2021-02-24 22:06:55 1079

原创 css之，怪异盒模型和标准盒模型

标准模型与IE模型CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：内边距（padding），边框（border），margin（外边距），和内容（content）。标准盒模型：一个块的总宽度=width+margin(左右)+padding(左右)+border(左右)怪异(IE)盒模型：一个块的总宽度=width+margin（左右）（既width已经包含了padding和border值）设置盒模型：box-sizing:border-box...

2021-02-24 21:58:12 903

原创非阻塞IO与阻塞IO

非阻塞IO与阻塞IOIO就是输入—输出操作系统通常提供了两种调用方式，阻塞调用和非阻塞调用阻塞式调用：调用结果返回之前，当前线程处于阻塞态(阻塞态CPU不会分配时间片)，调用线程只有在得到调用结果之后才会继续执行非阻塞式调用：调用执行之后，当线程不会停止执行，只需要过一段时间来检查一下有没有结果返回即可。非阻塞式调用的问题我们没有获取到结果，因为是异步的我们为了得到完整的数据，需要频繁的去确定度渠道的数据是否完整这歌过程角轮训操作kibuv提供了一个线程池线程

2021-02-24 10:20:50 896

原创 events基础

events基础const EventEmitter = require('events')const emitter = new EventEmitter();// 只需一次emitter.once("click", (arg1) => { // ..})// 监听emitter.onemitter.prependListener("click2", (arg) => { ..})// 发出一个事件emitter.emmit("click","cli

2021-02-24 10:20:17 981

原创文件描述符

文件描述符什么是文件描述符在POSIX系统上。对每个进程，内核都维护着一张当前打开着的文件和资源的表哥每个代开的文件都被分配了一个称之为文件描述符的简单的数字标识符在系统层，所有的文件系统擦欧总都使用这些文件描述符来标识和跟踪每个特定的文件Windows系统上使用一个类似的的机制来跟踪资源const fs = require('fs');fs.open( filepath, (err,fd) => { // ..doing // 通过文件描述符来操作文件 /

2021-02-24 09:55:48 1076

原创 linux安装node

linux安装nodewget https://nodejs.org/dist/v12.9.1/node-v12.9.1-linux-x64.tar.xztar xvf node-v12.9.1-linux-x64.tar.xzln -sf /root/node-v12.9.1-linux-x64/bin/node /usr/local/bin/nodeln -sf /root/node-v12.9.1-linux-x64/bin/npm /usr/local/bin/npmnpm config

2021-02-24 09:49:36 798

原创 Web服务器访问流程

Web服务器访问流程Web的内容都是存储在Web服务器上面的。而Web服务器通常所使用的是HTTP协议，因此Web服务器有时也被称为“HTTP服务器”。客户端和Web服务器之间进行通信需要经历请求和响应两个过程。简单说,就是客户端向服务器发送一一个请求索要数据,而服务器端需要对该请求作出响应,即把客户端索要的资源(数据)返回。按下回车时浏览器根据输入的URL地址发送请求报文给服务器。服务器接收到请求报文，会对请求报文进行处理。服务器将处理完的结果通过响应报文返回给浏览器。浏览器解析服务器返回的结

2021-02-24 09:46:07 2796

原创 CS架构与BS架构

CS架构与BS架构CS即Client/Server (客户机/服务器)结构，C/S结构在技术上很成熟，它的主要特点是交互性强、具有安全的存取模式、网络通信量低、响应速度快、利于处理大量数据。但是该结构的程序是针对性开发，变更不够灵活,维护和管理的难度较大。通常只局限于小型局域网,不利于扩展。并且，由于该结构的每台客户机都需要安装相应的客户端程序，分布功能弱且兼容性差,不能实现快速部署安装和配置，因此缺少通用性，具有较大的局限性。要求具有一定专业水准的技术人员去完成。比如QQ，微信，绝地逃生

2021-02-24 09:36:01 4325

转载 Webpack热更原理介绍

第一步，在 webpack 的 watch 模式下，文件系统中某一个文件发生修改，webpack 监听到文件变化，根据配置文件对模块重新编译打包，并将打包后的代码通过简单的 JavaScript 对象保存在内存中。第二步是 webpack-dev-server 和 webpack 之间的接口交互，而在这一步，主要是 dev-server 的中间件 webpack-dev-middleware 和 webpack 之间的交互，webpack-dev-middleware 调用 webpack 暴露的 A..

2021-02-23 11:02:18 1005

转载 node处理excel

origin：https://www.cnblogs.com/xiashan17/p/6214817.html引言：日常工作中已经有许多应用功能块使用了nodejs作为web服务器，而生成报表下载也是我们在传统应用。java中提供了2套类库实现(jxl 和POI),.NET 作为微软的亲儿子更加不用说，各种com组件贴心使用。nodejs作为一门新的语言，报表功能也不是十分完善。(1).js-xlsx : 目前 Github 上 star 数量最多的处理 Excel 的库，支持解析多种格式表格XLS

2021-01-11 16:36:45 3497

qq_41648408的博客