2020年08月_沿着路走到底

12月 10月 09月 08月 07月 05月

原创 HTTP缓存

当浏览器加载一个页面时，html引用的外部资源也会加载。但这些外部资源，比如：图片、css、js不经常发生变化，如果每次都加载这些外部资源会带来资源的浪费，而且加载时间过长也会影响用户体验。HTTP缓存技术就是为了解决这个问题而出现的。HTTP缓存将静态资源存储在浏览器内部，下次请求相同资源时可以直接使用。也会有一些系列的策略来保证如果资源一旦更新，缓存也要随之而更新。一、强缓存策略直接从本地副本比对读取，不去请求服务器，返回的状态码是 200。强缓存可以设置静态资源有效期，如果..

2020-08-28 14:45:47 369

原创五、数值的扩展

二进制和八进制表示法ES6提供了二进制和八进制数值的新写法，分别用前缀 0b （或 0B）和 0o （或0O）表示。0b111110111 === 503 // true0o767 === 503 // true如果要将使用 0b和 0o前缀的字符串数值转为十进制数值，要使用Number方法。Number('0b111') // 7NUmber('0o10') // 8Number.isFinite()、Number.isNaN()...

2020-08-17 20:23:12 141

原创四、正则的扩展

先预习下ES5的正则正则表达 regular expression（有规律的表达）测试字符串的某个模式。例如，可以测试字符串是否存在一个电话号码模式或email格式。这称为数据有效性验证替换文本。可以在文档中使用一个正则表达式来标识特定文字，然后可以全部将其删除，或者替换为别的文字根据模式匹配从字符串中提取一个子字符串。可以用来在文本或输入字段中查找特定文字-------------------------------------------------------------...

2020-08-16 20:57:24 156

原创三、字符串的扩展

字符的 Unicode 表示法ES6里，只要将码点放入大括号，就能正确解读该字符"\u{20BB7}" // "????""\u{41}\u{42}\u{43}" // "ABC"let hello = 123hell\u{6F} // 123codePointAt()

2020-08-15 20:22:07 180

原创二、变量的解构赋值

数组的解构赋值基本用法let [a, b, c] = [1, 2, 3]上面的代码表示，可以从数组中提取值，按照对应位置对变量赋值。本质上，这种写法属于 "模式匹配" ，只要等号两边的模式相同，左边的变量就会被赋予对应的值。下面是一些使用嵌套数组进行解构的例子。let [foo, [ [bar], baz] ] = [1, [ [2], 3 ]]foo //1bar // 2baz // 3let [, , third] = ["foo", "bar", "...

2020-08-12 22:53:23 176

原创一、let 和 const

let命令一、let命令用于声明变量。所声明的变量只在 let命令所在的代码块内有效。{ let a = 10 var b = 1}b // 1a // ReferenceError: a is not defined二、for循环的计数器使用let命令var a = []for(let i = 0; i<10;i++) { a[i] = function() { console.log(i) ...

2020-08-12 13:25:33 254

原创 vue训练营14 --- 谈一谈你对vue响应式原理的理解

答题思路：1.啥是响应式？2.为什么 Vue需要响应式？3.它能给我们带来什么好处？4. Vue的响应式是怎么实现的？有哪些优缺点？5.Vue3中响应式的新变化回答范例：1.所谓数据响应式就是能够使数据变化可以被检测并对这种变化做出响应的机制。2. mvvm框架中要解决的一个核心问题是连接数据层和视图层，通过数据驱动应用，数据变化，视图更新，要做到这点的就需要对数据做响应式处理，这样一旦数据发生变化就可以立即做出更新处理。3.以 vue为例说明，通过...

2020-08-09 15:25:35 126

原创 vue训练营13 --- nextTick

这道题考察大家对vue异步更新队列的理解答题思路：1.nextTick是什么2. 为什么需要它呢？用异步更新队列实现原理解释3.在什么地方使用它呢？4. 如何使用 nextTick5.说出源码实现1.官方定义Vue.nextTick([callback, context])在下次 DOM更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法。获取更新后的 DOM。//修改数据vm.msg = 'Hello'// DOM 还没有...

