- 博客(29)
- 收藏
- 关注
RSS订阅
原创 269个JavaScript工具函数，助你提升工作效率（下）
130.blob转file/***@param{blob}blob*@param{string}fileName*/exportconstblobToFile=(blob,fileName)=>{blob.lastModifiedDate=newDate();blob.name=fileName;returnblob;};131.file转...
2021-05-12 17:54:58
581
原创 269个JavaScript工具函数，助你提升工作效率（上）
1.匹配正整数//匹配正整数letisPositiveNum=val=>{return/^[1-9]d*$/.test(val);};console.log(isPositiveNum(9))//trueconsole.log(isPositiveNum(2.2))//false2.匹配负整数//匹配负整数letisNegativeNum=val=>{return/^-[1-9]d*$/.test(val);...
2021-05-12 17:53:33
7073
原创 es6深入了解模块化
export 命令导出的只是引用的指针，并不是值；当模块内部更改此变量时候，外部的引用也会发生改变； export 必须定义在模块顶层的作用域内，函数的作用域内是不行的；导入的应用不可以被重写； 对export/import 引用重命名export {name as myname};import {myname as name} from './index.js';所...
2020-03-27 13:40:18
113
转载 企业级的npm私有仓库搭建
前言npm 作为一种包管理工具，无论你是泛前端还是大前端都已经离不开它。它的出现方便了万千少年。让我们跨过了 Ctrl+C、Ctrl+V ，通过npm install x的方式将别人的优秀代码模块引入到自己的项目中。这些优秀的模块能被共享的原因，一方面是有 npm 这么一个包管理工具，另外就是 npm 仓库。对于 npm 仓库，如果你还停留在使用 npm 或者 cnpm 这类官方源的情况下。那么你有必要想想如何搭建一个私有的 npm 仓库。下面从三个方面讲解企业级 npm 私有仓库搭建那些事儿，..
2021-11-30 16:02:51
1910
原创 HTTPS 的原理（通俗易懂！）
一、前言一开始去真正接触HTTPS是由于在上线小程序的时候，小程序官方限定接口必须需是https协议，后面就去弄了腾讯云的云服务器，还有免费的https证书等，跟着官方的教程去配置https等等，让我知道： https默认端口号是443 https协议比http协议更加安全 需要将CA机构颁布的https证书安装在服务器上 nginx服务的一些配置（转发、入口文件html、gzip压缩） 最终，小程序也完美上线，但是好像我对HTTPS的底层原理和流程还是不清楚。下
2021-05-19 16:23:48
6613
原创 超实用的十条 VueRouter 高级技巧！
前言Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。包含的功能有： 嵌套的路由/视图表 模块化的、基于组件的路由配置 路由参数、查询、通配符 基于 Vue.js 过渡系统的视图过渡效果 细粒度的导航控制 带有自动激活的 CSS class 的链接 HTML5 历史模式或 hash 模式，在 IE9 中自动降级 自定义的滚动条行为 本文是作者是
2021-05-13 10:36:52
244
原创 浅析 Vue.js 中那些空间换时间的操作
本期的问题：在 Vue.js 模板的编译过程中，我们已经知道静态提升的好处：针对静态节点不用每次在render阶段都执行一次createVNode创建vnode对象。但它有没有成本呢？为什么？在回答问题前，我们简单回顾一下什么是静态提升，假设我们有如下模板：<p>hello{{msg}}</p><p>static</p>在开启hoistStatic编译配置的情况下最终编译结果如下：import{toDispla...
2021-05-13 08:51:16
448
原创 总结 Vue 性能优化方式及原理
前言我们在使用 Vue 或其他框架的日常开发中，或多或少的都会遇到一些性能问题，尽管 Vue 内部已经帮助我们做了许多优化，但是还是有些问题是需要我们主动去避免的。我在我的日常开中，以及网上各种大佬的文章中总结了一些容易产生性能问题的场景以及针对这些问题优化的技巧，这篇文章就来探讨下，希望对你有所帮助。一、使用v-slot:slotName，而不是slot="slotName"v-slot是 2.6 新增的语法，具体可查看:Vue2.6，2.6 发布已经是快两年前的事情了，但是现在仍然有不少人仍
2021-05-12 17:44:47
706
原创 JavaScript 开发者需要了解的15个 DevTools 技巧
1. 使用隐身模式隐身模式或私有模式会使用单独的用户配置文件，在浏览器重新启动之后不会保留Cookie，localStorage或缓存文件之类的数据。每个会话都会以干净的状态开始，所以非常适合测试登录功能、首次渲染性能和PWA程序2. 自动启动DevTools在开发的时候，一般都要需要启动浏览器，打开DevTools，并打开我们开发的URL。我们可以在浏览器启动命令中添加一些配置，整个过程可以在一次点击中实现自动化。最好创建一个新的快捷方式或脚本启动在开发模式，然后为Chrome...
2021-05-12 17:41:59
271
原创 Node.js 如何创建软链接，与硬链接有什么区别？
写这篇文章的原因 最近在做一些工程化相关的内容，有使用到fs.symlink(target,path), 查看Node.js文档发现讲的一般！所以这里详细整理下,并且记得之前在Linux下直接使用命令创建软链通过ls -s source_file target_file在想这两个参数位置有些怎么不一致呢？ 本文是我上一篇工程化系列文章中的一个小插曲,上篇文章现代前端工程化-彻底搞懂基于 Monorepo 的 lerna 模块(从原理到实战) 有提到软链接，那篇没有对软硬链接...
2021-04-12 09:10:37
1463
原创 HTTP缓存机制及原理
前言HTTP 的缓存机制，可以说这是前端工程师需要掌握的重要知识点之一。本文将针对 HTTP 缓存整体的流程做一个详细的讲解，争取做到大家读完整篇文章后，对缓存有一个整体的了解。HTTP 缓存分为 2 种，一种是强缓存，另一种是协商缓存。主要作用是可以加快资源获取速度，提升用户体验，减少网络传输，缓解服务端的压力。这是缓存运作的一个整体流程图：强缓存不需要发送请求到服务端，直接读取浏览器本地缓存，在 Chrome 的 Network 中显示的 HTTP 状态码是 200 ，在..
2021-04-12 09:07:55
340
1
原创 什么是作用域？几种常见的作用域详解
几乎所有编程语言就是在变量中存储值，并且能读取和修改此值。事实上，在变量中存储值和取出值的能力，给程序赋予了状态。如果没有这样的概念，一个程序虽然可以执行一些任务，但是它们将会受到极大的限制而且不会非常有趣。但是这些变量该存储在哪，又给如何读取？为了完成这个目标，需要制定一些规则，这个规则就是：作用域。常见的作用域主要分为几个类型：全局作用域、函数作用域、块状作用域、动态作...
2020-04-21 16:12:28
18621
1
原创 HTTP状态码和方法及首部
状态码分类整体范围 已定义范围 分类 100～199 100～101 信息提示 200～299 200～206 成功 300～399 300～305 重定向 400～499 400～415 客户端错误 500～599 500～505 服务器错误 常见状态码状态码 原因短语 含义 ...
2020-04-02 11:25:29
152
原创 解构赋值报错的几种场景
let [foo] = 1;let [foo] = false;let [foo] = NaN;let [foo] = undefined;let [foo] = null;let [foo] = {};上面的语句都会报错，因为等号右边的值，要么转为对象以后不具备 Iterator 接口（前五个表达式），要么本身就不具备 Iterator 接口（最后一个表达式）。...
2020-04-01 15:40:36
692
原创 CORS跨源资源共享
Access-Control-Allow-Origin：与简单的请求相同。 Access-Control-Allow-Methods：允许的方法，多个方法以逗号分隔。 Access-Control-Allow-Headers：允许的头部，多个头部以逗号分隔。 Access-Control-Max-Age：应该将这个 Preflight 请求缓存多长时间（以秒...
2020-03-28 11:14:14
143
原创 HTTP头部信息
Accept：浏览器能够处理的内容类型。 Accept-Charset：浏览器能够显示的字符集。 Accept-Encoding：浏览器能够处理的压缩编码。 Accept-Language：浏览器当前设置的语言。 Connection：浏览器与服务器之间连接的类型。 Cookie：当前页面设置的任何 Cookie。 Host：发出请求的页面所在的域 。 Referer：发出请求的...
2020-03-28 10:51:22
119
原创 遍历对象属性
Object.keys()能够得到自身的可以枚举的属性，但是得不到原型链上的属性 Object.getOwnPropertyNames()能够得到自身属性，包括不可枚举的属性，但是得不到原型链上的属性 Object.getOwnPropertySymbols()可以得到自身的Symbols属性，包括不可枚举的属性，不可被继承 for...in可以得到自身...
2020-03-25 11:11:31
359
原创 vue router 报错： Uncaught (in promise) NavigationDuplicate{_name: "NavigationDuplicated"} 解决方案
vue-router ≥3.0版本回调形式以及改成promise api的形式了，返回的是一个promise，如果路由地址跳转相同, 且没有捕获到错误，控制台始终会出现如图所示的警告 （注：3.0以下版本则不会出现以下警告！！！，因路由回调问题…）方案一：安装vue-router3.0以下版本：先卸载3.0以上版本然后再安装旧版本npm install @vue-router2.8...
2020-03-03 10:02:44
603
原创 Promise.all()、Promise.race()和Promise.allSettled()
Promise.all() Promise.all(iterable)方法返回一个Promise实例，此实例在iterable参数内所有的promise都“完成（resolved）”或参数中不包含promise时回调完成（resolve）；如果参数中promise有一个失败（rejected），此实例回调失败（reject），失败原因的是第一个失败promise的...
2020-01-10 13:41:29
847
原创 SSH 命令的11种用法
使用ssh连接远程主机 最简单的用法只需要指定用户名和主机名参数即可，主机名可以是 IP 地址或者域名。 $ ssh user@hostname ssh连接到其他端口 SSH 默认连接到目标主机的 22 端口上，可以使用-p选项指定端口号 $ ssh -p 10022 user@hostname 使用ssh在远程主机执行一条命令并显示到本地, 然后继续本地工作 直接连接...
2020-01-09 10:53:55
5501
原创 js浏览器事件循环机制
console.log(1);setTimeout(function() { console.log(2);})var promise = new Promise(function(resolve, reject) { console.log(3); resolve();})promise.then(function() { console.log(4);})console.log(5);
2020-01-07 10:12:41
294
原创 VS Code 新手指南
10个超好用的插件Chinese(Simplified) Language Pack for Visual Studio Code：安装之后一秒汉化 VS code，再也不用担心看不懂英文。 City Lights theme:这是一个不错的主题插件，不过挑选主题还是看个人，也可以在直接搜索 “theme”能得到很多主题，找到合适自己的。 Beautify:可以放大标记，调整代码间距...
2020-01-06 14:03:55
410
原创 vue底层原理解析（双向数据绑定）
1）通过建立虚拟dom树document.createDocumentFragment(),方法创建虚拟dom树2）一旦被监测的数据改变，会通过Object.defineProperty定义的数据拦截，截取到数据的变化3）截取到的数据变化，从而通过订阅——发布者模式，触发Watcher（观察者）,从而改变虚拟dom的中的具体数据4）最后通过更新虚拟dom的元素值，从而改变最后渲染dom...
2019-12-23 09:47:42
150
原创 SSR门户项目爬坑之路（三）
ssr之nuxt项目打包部署相关说明 一、环境安装1、安装nodewget https://nodejs.org/dist/v8.9.1/node-v8.9.1-linux-x64.tar.gz2、解压nodetar -zxvf node-v8.9.1-linux-x64.tar.gz -C /usr/local3、更换名字mv /usr/local/node-v8....
2019-11-07 15:30:50
359
原创 SSR门户项目爬坑之路（二）
plugins属性配置的所有插件会在 Nuxt.js 应用初始化之前被加载导入。开发相关具体事宜这里不详细说了，只说明一点ssr之nuxt的配置和路由问题 通过nuxt.config.js来覆盖默认的配置，一般要用到的主要是引入第三方插件或自定义的一些插件的问题plugins：例如(nuxt.config.js)：module.exports = { plugins: ['~p...
2019-11-07 15:23:41
155
原创 SSR门户项目爬坑之路（一）
说到门户项目一般都会考虑到服务端渲染，即SSR，以及前台和后台管理之类的事情，下面就是我们门户项目的开发过程：门户前台项目：项目架构搭建：这里我们使用vue的nuxt来创建项目确保安装了npx（npx在NPM版本5.2.0默认安装了）：$ npx create-nuxt-app <项目名>它会让你进行一些选择:当运行完时，它将安装所有依赖项，因此下一步是启动项目...
2019-11-05 09:37:36
444
原创 异步加载js的五种方式
1.设置<script>属性anync=“anync”（一旦脚本可用，则会异步执行）2.动态创建scriptDOM:document.createElement(“script”);3.XmlHttpRequest脚本注入；4.异步加载库LAB.js5.模块加载器Sea.js...
2019-05-31 20:15:24
261
原创 css那些属性可以继承？那些属性不可以继承？
可以继承的样式：font-size、font-family、color、list-style、cursor不可继承的样式：width、height、border、padding、margin、background
2019-05-31 20:09:42
1739
原创 使用vue-cli安装项目中devServe 设置open为true的时候浏览器启动两次的解决办法
在package.json中把scripts下的server属性配置后面加上--open就可以了"scripts": { "serve": "vue-cli-service serve --open", "build": "vue-cli-service build", "lint": "vue-cli-service lint", "prod": "vue-...
2019-05-31 20:04:09
7351
7
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人