Promise(三)：拓展方法实现
上次把 Promise 简单的实现了基本功能，趁热打铁，我们来实现一下它里面的拓展方法。 myPromise.prototype.catch123myPromise.prototype.catch = function (rejectFun) { return this.then(null, rejectFun);}; catch 方法实现起来还是简单的，通过调用 Promise 的 then 方法，只传入失败的回调；then 方法会把值传递下去。 myPromise.prototype.finally不管成功还是失败，都会执行 123456789myPromise.prototype.finally = function (finallyFun) { return this.then((res) => { finallyFun(); return res; }).catch((err) => { fiinallyFun(); return err; }); ...
Promise(二)：手动实现一个 Promise
上一篇文章我们认识了 Promise 的基本用法，现在来尝试手动来实现一下简单的 Promise 功能。 简易版 Promise123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384/*创建三个变量来表示状态*/const PENDING = "pending";const FULFILLED = "fulfilled";const REJECTED = "rejected";function myPromise(fn) { /* that 保存 this ，避免 this 指向问题*/ const that = this; /*value 用来保存 resolve 或 reject 中传入的值*/ that.value = null; /*默认状 ...
Promise(一)：Promise认识
Promise 是什么？Promise 是 ES6 中的一个重要特性，那 Promise 究竟长什么样子呢？我们来 console.dir()打印一下就知道了。从打印的结果可以看出，Promise 是一个构造函数，身上有许多方法: all,any,race,reject,resolve；原型上有 then,catch 等常用到的方法。 那我们来 new 一个 Promise 来看看。 1234567let pro = new Promise(function (resolve, reject) { //** 在里面执行一些异步操作*/ setTimeout(function () { console.log("三秒后执行"); resolve("数据data"); }, 3000);}); Promise 构造函数接收一个参数，是一个函数，里面传入两个参数 resolve,reject;它们分别表示异步操作执行成功后的回调和异步操作执行失败的回调。 Promise 概念Promise 的 ...
JS 合并数组对象中 key 值相同的数据
将数组里某个属性相同的对象合并到一个数组中原数组示例： 123456789101112131415161718let oldData = [ { type:"篮球", value:20 }, { type:"跑步", value:40 }, { type:"游泳", value:10 } { type:"跑步", value:15 }] 1希望获得的数据格式（即将相同”type“值的对象合并为一个新的数组） 123456789101112131415161718192021222324252627282930313233let resultData = [ { type: "篮球", infoList: [ { type: "篮球", value: ...
Markdown基本语法
一级标题1# 一级标题 二级标题1## 二级标题 三级标题1### 三级标题 四级标题1#### 四级标题 五级标题1##### 五级标题 六级标题1###### 六级标题 字体斜体 1*这段文字斜体显示* 加粗 1**文字加粗** 斜体加粗 1***斜体加粗*** 删除线 1~~删除线~~ 引用 嵌套引用 123>引用>>嵌套引用 —-分割线—– 12分割线****或---- 图片 1
解决 element 表格数据量过大导致页面渲染缓慢、卡顿问题
在 B/S 架构中，经常会遇到大数据渲染问题，毕竟 javascript 是单线程。 在使用 table 时，用户需要在上面做大量操作时，就需要考虑页面的渲染问题了。 导致卡顿原因：数据量过多导致浏览器一次性渲染过多的 DOM，导致 DOM 树占用内存溢出，使得用户操作阻塞。具体原因查看文章：DOM 性能瓶颈与 Javascript 性能优化 这里给提供两种表格插件： Vxe-table（基于 vue 的 pc 端表格插件） 优势： 可以自定义选择要引入的模块，有效减少项目体积 表格种类多 vue 扩展库 1.安装 1npm insatall xe-utils vxe-table 2.在 main.js 中引入 vxe-table 12345678910111213141516import Vue from "vue";import App from "./App.vue";import router from "./router";import store from "./store";impor ...
前端路由实现
路由概念路由的本质其实就是一种对应关系，比如说我们在浏览器地址栏输入 URL 地址后，浏览器就会请求对应的 URL 地址的资源；URL 地址和真实的资源之间就会形成一种对应的关系，就是路由。路由主要分为前端路由和后端路由。后端路由又称为服务端路由，**服务端中路由描述的是 URL 与处理函数之间的映射关系** 前端路由主要应用于 SPA 单页面应用架构，SPA 页面只有一个主页面，也就是挂载点，所有的页面内容都依赖于挂载点上，通过动态替换 DOM 内容和同步去修改 URL 地址来实现多页面的效果；前端路由描述的是 URL 和 UI 之间的映射关系，这种映射是单向的，通过 URL 的改变引起 UI 的更新，而且无需刷新页面。 前端路由的实现要实现前端路由，必须解决两个核心问题： 如何改变 URL 却不引起页面刷新？ 如何检测 URL 的变化？ hash 实现 hash 是 URL 中 hash(#)及后面的那部分，常用作锚点在页面内进行导航，改变 URL 中的 hash 部分不会引起页面刷新 通过 hashchange 事件监听 URL 的变化，改变 URL 的方式只有这几种：通 ...
使用 NProgress 为页面/接口添加加载进度条
当你打开一个页面，页面显示空白或者部分空白，那么用户就会怀疑你的网页是不是有问题。我们需要让我们的用户知道数据在路上，当他们点击一个需要请求数据链接时，就会给出反馈，让用户知道页面的加载情况 一、NProgress（一个轻量级进度条组件） 借用 axios 拦截器组合实现 通过组件内的路由守卫实现 通过路由的全局前置守卫实现 二、解决方案 1：NProgress 与 axios interceptors11）安装NProgress 1$ npm install nprogress 12） 安装好之后，需要在main.js中引入CSS 1import "nprogress/nprogress.css"; 13） 最后在axios中引入NProgress 1import NProgress from "nprogress"; NProgress 提供四个基本 API 12345678910111213141516171819202122NProgress.start(); // 开始展示进度条NProgress.set(0.4) ...
MySQL 数据库常用操作
连接 mysql mysql -h 主机地址 -u 用户名 -p 用户密码 连接本地在 mysql 安装目录下的 bin 下打开 cmd，输入命令 mysql -uroot -p,回车输入密码；如果刚安装好 MYSQL，超级用户 root 是没有密码的，故直接回车即可进入到 MYSQL 中了，MYSQL 的提示符是：mysql> 连接远程mysql -h192.168.8.1 -uroot -p123456 退出 exit 回车 修改密码 mysqladmin -u 用户名 -p 旧密码 password 新密码 mysqladmin -uroot -p123456 password 123 增加新用户 grant select on 数据库.* to 用户名@登录主机 identified by ”密码” 例 1：增加一个用户 test1 密码为 abc，让他可以在任何主机上登录，并对所有数据库有查询、插入、修改、删除的权限。首先用以 root 用户连入 MYSQL，然后键入以下命令： grant select,,update,delete on *.* to te ...
JS 循环遍历方法
本文主要总结一下 javascript 遍历方法。 for12345678let arr = [1, 2, 3];for (let i = 0; i < arr.length; i++) { console.log(i, arr[i]);}// 0 1// 1 2// 2 3 for 循环是最常用的遍历方法，主要用来遍历数组。 for in123456let obj = { name: "Li", age: 18 };for (i in obj) { console.log(i, obj[i]);}// name Li// age 18 for in 主要是遍历对象，i 表示对象 obj 的 key，obj[i]表示 value；当用于遍历数组时，i 输出为字符串形式，而不是数组需要的数字下标，这意味着在某些情况下，会发生字符串运算，导致数据错误，比如：’9’+1 = ‘91’ 而不是我们需要的 10,所以不建议用来遍历数组。另外 for in 循环的时候，不仅遍历自身的属性，还会找 ...
| {{date}} | {{temperature}} | {{humidity}} | ||
| {{time}} | ||||
| {{ip}} | {{city}} | {{daylight}} | ||