2020-08-07 16:23:01 123

原创 vue训练营12 --- vue-router中如何保护指定路由的安全

路由守卫：全局守卫：router.beforeEachrouter.beforeResolverouter.afterEach路由独享守卫：beforeEnter组件内守卫：beforeRouteEnter beforeRouteUpdate(2.2 新增) beforeRouteLeave全局前置守卫const router = new VueRouter({ ... })router.beforeEach((to, f...

2020-08-06 17:24:33 634

原创 vue训练营11 --- vue中组件之间的通信方式

组件通信方式：props$emit / $on$children / $parent$attrs / $listenersprovide / injectref$rooteventbusvuex父子之间组件通信props$emit / $on$parent / $childrenref$attrs / $listeners兄弟之间组件通信$parent$rooteventbusvuex跨层级之间组件通信...

2020-08-06 11:12:43 130

原创 vue训练营10 --- vuex使用及理解

回答策略：1.首先给vuex下一个定义2.vuex解决了哪些问题，解读理念3.什么时候我们需要vuex4.你的具体用法5.简述原理，提升层级总结：1.vuex是状态管理库。它以全局方式集中管理应用的状态，并且可以保证状态变更的可预测性。2.vuex主要解决的就是多组件之间状态共享的问题。利用各种组件通信方式，虽然也能做到状态共享，但是往往需要多个组件之间保持状态的一致性，这种模式很容易出现问题，也会使程序变得复杂。vuex通过把组件的共享状态抽取出来，以全局单例模式...

2020-08-05 16:54:36 126

原创 vue训练营9 --- vue3新特性

根据尤大的PPT总结，Vue3.0改进主要在以下几点：更快虚拟DOM重写优化slots的生成静态树提升静态属性提升基于Proxy的响应式系统更小：通过摇树优化核心库体积更容易维护：TypeScript + 模块化更加友好跨平台：编译器核心和运行时核心与平台无关，使得Vue更容易与任何平台（Web、Android、iOS）一起使用更容易使用改进的TypeScript支持，编辑器能提供强有力的类型检查和错误及警告更好的调试支持独立的响应化模块Composition API虚拟 .

2020-08-03 16:53:23 200

原创 vue训练营8 --- vue性能优化

答题思路：根据题目描述，这里主要探讨Vue代码层面的优化一、路由懒加载const router = new VueRouter({routes: [ { path: '/foo', component: () => import('./Foo.vue') } ]})二、keep-alive缓存页面<template><div id="app"> <keep-alive> <rou...

2020-08-03 16:47:52 165

原创 vue训练营7 --- 谈谈你对MVC、MVP和MVVM的理解

答题思路：此题涉及知识点很多，很难说清、说透，因为mvc、mvp这些我们前端程序员自己甚至都没用过。但是恰恰反映了前端这些年从无到有，从有到优的变迁过程，因此沿此思路回答将十分清楚。Web1.0时代在web1.0时代，并没有前端的概念。开发一个web应用多数采用ASP.NET/Java/PHP编写，项目通常由多个aspx/jsp/php文件构成，每个文件中同时包含了HTML、CSS、JavaScript、C#/Java/PHP代码，系统整体架构可能是这样子的：这种架构的好处是简..

2020-08-03 16:32:41 320

原创 vue训练营6 --- vue设计理念

在vue的官网上写着大大的定义和特点：渐进式JavaScript框架易用、灵活和高效所以阐述此题的整体思路按照这个展开即可。渐进式JavaScript框架：与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。易用性vue提供数据响应式、声明式模板语法和基于配置的组件系统等核心特性。这些使我们只需要

2020-08-03 14:59:12 232

原创 vue训练营5 --- 谈一谈对vue组件化的理解

源码分析1：组件定义src\core\global-api\assets.js源码分析2：组件化优点src\core\instance\lifecycle.jslifecycle.js - mountComponent() 组件、Watcher、渲染函数和更新函数之间的关系源码分析3：组件化实现构造函数，src\core\global-api\extend.js实例化及挂载，src\core\vdom\patch.js - createElm() ---...

2020-08-03 14:14:33 278