- 博客(71)
- 收藏
- 关注
RSS订阅原创 Vue-Router - 04 路由进阶之导航守卫
Vue-Router - 04 路由进阶之导航守卫声明：其实路由守卫官方文档很容易就能看明白的，比较重要的也包括 完整的导航解析流程应用场景页面跳转动画在另一个栏目 打开Vue的正确姿势 里，我码了一个Loading插件（注意，但是写的install方法才启动，你如果在这里要使用的化，最好再添加个导出的方法），或者可以直接用网络上的一些动画插件，如nprogress//导入插件样式import NProgress from 'nprogress'import 'nprogress/nprog
2021-01-28 14:59:40
208
原创 Vue-Router - 03 嵌套路线和动态跳转
Vue-Router - 03 嵌套路线和动态跳转该篇涉及到 children，redirect，props，及动态跳转嵌套路线之children属性const RouterView = { render: (h)=>(h('router-view'))}const User = { template: `<div> 这是User页面组件 </div>`}const Article = { template: `<div>
2021-01-28 14:58:50
291
原创 Vuex的介绍和使用
Vuex的介绍和使用本文按照Vuex官网参考编写，写的是自己对其的理解，当然官网已经写的很好了，只是有些东西还是不太好理解，希望用自己的话解释一遍Vue的单向数据流单向数据流：在每个Vue的实例里，(数据源) State => (数据源更新触发视图更新) view => (用户操作视图) Actions => (操作行为改变对应数据源) State什么是Vuex由于Vue的单项数据流在处理实例之间的通信比较复杂，比如多个组件依赖同一状态时，当某一个组件状态改变时关联的多个组
2021-01-28 14:35:07
194
原创 番外：透过JS代码看本质 - 05 闭包和this指针
闭包和this指针参考延迟解析：V8是如何实现闭包的？一、闭包当在一个函数A内定义一个函数B，真正不是完全的不管这个函数B，因为函数B能够访问函数A的变量和对象，这是一旦定义完函数B就确定的事情(1) 拆解闭包——JavaScript 的三个特性JavaScript 语言允许在函数内部定义新的函数可以在内部函数中访问父函数中定义的变量因为函数是一等公民，所以函数可以作为返回值（不一定要作为返回值，只要能够向外暴露就行）(2) 分析function foo() { v
2021-01-08 16:55:49
102
原创 番外：透过JS代码看本质 - 04 从执行上下文对象入手看声明提前
从执行上下文对象入手看声明提前资料js 中的活动对象 与 变量对象 什么区别？ 答主：貘吃馍香 的回答汤姆大叔的博客涉及到的关键词执行上下文（执行环境）活动对象、变量对象arguments、声明提前作用域链一、执行上下文（Execution Contexts）(1) 为什么要有执行上下文每个函数都有对应的执行环境，它定义了变量或者函数有权访问的数据，决定他们各自的行为执行上下文（执行环境）是存在的对象，是规范中的存在和引擎上实现，JS无法访问，无法操作，只不过大家都
2021-01-08 16:54:45
71
原创 番外：透过JS代码看本质 - 02 预编译、堆栈空间和函数环境
JavaScript预编译和堆栈空间一、JS代码执行前做了一些事情预编译前奏：确定函数环境（它是一个抽象的概念）预编译： 确定当前执行上下文对象（执行环境），声明提前并在内存开辟空间，存储变量和函数JS是静态作用域检测，代码一旦写好，作用域就确定了二、栈空间 和 函数环境栈是一种数据结果，先进后出。大家都知道函数是可以嵌套调用执行的，假设一个函数A调用函数B，当函数B执行完，应该要回到函数代码A继续执行，为了知道函数B执行完成之后应该回到哪个位置，那么在执行函数B之前应该先记录断点（汇编
2021-01-08 16:53:05
99
原创 番外：透过JS代码看本质 - 01 准备资料
准备资料参考浏览器是如何工作的：Chrome V8让你更懂JavaScript 讲了很多很好，但是有些东西需要补充V8引擎是如何工作 讲的相对简单，但是容易懂准备说作用域和执行环境这篇需要了解很多计算机基础知识，不然只会感觉花里胡哨看了个寂寞如果可以推荐看一些极客时间的《图解Goole V8》质量不错一、高级语言是如何被编译执行或者解释执行的极客时间的重学前端和图解Goole V8(1) 编译原理编译原理入门篇|一篇文章理解编译全过程编译目标：如果源代码在操作系统上
2021-01-08 16:45:43
117
原创 基于Vue对axios进行上层封装
基于Vue对axios进行上层封装这的里的很多东西都是基于上一节 axios 讲解的，如果你不是对axios了解，请先看该文章一、要真正拿axios进行实战之前要了解一些细节上的东西(1) 先搞清楚请求发送的配置和拦截问题axios的配置是可以合并的也有优先级，全局的axios.create创建的axios实例会自动吸取全局axios的配置修改任意axios实例的配置，都可以通过axios实例的defaults属性获取配置对象，再修改对应的配置项axios的拦截器并不是可合并的，
2021-01-05 13:52:17
367
原创 axios理解和使用
axios如果你还是对Promise比较生疏，那你对axios的深入了解一定会存在一些壁垒，更是难以对Axios进行上层封装，因此推荐先阅读了解Promise，再上手axios资料：axios 中文说明axios 官网axios 是一个基于 Promise 的 HTTP 库，可以用在浏览器和 node.js 中。在Web端本质上就是Ajax + Promise，服务端是htttp + Promise一、理解Axios为什么兴起完美的结合Promise 的使用，在fetch兼容性不
2021-01-03 21:18:38
1919
原创 Ajax理解和使用
Ajax理解和使用资料和文档MDN Ajax 还是那句话，推荐MDN，菜鸟教程对于新手或者急着使用的同学比较好，但是这也同样意味着失去了很多重要的细节一、Ajax简介(1) 什么是AjaxAJAX是异步的JavaScript和XML（Asynchronous JavaScript And XML）。简单点说，就是使用 XMLHttpRequest 对象与服务器通信。 它可以使用JSON，XML，HTML和text文本等格式发送和接收数据。(2) 为什么要Ajax传统的数据网页都是
2021-01-03 17:32:49
143
原创 Ajax跨域和Nginx反向代理
Ajax跨域和Nginx反向代理跨域是浏览器对其请求的过滤，保证安全一、一种流行的跨域方式 CORSCORS是后端配置，在前端请求时，后端的响应请求写入一些运行跨域字段来告诉浏览器不要拦截响应运行跨域优点：允许任何源访问服务，不产生跨域，但是也不安全缺点：CORS不允许前端携带Cookie，即使前端形式上运行携带，后端无法获取，也无法setCookie回写cookie当然对于不能携带cookie不是没有解决办法 =>前端要做： 设置请求运行携带凭证withCreden
2021-01-03 01:30:11
931
1
原创 番外：深入理解Promise - 03 Promise的几个重要问题
Promise的几个重要问题一、 Promise什么时候发生状态改变？什么时候获取值？前面说过Promise的excutor是同步执行的回调函数，但是可以触发异步任务，因此有两种情况：在excutor执行器中立即同步执行调用敲定函数，于是同步的实例改变状态并且获取到结果在excutor执行器中异步的执行调用敲定函数，比如setTimeout，于是异步的改变实例状态并获取结果二、Promise的实例什么一定要改变状态前指定回调函数吗？不！Promise的实例可以在任何时候指定或者说绑定
2021-01-02 13:39:09
199
原创 番外：深入理解Promise - 02 Promise状态和执行过程
Promise状态和执行过程参考资料Promise描述 MDNPromise使用 MDNPromise前端进阶必学 尚硅谷如果你自己阅读 MDN，并且对一些晦涩词汇准确理解，可能没有太大的必要看这篇文章；如果你还是想看一下的话并且上从第一篇文章进来的话，这篇文章将重新介绍 Promise一、Promise的描述Promise是一个构造函数，是一个类 => 承诺类（我个人喜欢这么叫）；Promise的实例对象代表一个在这个 promise 被创建出来时不一定已知的值，它让您能
2021-01-02 13:37:59
223
1
原创 番外：深入理解Promise - 01 准备工作和对Promise简单理解
准备工作和对Promise简单理解参考资料Promise描述 MDNPromise使用 MDNPromise前端进阶必学 尚硅谷一、准备工作(1) 什么是实例对象，什么是函数对象任何对象都是实例对象，即使是函数对象，它也是通过new Function形成的函数，它本质上是Function类的实例但是我们为什么要区分函数对象和实例对象呢？分清楚 属性 或者 方法 是属于 类 还是 类的实例简单一点的说：new Promise//当Promise被new的时候产生的对象是Prom
2021-01-02 13:37:22
125
1
原创 JavaScript 错误处理
错误处理一、What? 什么是错误处理错误是指导致系统不能按照用户意图工作的一切原因、事件。在程序设计过程中，由于某些错误的存在，致使程序无法正常运行，处理这些错误以使程序正确运行就称为错误处理。错误处理功能是衡量编译器性能的重要方面，它在帮助程序员尽快修改程序方面起到了非常重要的作用二、Why? 为什么需要错误处理程序出现错误，将停止运行，这对于一个后台服务来说是致命的（在服务器上的服务是需要24小时一直运行的）。为了保证程序的健壮性与容错性，即在遇到错误时程序不会崩溃，我们需要对异常进行处理三
2021-01-01 21:09:29
262
1
原创 鼠标能动但是无法点击屏幕（间歇性）
鼠标能动，无法点击屏幕，键盘能流畅使用一、短暂解决方法（急用）CTRL + ALT + DELETE 键唤醒操作界面，大部分在这个操作过后，鼠标就可以点击了，不需要进行任务管理器操作，重新进入界面注意刷新。如果上一步无效则点击任务管理器，在你能看到的进程、性能、应用历史记录…一栏，选择详细信息，选择explorer.exe进程，右键选择结束进程树（这个时候界面肯定会黑屏，没黑说明没有结束），再创建该进程 => 点击左上角的文件（任务管理器的左上角），运行新的任务 => 输入 explorer
2020-12-24 21:57:55
39208
5
原创 Java再入：09 在对象方法上进行抽象和约束的abstract和interface
09 在对象方法上进行抽象和约束的abstract和interface这一节要将的自然是抽象类和接口，但我们不仅将怎么用，还要讲为什么要这么用重写缺乏约束，父类无法知道子类是否重写，即使它并没有改变父类的行为，但程序员对子类的期望无法绝对的实现在子类上。因此需要对方法的重写进行约束虽然类是对对象的抽象而得到的模型，但是无法对类进行一个比较规范的编写和声明，无法对类的特性进行重用 => abstract 和 interface 解决了这一问题根据上面两点我们归纳出两个词：契约、规范一、
2020-12-16 13:00:00
136
原创 Java再入：06 - Object.equals方法
06 Object.equals方法PS：本节是对上一节的一些补充，比如常量池是啥，什么是构造函数一、equals 和 ==Java 中方法区与常量池在 JDK6.0 及之前版本，字符串常量池是放在 Perm Gen 区(也就是方法区)中，此时常量池中存储的是对象。在 JDK7.0 版本，字符串常量池被移到了堆中了。此时常量池存储的就是引用了。在 JDK8.0 中，永久代（方法区）被元空间取代了。java提供两种判断相等的方式：equals==Object.equals默认是 =
2020-12-16 00:50:25
77
原创 Java再入：07 - 修饰词
08 修饰词访问控制注意什么叫做同一包内 (看包路径) ， 子类可以和父类不在同一包内，可见性是类可见还是实例可见?DEFAULT (默认 -> 不写)(在非接口对象中， 不声明 权限修饰符 默认就是 public, 而接口成员变量默认 public static final ，方法是public)PUBKIC 公有 => 类 / 接口 / 变量 / 方法public 对象 为主对象public成员 可以被所有类访问public 方法和成员 都会被其子类继承PROTEC
2020-12-15 10:13:13
68
原创 Java再入：08 - 对象的多态
07 对象的多态方法函数签名方法的访问权限、返回类型、名字和参数列表称为方法的签名重载 Overload在一个类中，可以有多个同名的方法，但是要保证参数类型，数目不相同，否则会产生编译错误注意参数列表一定要不同 => 参数数量、参数类型、参数顺序被重载的方法必须改变参数列表；被重载的方法可以改变返回类型 ，但是无法以返回值类型作为重载函数的区分标准。被重载的方法可以改变访问修饰符，同上；被重载的方法可以声明新的或更广的检查异常；方法能够在同一个类中或者在一个子类中被重载。
2020-12-15 10:04:53
81
原创 Java再入：05 - 类和对象的创建
05 类和对象的创建在Java的世界里，必须先有类，才能有对象，这视乎和设计模式有关，如果你有玩过JavaScript，你就会发现其中的明显的区别一、内存模式参考文章：内存中的堆和栈到底是什么 从汇编层面分析，栈和堆内存的情况，但是还是没有说为什么需要栈和堆JVM调优总结 其中一部分解释了关于为什么需要堆栈现代高级语言基本都是分为含有下列部分：静态存储区域：是由编译器自动分配和释放的，即内存在程序编译的时候就已经分配好，这块内存在程序的整个运行期间都存在，直到整个程序运行结束时才被释
2020-12-14 15:32:27
160
原创 Java再入：04 - OOP面向对象设计 VS SP结构化程序设计
04 OOP面向对象设计 VS SP结构化程序设计(1) SP- 核心思想将问题的求解看作功能的处理，程序是功能的具体体现（比如设计一个算法，输入输出）。即对输入数据实施相关运算，将得到预期的结果- 优缺点优势：以功能为核心构建系统，目标明确，方法简便易行自定向下逐步求精的有效的开发策略劣势：以功能为核心的构建方式 => 稳定性差（添加功能繁琐），数据分散不清晰，有限的可重用性开发和用户语义鸿沟(2) OOP- 核心思想以数据为核心来实现功能，数据比功能更
2020-12-14 00:13:34
455
1
原创 Java再入：03 - 基本输入输出设备
03 基本输入输出设备输入 Scanner 对象import java.util.*; // import java.util.Scanner; //导入包//具体代码String name;Scanner in = new Scanner(System.in) // 传入输入设备System.out.print("What's your name?");name = in.nextLine();//输入整型数据System.out.print("your name is " + name
2020-12-14 00:12:32
140
原创 Java再入：02 - Java语言的基本成分
02 Java语言的基本成分默认大家都有C语言基础，所以一些东西只是简单的提一下，甚至忽略基本成分：字符集词法元素标识符和关键字运算符、限届符和分隔符字面量注释数据类型什么是数据类型数据类型的含义预定义数据类型数据类型的实例Java类型系统的概述Java的基本数据类型表达式含义计算过程中的类型转换类型兼容赋值自动类型转换表达式的运算顺序语句子程序一、数据类型(1) 数据类型定义类型名取值范围操作集合(2) 数
2020-12-14 00:11:30
133
原创 Java再入：01 - Java的环境搭建
Java入门一、JDK，JRE，SDK1. SDKSDK是Software Development Kit的缩写，中文意思是“软件开发工具包”。这是一个覆盖面相当广泛的名词，可以这么说：辅助开发某一类软件的相关文档、范例和工具的集合都可以叫做“SDK”。SDK是一系列文件的组合，它为软件的开发提供一个平台(它为软件开发使用各种API提供便利)。而SDK是辅助开发某一类软件的相关文档、范例和工具的集合。2. JDKJDK是Java Development Kit的缩写，中文意思是“Java开发
2020-12-14 00:10:35
78
原创 番外：对浏览器的执行过程的理解 -06 优化总结篇
06 优化总结篇一、页面加载阶段的优化 - 提高反馈性强的资源优先级第三节聊到的GUI线程渲染过程和第四节结合performance讲解，相信你已经对过程了解的比较清晰了。在我看来真正影响页面展示的东西是：线程之间来回切换，JS线程和GUI线程的轮番切换异常消耗性能JavaScript的执行一直是阻塞页面渲染的CSS放头 和 JS放尾？懒加载（lazy load 针对图片）HTML的第一次渲染的大小（分页滚动加载数据）(1) 第一点怎么解决？尽量减少style和script的数
2020-12-03 13:39:00
103
原创 番外：对浏览器的执行过程的理解 - 05 怎么理解操作DOM和样式
大家都说在操作DOM和CSSOM，但是这里的DOM和CSSOM到底是什么，和在GUI线程计算合成的DOM Tree和CSSOM又有什么关联吗？为什么说DOM的使用要读写分离，本文将带你拨开DOM和CSSOM的真面目
2020-12-03 00:23:08
134
原创 番外：对浏览器的执行过程的理解 - 04 浏览器环境下的事件循环机制
说了太多Parse CSS和Parse Html以及JS的执行，可以到底是谁在轮番的执行呢？执行有什么规律吗？事件循环不仅帮我们了解JS代码执行先后，更是为了更好的渲染UI，事件循环几乎是这一系列文章的中心
2020-12-03 00:22:22
158
原创 番外：对浏览器的执行过程的理解 - 02 如何调试和测验
编译器和浏览器不会对你说谎，所以，看到一些观点的不要盲目的相信，要去怀疑、测试、检验才能有提高。我们要研究的是浏览器的执行过程，自然要看到这个过程，Chrome的Performance这是一个不错的工具。
2020-12-01 16:31:52
79
原创 番外：对浏览器的执行过程的理解 - 03 先从文件的下载和解析时机开始聊起
浏览器渲染页面，自然要先下载文件，那么文件下载顺序有什么先后吗？又为什么要分先后？都说JS全阻塞，CSS半阻塞，到底阻塞是发生在什么时候呢？这篇文章将清晰的讲解
2020-12-01 14:55:07
483
原创 番外：对浏览器的执行过程的理解 - 01 基本概念的确立
本文并不是说就要带你理解浏览器源码，或者说读JS编译器源码，而是将已知的想较于权威的内容进行解读，并翻译成普通前端开发者能理解的文章，其中对大量的专业术语进行解析，使得读者更易理解，避免不必要的技术壁垒
2020-11-27 20:39:26
739
原创 01 初探JavaScript和概述
01 初探JavaScript和概述一、聊一下JavaScript的历史(1) 产生背景和原因早期的Html是什么样的呢？现在收藏的最早的网页那个时候还没有JavaScript呢！Css也还在整合当中，当初网页要实现一个表单的提交，可没有Html5这么简单轻松。以前的input可没有验证属性之类的验证方法，只有每次提交经有服务器验证确认才能确定自己是否有正确填写格式。对的也许你已经能够想到当时网民的痛苦，数据格式还不是其它错误都需要30s的等待回复时间，这是一个相当漫长的过程。直到1995年，终
2020-11-25 23:32:08
98
原创 深入理解生成器 Generator
生成器 Generator一、特征function后有一个*函数内部有yield，注意yield只有在带有*的函数內部出现才能使用，不然会发生错误看一个简单的 generator函数function* func(){ console.log("one"); yield '1'; console.log("two"); yield '2'; console.log("three"); return '3';}生成器函数generator调
2020-10-17 00:32:09
132
原创 两段代码让你完全理解迭代器
迭代器迭代器：是一个对象，它能对某个集合的值通过某些操作（next）进行遍历，并保持任何必要的状态，以便能够跟踪到当前的位置。//在权威指南中，提到的迭代器还是1.7版本，距离今天已经太久远了，ES6的iterator已经改变了很多规则，建议直接看ES6的Iteratorfunction iterator() { let count = 0 return { next: function() { return count++ } }}const myIt
2020-10-16 19:50:39
126
原创 浏览器客户端的文件资源处理(Bolb,File,FileReader,URL)
文件File 文件FileReader 文件读取器URL 资源路径对象Bolb 二进制对象（1）Blob一、什么是Blob？Blob是一个大的二进制对象构造器（类）Blob() 构造函数返回一个新的 Blob 对象。 blob的内容由参数数组中给出的值的串联组成。二、Blob参数array 是一个由ArrayBuffer, ArrayBufferView, Blob, DOMString 等对象构成的 Array ，或者其他类似对象的混合体，它将会被放进 Blob。DOMSt
2020-09-13 14:40:02
464
原创 SheetJs库--导入导出excel(xlsx)
SheetJs库资源github.com/SheetJSgithub.com/SheetJS/sheetjssheetjs官网使用<script type="text/javascript" src="//unpkg.com/xlsx/dist/xlsx.full.min.js"></script>(1) 说明 && 理解首先需要清除，xlsx可以处理多种数据原，htmltable、json、等。因此，xlsx选择Sheet类对象作为中间格式
2020-09-13 14:35:28
2313
原创 JSX in Vue
如果你写过React的JSX，那么对你来说，学的会非常快，但是由于所谓的JSX都是通过解析模板调用createElement函数，最好生成虚拟DOM。Vue的createElement和React的createElement显然不同，所有对于一些问题的需要特殊处理安装vue-cli-v4.x已经直接支持写JSX了，不需要配置官方文档，请仔细阅读vuejs/jsxCreateElemnet了解1. React中的createElemnet每个 JSX 元素只是调用React.creat.
2020-08-15 19:08:03
243
原创 namespace & room
namespace名称空间是一个通信通道，它允许您在一个共享连接上分割应用程序的逻辑[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Tfha4QfY-1597241464627)(https://socket.io/images/namespaces.png)]缘由：虽然只有一个后服务器，但是如果分割建立多个小的服务呢，并且该服务下和其它服务不冲突也不相联，即分割用户的技术，根据socket的命名空间。情况case：您希望创建一个只有授权用户才能访问的admin
2020-08-12 22:11:34
130
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人