- 博客(168)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 在vue里取消axios的请求
一、搬砖遇到的问题在搬砖的时候，遇到了一个问题，公共组件A是需要传一个数组进去渲染，在tab1下面是需要从接口请求返回的数据渲染，在tab2下则是读取配置文件的内容。在网络比较慢的情况下，快速从tab2切换到tab1再切换回tab2的时候，会先渲染tab2从配置文件中读取数组，然后再渲染成tab1请求回来的数据列表，然后就不再变化了。二、如此就需要在切换到tab2之前，把tab1的请求给取消了。三、具体的方法：取消单个请求的方法，可以像下面的方法，把CancelToken的source放在data里
2021-10-24 21:41:57
4250
1
原创 Promises/A+ 规范
一个开放的，可交互的由开发者制定的 JavaScript Promise 标准。一个 Promise 代表一个异步操作的最终结果。与 Promise 交互的主要方式是通过它的 then 方法，该 then 方法注册了两个回调函数，用来接收 Promise 的最终结果或者导致 Promise 不能 fulfilled（已完成） 的原因。本规范详细的列出 then 方法的行为，为所有符合 Promises/A+ 规范的 Promise 提供了一个可互操作的基础来定义 then 方法。因此本规范是稳定的。尽管
2021-08-31 13:57:50
322
原创 基金从业资格法规第一章
第一章 金融市场、资产管理与投资基金考点一：居民理财与金融市场金融：简单来讲即货币资金的融通居民：是社会最古老、最基本的经济主体（包含个人和企业）货币资金：来源于居民（包括个人和企业）从事的生产活动居民理财主要方式：是货币储蓄和投资考点二：金融市场分类按照交易工具的不同期限：分为货币市场（≤ 1年）和资本市场（> 1年）按交易性质：分为发行市场（一级市场）和流通市场（二级市场）按照交割期限：分为现货市场（2个交易日内）和期货市场（某一特定时间）按照不同的交易标的物：分为票据市
2021-05-29 14:28:24
282
原创 如何手动关闭elementUI的popover
在开发的过程中，有需要点击popover中的按钮，然后触发click事件，走完流程之后要关闭popover。查询了element的文档里，也没有相关的事件于是搜了一下，可以用以下的方法来解决我在popover上添加了一个ref，拿到了这个节点，看到这个节点上其实是有控制打开和关闭的方法的doShow()和doClose()的方法。所以可以使用this.$refs.popoverRef.doClose();来关闭这个popover了...
2021-03-22 13:46:32
9731
5
原创 CSS的书写顺序的问题
之前写CSS的时候都是想到什么属性就写什么属性，随意的很。特别是在调试样式的时候，还会把在浏览器调试的样式直接复制到随机的位置。虽然知道浏览器的回流和重绘都会影响渲染的性能，但是仅仅停留在了操作样式的时候，也没怎么考虑在初始写CSS的时候顺序。于是好好的学习了一下。CSS的书写顺序定位属性：position，z-index，display，float， left， right， top， bottom，clear，clip，overflow…尺寸属性：width，height，margin，pa
2021-03-19 09:55:54
193
原创 关于深拷贝
深拷贝，平常在用的时候，都会用JSON的方法const deepcloneObj = JSON.parse(JSON.stringify(obj));这个方法也存在很多的问题，拷贝的对象的值中如果有函数、undefined、symbol 这几种类型，经过 JSON.stringify 序列化之后的字符串中这个键值对会消失；拷贝 Date 引用类型会变成字符串；无法拷贝不可枚举的属性；无法拷贝对象的原型链；拷贝 RegExp 引用类型会变成空对象；对象中含有 NaN、Infinity 以及
2021-01-19 10:40:11
132
原创 TypeScript 开发实战 学习笔记（二）
9、范型不预先确定的数据类型，具体的类型在使用的时候才能知道function log<T>(value: T): T { console.log(value); return value}调用范型函数的时候，可以在函数名后面添加类型，也可以直接让ts类型推断直接写1）也可以定义一个范型函数类型type Log = <T>(value: T) => Tlet myLog: Log = log2）范型接口范型接口在使用的时候，必须指定范型的类型int
2021-01-06 14:42:31
131
原创 TypeScript 开发实战 学习笔记（一）
1、什么是TypeScript？一个拥有类型系统的JavaScript超集，可以编译成纯JavaScript。三个要点：类型检查，严格的类型检查，在编译阶段发现问题，不必把问题带到线上语言扩展，包含ES6及未来提案中的特性，也从其他语言借鉴特性，比如接口和抽象类工具属性，可以编译成纯JavaScript，可以在任何浏览器上运行，更像一个工具2、为什么要使用TypeScript？更好的IDE支持，比如VS Code 的自动补全，导航和重构功能，使得接口定义可以代替文档，可以提升效率，降低
2021-01-04 17:49:26
271
原创 【core/observer】之watcher
/* @flow */import { warn, remove, isObject, parsePath, _Set as Set, handleError, noop} from '../util/index'import { traverse } from './traverse'import { queueWatcher } from './scheduler'import Dep, { pushTarget, popTarget } from './dep
2020-12-29 17:41:15
162
原创 如何理解MVVM原理
一、什么是MVVM？MVVM是Model-View-ViewModel的简写Model：数据模型层，用来处理业务逻辑和与数据库交互View：视图层，DOMViewModel：视图模型层，用来处理Model层和View层的交互在MVVM框架中，将View层的状态和行为抽象化，视图 UI 和业务逻辑分开，ViewModel层通过双向绑定，把View层和Model层联系起来。ViewModel会自动的来处理这些事情二、MVVM的优点MVVM模式和MVC模式一样，目的是分离视图（View）和模型（
2020-12-21 23:00:44
7557
原创 解决vue下使用fastclick导致ios端需要点击2下才能触发click的问题
在vue里添加了fastclick来处理移动端点击延迟的问题，但是在mac上使用的时候，发现click事件需要点击2下才能触发点击事件。import fastclick from 'fastclick';const { userAgent } = navigator;const deviceIsIOS = !!userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);export const fastFunc = () => { /* eslin
2020-11-19 14:04:57
1269
6
原创 prettier设置内容
module.exports = { // 使用 2 个空格缩进 tabWidth: 2, // 不使用缩进符，而使用空格 useTabs: false, // 行尾需要有分号 semi: true, // 使用单引号 singleQuote: true, // 对象的 key 仅在必要时用引号 quoteProps: 'as-needed', // jsx 不使用单引号，而使用双引号 jsxSingleQuote: false, // 末尾不需要逗号
2020-11-19 13:42:20
1187
原创 移动端适配的处理
最近在用vue写适配移动端的h5页面，以前写的时候，都是用百分比来处理适配，现在准备简单一点。特整理一下我处理移动端适配的方法。调研了各种方法，决定采用px2rem和lib-flexible来处理适配，据说是手淘来处理移动端适配的模式。需要用到的包：postcss-px2remlib-flexible1、配置lib-flexiblelib-flexible这个包，可以根据页面尺寸和dpr，自动设置html的字体和meta缩放比例。npm install lib-flexible -S;
2020-11-12 09:54:36
149
原创 JavaScript设计模式之工厂模式学习
工厂模式就是定义了一个创建对象的接口，把创建的过程隐藏起来，让用户在使用的时候，只需调用这个接口创建对象，而不需要实例化这个类。该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型。1. 工厂模式类型工厂模式有三种类型：静态工厂模式工厂方法模式抽象工厂模式1.1 静态工厂模式静态工厂模式，又被称作简单工厂模式，就是根据用户输入的属性，来创建同一类对象。动物园里有几类动物，dog，cat，bird等；他们有各自的叫声，各自的特殊能力，我们根据这，来写静
2020-11-03 17:38:51
126
原创 自定义迭代器方法
写一个迭代器的类迭代一个数组或者字符串，考虑要有next()方法，要有[Symbol.iterator]属性等。class demoIterator { constructor(param) { this.count = 0; this.arr = param; this.limit = param.length; } next() { if (this.count <= this.limit) { return { done: false, value: this.pa
2020-11-03 10:34:05
267
原创 二叉树的遍历
最近在刷题的过程中，发现二叉树这个数据结构，并没有很好的理解。整理一下相关的遍历方法：一、二叉树的遍历方法：二叉树的遍历包含深度优先遍历，和层次遍历。深度优先遍历是先访问子节点，再访问父节点，最后是第二个子节点。层次遍历先访问第一个子节点，再访问第二个子节点，最后访问父节点。 其中深度优先遍历按照根结点在的位置，又可以分为先序遍历，中序遍历，和后序遍历。下面根据这个二叉树，整理一下相关的方法 // Definition for a binary tree node. function Tree
2020-10-28 14:19:08
66
原创 【Vue开发实战课后题】this.$emit()的返回值是什么
在vue中，this.$emit()的返回值是什么？用法：vm.emit( event, [...args] )参数：{ string } event[…args]返回值：vm用法：触发当前实例上的时间，附加的参数都会传给监听器回调。Vue.prototype.$emit = function(event) { const vm = this; let cbs = vm._events[event]; if (cbs) { const args = toArray(argu
2020-10-09 14:52:21
930
原创 【Vue开发实战课后题】子组件为何不可以修改父组件传递的props？
在 Vue 中，子组件为何不可以修改父组件传递的 Prop，如果修改了，Vue 是如何监控到属性的修改并给出警告的。一、为何不可以修改伏组件传递的Prop？因为Vue是单向数据流，为了保证数据的单向流动，便于对数据的追踪，出现了错误可以更加迅速的定位到错误发生的位置。所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定：父级 prop 的更新会向下流动到子组件中，但是反过来则不行。这样会防止从子组件意外变更父级组件的状态，从而导致你的应用的数据流向难以理解。额外的，每次父级组件发生
2020-10-09 14:37:47
1511
原创 解决 Uncaught TypeError: Super expression must either be null or a function报错
使用了G6之后，在打包的时候，出现了这个报错Uncaught TypeError: Super expression must either be null or a function最后发现是uglifyjs-webpack-plugin在压缩的时候出了问题目测是G6里有ES6相关压缩报错了。把uglifyjs-webpack-plugin改成terser-webpack-plugin就可以啦。...
2020-09-29 13:36:28
3779
2
原创 解决：Error: Content placeholder not found in template.报错
今天在研究vue的SSR，发现了这个报错<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head>
2020-09-27 16:26:06
903
原创 解决TS7008: Member ‘hasLogin‘ implicitly has an ‘any‘ type.
在vue的项目里使用ts，声明了一个变量，然后这个变量就报错export default class FontPage extends Vue { private hasLogin;}TS7008: Member 'hasLogin' implicitly has an 'any' type.很奇怪这个问题，就去查了一下是什么问题看到了解决方法：{ "compilerOptions": { "target": "es5", "module": "commonjs",
2020-09-21 14:49:07
3016
原创 解决npm WARN tar EINVAL: invalid argument, futime报错
问题描述在window上安装node环境，安装成功后，node和npm命令正常但是npm install报错解决问题一、思考是npm安装出先问题，重新安装npmnpm i -g npm@latest没有解决，二、思考是npm或者node缓存的问题, 清理缓存npm cache verify整理了缓存，还是没用三、思考是某个第三方库的问题，使用了淘宝源，删除了node_modules,都没用四、查看了一下硬盘的盘符，是fat32，把项目转到了NTFS的盘里，就可以了解决了，
2020-09-21 14:00:00
1315
2
原创 回溯算法套路整理
刷了好久的leetcode，也快刷满300道了，开始复习整理一下做题的套路。就从回溯算法开始吧。一、什么是回溯回溯法（back tracking）（探索与回溯法）是一种选优搜索法，又称为试探法，按选优条件向前搜索，以达到目标。但当探索到某一步时，发现原先选择并不优或达不到目标，就退回一步重新选择，这种走不通就退回再走的技术为回溯法，而满足回溯条件的某个状态的点称为“回溯点”。二、回溯的模板解决一个回溯问题，实际上就是一个决策树的遍历过程。在解决这些问题的时候，需要考虑三个问题：路径：也就是
2020-09-08 14:45:42
212
原创 Tree shaking学习
一、Tree shaking是什么Tree shaking 是一个通常用于描述移除 JavaScript 上下文中的未引用代码(dead-code) 行为的术语。它依赖于ES2015中的 import 和 export 语句，用来检测代码模块是否被导出、导入，且被 JavaScript 文件使用。二、Tree shaking的原理2.1 原理Tree shaking的本质是移除掉无用的js代码。无用代码移除存在于各种compiler中，compiler会根据代码的export和import的关
2020-09-02 10:59:53
166
原创 写一个方法，使得 sum(x)(y)和 sum(x,y)返回的结果相同
var sum = function(x) { if (arguments[1]) { return x + arguments[1]; } else { return function(y) { return x + y; }; }};console.log(sum(1)(2)); //3console.log(sum(1, 2)); //3增加难度： 使得 sum(x)(y)(z)(…)(a)和 sum(x,y,z,… a)返回的结果相同fun
2020-08-31 19:24:55
691
原创 HTTP 状态码 301 和 302 的区别和应用场景
301 Moved Permanently被请求的资源已永久移动到新位置，并且将来任何对此资源的引用都应该使用本响应返回的若干个 URI 之一。如果可能，拥有链接编辑功能的客户端应当自动把请求的地址修改为从服务器反馈回来的地址。除非额外指定，否则这个响应也是可缓存的。302 Found请求的资源现在临时从不同的 URI 响应请求。由于这样的重定向是临时的，客户端应当继续向原有地址发送以后的请求。只有在 Cache-Control 或 Expires 中进行了指定的情况下，这个响应才是可缓存的。303
2020-08-31 19:20:58
905
原创 【剑指 Offer 65】不用加减乘除做加法
写一个函数，求两个整数之和，要求在函数体内不得使用 “+”、“-”、“*”、“/” 四则运算符号。示例:输入: a = 1, b = 1输出: 2 提示：a, b 均可能是负数或 0结果不会溢出 32 位整数/** * @param {number} a * @param {number} b * @return {number} */var add = function(a, b) { while(b != 0){ let temp = a ^ b; //除去相
2020-08-31 19:17:29
84
原创 【剑指 Offer 66】构建乘积数组
给定一个数组 A[0,1,…,n-1]，请构建一个数组 B[0,1,…,n-1]，其中 B 中的元素 B[i]=A[0]×A[1]×…×A[i-1]×A[i+1]×…×A[n-1]。不能使用除法。示例:输入: [1,2,3,4,5]输出: [120,60,40,30,24]提示：所有元素乘积之和不会溢出 32 位整数a.length <= 100000/** * @param {number[]} a * @return {number[]} */var construct
2020-08-31 19:15:18
61
原创 【剑指 Offer 67】把字符串转换成整数
写一个函数 StrToInt，实现把字符串转换成整数这个功能。不能使用 atoi 或者其他类似的库函数。首先，该函数会根据需要丢弃无用的开头空格字符，直到寻找到第一个非空格的字符为止。当我们寻找到的第一个非空字符为正或者负号时，则将该符号与之后面尽可能多的连续数字组合起来，作为该整数的正负号；假如第一个非空字符是数字，则直接将其与之后连续的数字字符组合起来，形成整数。该字符串除了有效的整数部分之后也可能会存在多余的字符，这些字符可以被忽略，它们对于函数不应该造成影响。注意：假如该字符串中的第一个非空
2020-08-31 10:46:29
70
原创 tsconfig.json配置
{ // 用来配置编译选项 "compilerOptions": { "target": "esnext",// 生成js 的版本，下一版本 "module": "esnext", // 生成的module的形式，esm，cmd，amd啥的 "strict": false, // 是否严格模式 "jsx": "preserve", // jsx用于的开发环境，preserve/react/RN "importHelpers": true, // 指定是否引入.
2020-08-27 16:08:00
1990
原创 【剑指 Offer 68 - II】二叉树的最近公共祖先
给定一个二叉树, 找到该树中两个指定节点的最近公共祖先。百度百科中最近公共祖先的定义为：“对于有根树 T 的两个结点 p、q，最近公共祖先表示为一个结点 x，满足 x 是 p、q 的祖先且 x 的深度尽可能大（一个节点也可以是它自己的祖先）。”例如，给定如下二叉树: root = [3,5,1,6,2,0,8,null,null,7,4]示例 1:输入: root = [3,5,1,6,2,0,8,null,null,7,4], p = 5, q = 1输出: 3解释: 节点 5 和节点 1
2020-08-27 14:20:11
107
原创 【剑指 Offer 68 - I】二叉搜索树的最近公共祖先
给定一个二叉搜索树, 找到该树中两个指定节点的最近公共祖先。百度百科中最近公共祖先的定义为：“对于有根树 T 的两个结点 p、q，最近公共祖先表示为一个结点 x，满足 x 是 p、q 的祖先且 x 的深度尽可能大（一个节点也可以是它自己的祖先）。”例如，给定如下二叉搜索树: root = [6,2,8,0,4,7,9,null,null,3,5]示例 1:输入: root = [6,2,8,0,4,7,9,null,null,3,5], p = 2, q = 8输出: 6 解释: 节点 2
2020-08-27 13:58:14
68
原创 单例模式
在看《剑指Offer》的时候，看到单例模式的写法，以前只知道设计模式里有单例模式，但是它的写法，作用都不太了解，今天看到了，所以整理一下。1、什么是单例模式在维基百科上查到，单例模式，是一种常用的软件设计模式，属于创建型模式的一种。在应用这个模式时，单例对象的类必须保证只有一个实例存在。2、单例模式的实现思路实现单例模式的思路是：一个类能返回对象一个引用(永远是同一个)和一个获得该实例的方法（必须是静态方法，通常使用getInstance这个名称）当我们调用这个方法时，如果类持有的引用不
2020-08-20 23:25:16
114
原创 剑指Offer题解汇总
序号名称备注剑指 Offer 03数组中重复的数字数组 哈希表剑指 Offer 04二维数组中的查找数组 线性查找剑指 Offer 05替换空格剑指 Offer 06从尾到头打印链表剑指 Offer 07重建二叉树剑指 Offer 09用两个栈实现队列剑指 Offer 10-I斐波那契数列剑指 Offer 10-II青蛙跳台阶问题剑指 Offer 11旋转数组的最小数字剑指 Offer 12矩阵...
2020-08-17 22:28:40
151
原创 new 操作符具体干了什么
一、定义new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象类型之一在创建一个新的实例的时候，必须使用 new 操作符。而使用 new 操作符会经历以下 4 个步骤：创建一个新对象将构造函数的作用域赋值给新对象（this 指向新对象）执行构造函数中的代码（给新对象添加熟悉）返回新对象二、模拟 new 操作符的方法：new 实现了什么功能：访问到了构造函数里的属性访问到了构造函数 prototype 里的属性我们定义一个 mockNew 来模拟一下 new
2020-08-16 23:09:14
5721
原创 HTTP缓存总结
http缓存包含两种类型：强制缓存协商（对比）缓存一、强制缓存二、协商缓存三、相关的头部属性3.1 Cache-Controlcache-control可以作为请求头和响应头的字段，在http请求的过程中出现。请求头：响应头3.2 Expires(http 1.0 时期产物，在 http1.1 时期呗 cache-control 替代)3.3 Last-Modified （响应头）/ If-Modified-Since（请求头）Last-Modified：服务
2020-08-16 23:05:26
86
原创 Typescript 中的类有什么功能
JavaScript 中在 ES6 中有了类的概念，这个类是原型的语法糖。通过 Class 来实现继承一、类的相关概念类：类（Class）：定义了一件事物的抽象特点，描述了所创建的对象共同的属性和方法对象（Object）：通过 new 操作符生成的类的实例面向对象(Object-oriented programming): 面向对象是相对于面向过程来讲的，面向对象方法，把相关的数据和方法组织为一个整体来看待，从更高的层次来进行系统建模。其特点包括：封装、继承、多态。特点：封装（Enca
2020-08-16 22:53:41
371
原创 TypeScript 中的内置类型
刚入门 ts，看到好多内置类型，就想整理一下，方便以后在使用中能运用到。Partial描述：将类型 T 的所有属性标记为可选属性实现：type Partial<T> = { [P in keyof T]?: T[P];};用法：Partial<T>partial 这个类型，就是将某个类型里的属性添加上？，有了这个 modifier 之后，很多属性就可以是 undefined 了。例如：// 自定义的用户类型interface Person {
2020-08-14 13:37:14
4004
原创 【剑指 Offer 26】 树的子结构
输入两棵二叉树A和B，判断B是不是A的子结构。(约定空树不是任意一个树的子结构)B是A的子结构， 即 A中有出现和B相同的结构和节点值。例如:给定的树 A: 3 / \ 4 5 / \ 1 2给定的树 B： 4 / 1返回 true，因为 B 与 A 的一个子树拥有相同的结构和节点值。示例 1：输入：A = [1,2,3], B = [3,1]输出：false示例 2：输入：A = [3,4,5,1,2], B = [4,1]输出：
2020-07-28 13:57:13
62
原创 【剑指 Offer 25】 合并两个排序的链表
输入两个递增排序的链表，合并这两个链表并使新链表中的节点仍然是递增排序的。示例1：输入：1->2->4, 1->3->4输出：1->1->2->3->4->4限制：0 <= 链表长度 <= 1000/** * Definition for singly-linked list. * function ListNode(val) { * this.val = val; * this.next = null;
2020-07-28 13:55:33
66
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人