- 博客(16)
- 收藏
- 关注
RSS订阅原创 js字符串补位（前补零/后补零）
以前经常会遇到需要给字符串补零的时候，比如把日期转换为期望的格式：function dateFormat (date, fmt) { var o = { 'M+': date.getMonth() + 1, // 月份 'd+': date.getDate(), // 日 'h+': date.getHours(), // 小时 'm+': date.getMinutes(), // 分 's+': date.getSeconds(), // 秒 '
2020-08-13 22:46:27
18408
2
原创 webpack处理图片资源--？
未解之谜：好像没有办法可以处理直接写在html文件中的style标签的样式？比如怎么也获取不到style标签里的背景图片资源的之类的。。url-loader & file-loader：处理css文件中的图片资源 html-loader / html-withimg-loader：处理html中直接引入的img图片资源（区别？）...
2020-07-13 15:42:49
426
原创 数组操作系列
判断是否为数组 伪数组转为数组 数组去重 数组拍平 排序算法判断是否为数组var arr = [1,2,3]Array.isArray(arr) // truearr.constructor == Array // truearr instanceof Array // trueObject.prototype.toString.call(arr) // "[object Array]"伪数组转为数组// es5Array.prototype.slice.call(
2020-07-08 09:31:57
174
原创 使用CleanWebpackPlugin报错
自己写的项目尝试使用webpack打包，因为开发时配置改动也很频繁，最终打包的dist文件夹中，有一些多余的文件。在webpack文档中有一个CleanWebpackPlugin插件，可以：在每次构建前清理/dist文件夹。...
2020-07-05 18:02:35
354
原创 从代码/资源/webpack方面考虑前端的性能优化
从三个维度简单整理一下前端性能优化可以做什么（不同维度之间有重叠）：代码优化减少dom操作，避免引起重绘和重排（回流） 事件绑定采取事件委托的方式（减少dom引用和内存占用） 减少闭包的使用（避免内存溢出，减少作用域链的查找层级） 使用函数防抖/节流 （避免无限制调用） 使用css选择器时减少选择层级（css选择器是从右向左解析的，原来层级越多查找越慢TT）资源优化使用tinypng等压缩图片资源 使用cdn链接方式引入 使用精灵图（减少请求次数） 合并/压缩js、css图片（减少h
2020-07-05 16:57:53
148
原创 css-loader、style-loader顺序
webpack使用css-loader和style-loader时，有个顺序问题：loader的加载顺序是从右往左，编译顺序应该是先用css-loader编译css代码，再用style-loader放入到网页的style标签里面去。所以css-loader在右，style-loader在左。module: { rules: [ { test: /\.css$/, use: ['style-loader', 'css-loade
2020-07-04 00:18:17
1485
原创 vue路由懒加载 / 按需加载的两种方式
当项目过大时，我们可以使用按需加载来减少首屏加载的时间，避免白屏、等待时间过长等问题。 常用的懒加载方式有两种：1.vue的异步组件const routes = [ { path:'./home', name: 'Home', component: (resolve) => { require('../views/Home.vue', resolve) } ...
2020-07-01 11:49:23
1008
原创 js阻止事件冒泡和默认事件
1.event.stopPropagation()方法这是阻止事件的冒泡方法，不让事件向documen上蔓延，但是默认事件任然会执行，当你掉用这个方法的时候，如果点击一个连接，这个连接仍然会被打开，2.event.preventDefault()方法这是阻止默认事件的方法，调用此方法是，连接不会被打开，但是会发生冒泡，冒泡会传递到上一层的父元素；3.return false ；这个方法比较暴力，他会同事阻止事件冒泡也会阻止默认事件；写上此代码，连接不会被打开，事件也不会传递到上一层的父.
2020-06-30 18:11:35
1078
原创 vue-cli-service: command not found
最近升级了vue-cli，从2.x版本跳到了4.x的@vue/cli：# 先卸载旧版npm uninstall -g vue-cli # 安装新版npm install -g @vue/cli 文档中有这么一段：在一个 Vue CLI 项目中，@vue/cli-service 安装了一个名为 vue-cli-service 的命令。你可以在 npm scripts 中以 vue-cli-service、或者从终端中以 ./node_modules/.bin/vue-cli-s
2020-06-24 02:52:55
50141
4
原创 一道有意思的题目
['1', '2', '3'].map(parseInt) // 输出[1, NaN, NaN]延伸题：let unary = fn => val => fn(val)let parse = unary(parseInt)console.log(['1.1', '2', '0.3'].map(parse)) // [1, 2, 0]若想把字符串数组转为数字数组：['1', '2', '3'].map(parseFloat) // 输出[1, 2, 3]// p.
2020-06-23 16:34:27
246
原创 display:none 和visibility:hidden的区别
display: none设置属性后，元素消失在文档流中，不再占位。因此也会导致文档页面重新构建，产生回流。=》性能差。 元素以及它的所有后代元素都会隐藏。visibility: hidden隐藏元素仍需占用与未隐藏时一样的空间，即仍然会占位，影响页面布局。也因此不会产生回流。 visibility具有继承性，给父元素设置visibility:hidden;子元素也会继承这个属性。如果重新给子元素设置visibility: visible,子元素又会显示出来。...
2020-06-14 23:10:57
146
原创 搞懂js函数柯里化
柯里化（Currying）是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术。 简单来说，以前写一个sum函数求两数之和，调用时是sum(a,b)，而柯里化之后的调用方式则变成了sum(a)(b)... 从公调用方法可以看出，sum函数返回的一定还是一个可被持续调用的函数。因此js中函数柯里化的基本方法也是：使用闭包来返回一个函数。将函数柯里化的通用方式如下：funtcion cu...
2020-06-10 11:52:07
317
原创 赋值、浅拷贝和深拷贝的区别
js中数据类型分为简单数据类型（Undefined、Null、Boolean、String、Number）和复杂数据类型（Object），基本数据类型按值访问，复杂数据类型按引用访问。变量的值也就分为基本类型值和引用类型值。基本类型值就是简单的数据段，引用类型值则是由多个值构成的对象。1、赋值基本类型值在内存中占用固定大小，因为被保存在栈内存里。给新变量赋值原变量的基本类值时，会创建一个新的副本，然后把这个值复制到给新变量分配的位置上。 引用类型值保存在堆内存中（动态分配空间），js不允许直接访问
2020-06-04 10:25:22
217
原创 动态加载js如何保证顺序执行？
我们知道，可以使用创建script标签的方法来动态加载js文件。但随之带来问题，如果创建多个script标签来加载多个js文件，这些文件是异步并行加载的，最后执行顺序不能保证是当初的scrpit标签创建顺序。也就是说，如果我们引入的js之间有依赖关系，能不能加载成功不报错 就是个随机事件了～function createScript (src) { let script = ...
2019-12-31 14:21:45
7313
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人