- 博客(33)
- 收藏
- 关注
RSS订阅原创 代码风格
安装新版vscode和添加eslint插件添加如下设置："editor.formatOnSave": false, // 关闭编辑器的保存格式化"editor.codeActionsOnSave": { // 启用eslint保存时自动格式化修复代码 "source.fixAll.eslint": true},"eslint.format.enable": true,项目中添加.eslintrc.jsmodule.exports = { root: true, ..
2021-01-28 15:52:36
149
原创 JavaScript中常见的十种排序方法
注：文中所有示例均执行升序排列一、冒泡排序原理：比较相邻元素，如果前者大于后者，则调换位置，对每个元素执行，此时最后一个元素将是最大值，重复上述操作至排序完成。代码示例：function sort(arr) { for (var i = 0;i < arr.length;i++) { for (var j = 0;j < arr.length-...
2020-12-25 10:33:03
1460
2
原创 Windows下使用Rollup打包Vue源码问题
Rollup（rollup-plugin-alias）在Windows中解析路径错误导致修改node_module -> rollup-plugin-alias -> dist -> rollup-plugin-alias.js的源码搜索对应变量声明将其替换为以下代码const isFilePath = id => /(^\.?\/)|(^[a-zA-Z]\:(\\|\/))/.test(id); const directory = path.dirname(i.
2020-10-26 14:52:27
535
1
原创 JavaScript中的ToPrimitive规则
value toNumber toString toBoolean NaN NaN "NaN" false Infinity Infinity "Infinity" true [] 0 '"" true [1] 1 "1" true null 0 "null" false undefined NaN "undefined" ...
2020-09-09 10:45:04
851
原创 Vue v-if和v-for同时存在的处理方法
问题：<div v-for="item in items" v-if="show"> ...</div> 如果你的代码里出现了这样的结构就要小心了，在Vue源代码中（../src/compiler/codegen/index.js）中可以发现在模板编译生成代码时，Vue先执行了genFor，也就是说在两个指令同时存在时总是先生成迭代逻辑，再在迭代逻辑中进行genIf的处理，最后在整个迭代里每项都进行一次判断，对性能造成浪费。解决方式： ...
2020-09-09 10:20:42
2118
原创 常用JavaScript高阶函数
GitHub上有完整的代码和地址：https://github.com/rookie-mr/HigherOrderFunctions
2020-09-06 16:44:43
82
翻译 任务、微任务、队列和计划
以下内容来自 Google Chrome 的开发者Jake，此文为中文翻译版本。原文地址>>>当我告诉我的同事Matt Gaunt我正在考虑写一篇关于浏览器事件循环中的微任务排队和执行的文章时，他说:“我跟你说实话，Jake，我不打算读那个。”好吧，反正我已经写好了，所以我们都要坐在这里享受它，好吗?实际上，如果你更喜欢视频，Philip Roberts在JSConf上就事件循环做了一个很棒的演讲——微任务没有涉及，但它是对其余内容的一个很好的介绍。不管怎样，继续节目…用这一小
2020-08-22 17:03:21
188
原创 如何实现JavaScript中的 new 关键字
观察下方的代码：// 常见构造函数function Person(name) { this.name = name}Person.prototype.getName = function() { return this.name}// new 的模拟方法const objectFactory = function() { let obj = new Object() // 从Object.prototype上克隆一个对象 let Constru
2020-08-12 19:32:14
240
原创 JavaScript跨域技术
图像Ping：通过指定修改实例化图片对象的成功失败事件（onload，onerror）来监听请求的完成节点，修改src为访问路径。例如：let img = new Image() img.onload = img.onerror = function (e) {console.log('Done')} 缺点：只能用于get请求，由于无法获取到请求结果所以只能用于客户端到服务端的单向通信。JSONP（JSON with padding）：由两部分组成：回调函数和数据。回调函数是当响应到来时应该在页
2020-08-02 23:28:32
107
原创 JavaScript常见的浏览器环境及类型识别
varinBrowser=typeofwindow!=='undefined';varinWeex=typeofWXEnvironment!=='undefined'&&!!WXEnvironment.platform;varweexPlatform=inWeex&&WXEnvironment.platform.toLowerCase();varUA=inBrowser&&window...
2020-07-31 09:48:07
192
原创 Webpack常用Plugins
用于修改行为define-plugin：定义环境变量。 context-replacement-plugin：修改require语句在寻找文件时的默认行为。 ignore-plugin：用于忽略部分文件。用于优化commons-chunk-plugin：提取公共代码。 extract-text-webpack-plugin：提取 JavaScript 中的 CSS 代码到单独的文件中。 prepack-webpack-plugin：通过 Facebook 的 Prepack...
2020-07-22 22:16:12
380
原创 Webpack常用Loaders
加载文件raw-loader：把文本文件的内容加载到代码中去。 file-loader：把文件输出到一个文件夹中，在代码中通过相对 URL 去引用输出的文件。 url-loader：和 file-loader 类似，但是能在文件很小的情况下以 base64 的方式把文件内容注入到代码中去。 source-map-loader：加载额外的 Source Map 文件，以方便断点调试。 svg-inline-loader：把压缩后的 SVG 内容注入到代码中。 node-loader：...
2020-07-22 22:01:46
286
原创 一文读懂、入门Webpack
Q1：Webpack主要用来做什么？A1：Webpack是一个打包模块化 JavaScript 的工具，在 Webpack 里一切文件皆模块，通过 Loader 转换文件，通过 Plugin 注入钩子，最后输出由多个模块组合成的文件。Webpack 专注于构建模块化项目。Q2：为什么选择Webpack？A2：Web 开发的发展趋势如下：在 Npm Script 和 Grunt 时代，Web 开发要做的事情变多，流程复杂，自动化思想被引入，用于简化流程； 在 Gulp 时代开始出现一些新语言
2020-07-02 18:18:38
218
原创 Nginx 处理服务端重定向前端接收不到重定向响应结果问题
这一问题的原因在于服务端的重定向导致重定向后的请求头中没有主机信息，在Nginx配置中加入如下配置：proxy_set_header Host $host:80;重启服务器发现前端可以正常接收重定向后的返回信息了，OK！...
2020-04-03 14:08:21
2230
原创 原生Node实现从零搭建一个Node后台框架
计划用node实现了一个后台框架，相关的代码可以从GitHub上找到。地址：https://github.com/rookie-mr/node-native.git预期实现三个关键点：路由配置 中间件使用 基本的服务端渲染问题记录：如何将路由分离 将路由配置部分抽离，路由响应以回调函数的形式在服务启动之前引入绑定动态路由与静态资源请求如何区分 采用动态路由优先...
2020-02-25 22:27:33
638
原创 微信小程序中动态设置TabBar并解决闪动问题
最近接到一个需求用户在登录微信小程序时需要根据角色显示不同的tabbar内容，解决思路大致如下：创建自定义TabBar的模板tabbar.wxml，本例放置在pages目录下创建的template文件夹中<template name="tabBar"> <view class="tabbar" style="color: {{tabBar.color}}; backg...
2019-06-05 16:11:33
20918
9
原创 微信小程序中的客服功能
微信小程序的客服功能已经封装的十分完善，调用的方式也十分简单：在界面中添加button组件并添加 open-type="contact" 属性。 在微信开发者平台上启用客服功能，并添加客服人员。 在https://mpkf.weixin.qq.com/（微信公众平台客服登录）查看当前待接入的会话。具体的使用方式一目了然。现在用户在小程序中调用客服功能后，客服人员在PC端登录即可查看。...
2019-03-05 18:03:52
2268
13
原创 如何实现微信小程序之间跳转
要实现从一个小程序里跳转至另一个小程序粗略可分为三步：首先需要获取要跳转的小程序APP id。 将要跳转的APP id作为配置项添加到当前小程序的app.json文件中，参数为navigateToMiniProgramAppIdList，值为数组格式，待跳转的小程序APP id作为数组项，可支持多个，如："navigateToMiniProgramAppIdList": ["wx000000...
2019-03-04 11:30:44
1717
1
原创 混合APP开发技术选型
React Native https://reactnative.cn/ ionic https://ionicframework.com/docs/ weex https://weex.apache.org/zh/ Framework 7 http://framework7.taobao.org/ PhoneGap https://phonegap.com/ OnsenUI https...
2019-02-26 17:29:33
2231
原创 推荐几个VUE移动端UI框架
vonic 一个基于 vue.js 和 ionic 样式的 UI 框架，用于快速构建移动端单页应用。https://wangdahoo.github.io/vonic/docs/#/ vux 基于WeUI和Vue(2.x)开发的移动端UI组件库。https://vux.li/ Mint UI 由饿了么前端团队推出的 Mint UI 是一个基于 Vue.js 的移动端组件库。http://min...
2019-02-20 15:07:00
9504
原创 推荐几个VUE UI框架
以Github star数排名Element UI：饿了么前端打造VuetifyFramework 7QuasarVue-MaterialOnsenui大致浏览了一下组件，感觉都不错，具体的适用场景请大家自行对比吧！ ...
2018-11-21 16:12:04
1980
原创 ES6代理器Proxy简介
Proxy概述Proxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。Proxy 这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代...
2018-11-09 14:45:38
3309
原创 MongoDB的启动方式
基本步骤：下载并安装MongoDB。 将下载好MongoDB的bin文件加入到系统path环境变量（系统属性-->高级-->环境变量）。 mongod --dbpath=路径（如：C:\mongodb）。推荐可视化工具： adminMongo ...
2018-11-09 10:40:42
224
原创 JavaScript中的Set和Map数据结构总结
Set：基础用法Set类似于数组，但是成员的值都是唯一的，没有重复的值。Set本身为构造函数，用它来生成Set数据结构。 const set = new Set(); // Set 函数可以接受一个数组（或者具有 iterable 接口的其他数据结构）作为参数，用来初始化。Set 实例的属性和方法Set 结构的实例有以下属性。Set.prototype.constructor...
2018-11-06 16:37:47
335
原创 Git Bash 常用命令整理
1. 在指定文件夹中，右键git bash打开命令窗口2.git init 初始化本地仓库 当前文件夹中会出现.git文件夹表示成功3.git status 查看git状态4.命名全局用户名和邮箱地址 git conifg --global user.name "xxx" git config --global user.email 'xxx' 5.查看...
2018-11-02 12:31:20
414
1
原创 将本地项目上传至码云
步骤：1、码云上新建一个项目 XXXX（项目名） 2、本地创建一个项目文件夹，然后使用git bash（通过项目根目录右击或切换目录转至） 3、使用 git init 命令 //初始化一个git 本地仓库此时会在本地创建一个 .git 的文件夹 4、使用git remote add origin https://gitee.com/你的码云用户名/项目名（可查看项目克隆下载处...
2018-11-02 11:08:29
211
原创 本系统登出子系统不发生页面跳转的方法
最近的项目中用到了单点登录，在登录时会进入一个子系统中，校验成功后再回到本系统。在退出时遇到一个麻烦事，我在本系统点击一次退出需要跑到子系统中，子系统不会自动退出还需要再点一下退出才行，用户体验十分不好。解决方式如下：function logout() { // 先执行子系统的登出 var c_logout = "<form id='c-logout' action...
2018-10-26 15:08:14
442
原创 JavaScript中的正则表达式及一些新特性
RegExp 对象RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具。直接量语法/pattern/attributes创建 RegExp 对象的语法：new RegExp(pattern, attributes);参数参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。参数 attributes 是一个可选的字符串，包含...
2018-10-25 16:19:28
215
原创 微信小程序模板消息定点推送开发流程
管理员登录查看小程序APPID及秘钥，调用wx.login() 方法获取code备用。获取用户openid接口地址：https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code参数说明如下：...
2018-09-28 14:33:25
960
原创 微信小程序开发流程概述
准备工作：下载并安装微信开发者工具（https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html） 微信官方开发教程及文档 （https://developers.weixin.qq.com/miniprogram/dev/index.html）开发流程：申请账号 （https://mp.weixin.q...
2018-08-07 11:31:05
421
原创 JavaScript对象中的访问器属性
环境：支持ECMAScript 5 及以上的浏览器条件：必须通过Object.defineProperty或者Object.defineProperties添加语法： Object.defineProperty( '目标对象', '属性名', {get: function() {}, set: function() {}} ); Object.definePrope...
2018-07-11 16:21:57
562
原创 移动端布局方案
关于移动端布局的方案，我想从以下几个关键的名词说起：像素：是指在由一个数字序列表示的图像中的一个最小单位，称为像素。设备独立像素：设备独立像素(也叫密度无关像素)，可以认为是计算机坐标系统中得一个点，这个点代表一个可以由程序使用的虚拟像素(比如: css像素)，然后由相关系统转换为物理像素。屏幕分辨率：屏幕分辨率是指屏幕显示的分辨率。屏幕分辨率确定计算机屏幕上显示多少信息的设置，以水平和垂直像素来...
2018-06-27 10:02:34
1996
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人