摘要：
Vue Router功能 嵌套的路由/视图表 模块化的、基于组件的路由配置 路由参数、查询、通配符 基于 Vue.js 过渡系统的视图过渡效果 细粒度的导航控制 带有自动激活的 CSS class 的链接 HTML5 历史模式或 hash 模式，在 IE9 中自动降级 自定义的滚动条行为 安装 CD 阅读全文
摘要：
快速入门 引入vue <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> 写代码 <div id="app"> {{ message }} </div> 创建实例 var app = new Vue({ el: ' 阅读全文
摘要：
前言 开发环境(development)和生产环境(production)的构建目标差异很大 在开发环境中，我们需要具有强大的、具有实时重新加载(live reloading)或热模块替换(hot module replacement)能力的 source map 和 localhost serve 阅读全文
摘要：
source map错误提醒 JavaScript 提供了 source map 功能，将编译后的代码映射回原始源代码。这可以帮助我们追踪到错误和警告在源代码中的原始位置。 配置webpack.config.js module.exports = { entry: './src/main.js', 阅读全文
摘要：
起步 1、首先我们先创建一个项目，我将其命名为webpack-loader mkdir webpack-loader cd webpack-loader npm init npm install webpack webpack-cli --save-dev 由于webpack是本地安装的，所以此时相 阅读全文
摘要：
模式 提供 mode 配置选项，告知 webpack 使用相应模式的内置优化 在配置中设置选项 module.exports = { mode: 'production' }; 从cli参数中传递 webpack --mode=production loader 一个Web工程通常会包含HTML、J 阅读全文
摘要：
起步 在此之前我们先npm init初始化一个项目，本地安装webpack和webpack-cli，然后在根目录创建index.html、webpack.config.js和src文件夹，在文件夹内再创建一个main.js作为入口文件 准备工作完成后如图所示： main.js function Co 阅读全文
摘要：
前言 该笔记是基于居玉皓老师的《Webpack实战：入门、进阶与调优》与webpack官方文档的内容记录的 入口起点 资源处理流程 在一切流程的最开始，我们需要指定一个或多个入口（entry），也就是告诉Webpack具体从源码目录下的哪个文件开始打包。 如果把工程中各个模块的依赖关系当作一棵树，那 阅读全文
摘要：
了解概念 本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bu 阅读全文
摘要：
前言 本来在网上找了一些解决方案，说给table加上key就可以，然后我试了一下发现显示的还是上次渲染的数据。然后循着这个路子摸出了另一个方法 捋思路 需求 在一个表格内镶嵌一个表格，镶嵌的表格会根据所展开的行信息去发送请求并将最新数据渲染在页面上 采取的是手风琴效果，即只显示一行的数据 问题 镶嵌 阅读全文
摘要：
需求 <el-table :data="tableData"> <el-table-column prop="number" label="份数" /> </el-table> 此时number字段内容只是一个阿拉伯数字，我想作一些转换： 1 >第一份 方法 Table-column提供了一个方法 阅读全文
摘要：
1. State Vuex 使用单一状态树——用一个对象包含全部的应用层级状态。至此它就是“唯一数据源 (SSOT)”。这也意味着，每个应用将仅仅包含一个 store 实例。 组件中获得 Vuex 状态 计算属性 import store from './store' const Counter = 阅读全文
摘要：
初始化并安装相关包 mkdir vuexpack cd vuexpack npm init npm install --save-dev webpack webpack-cli npm install --save-dev vue vuex npm install --save-dev vue-lo 阅读全文
摘要：
Vuex是什么? Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 为什么使用vuex？ new Vue({ // state：驱动应用的数据源 data () { return {count 阅读全文
摘要：
浏览器加载 传统方法 <!-- 页面内嵌的脚本 --> <script type="application/javascript"> // module code </script> <!-- 外部脚本 --> <script type="application/javascript" src="p 阅读全文
摘要：
前言 背景：在 ES6 之前，社区制定了一些模块加载方案，最主要的有 CommonJS 和 AMD 两种。前者用于服务器，后者用于浏览器。ES6 在语言标准的层面上，实现了模块功能，而且实现得相当简单，完全可以取代 CommonJS 和 AMD 规范，成为浏览器和服务器通用的模块解决方案。 引入：下 阅读全文
摘要：
修饰器（Decorator）是一个函数，用来修改类的行为。修饰器对类的行为的改变，是代码编译时发生的，而不是在运行时。这意味着，修饰器能在编译阶段运行代码 类的修饰 //修饰器函数1：为类加上静态属性isTestable //修饰器函数的第一个参数，就是所要修饰的目标类 function testa 阅读全文
摘要：
如果对构造函数、原型对象、实例对象还不清楚，建议先看这里的原型基础部分 Class基本概念 传统方法是通过构造函数生成新对象 function Point(x, y) { this.x = x; this.y = y; } Point.prototype.toString = function () 阅读全文
摘要：
协程 多个线程互相协作，完成异步任务。yield命令表示执行到此处，执行权将交给其他协程，也就是说，yield命令是异步两个阶段的分界线。协程遇到yield命令就暂停，等到执行权返回，再从暂停的地方继续往后执行。 function *asyncJob() { // ...其他代码 var f = y 阅读全文
摘要：
Generator函数 Generator 函数是 ES6 提供的一种异步编程解决方案。Generator 函数在形式上具有两个特征： 一、function关键字与函数名之间有一个星号； 二、函数体内部使用yield语句，定义不同的内部状态 function* helloWorldGenerator 阅读全文
摘要：
引入 遍历器（Iterator）是一种接口，为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口，就可以完成遍历操作 //1. 遍历器生成函数 function makeIterator(array){ var nextIndex=0; return { next:fun 阅读全文
摘要：
设计目的 将Object对象的一些明显属于语言内部的方法（比如Object.defineProperty），放到Reflect对象上。然后就可以从Reflect对象上可以拿到语言内部的方法 修改某些Object方法的返回结果，让其变得更合理。比如，Object.defineProperty(obj, 阅读全文
摘要：
Set和Map数据结构 Set数据结构 ES6 提供了新的数据结构——Set。 Set 本身是一个构造函数，用来生成 Set 数据结构 1. 特性 Set成员的值都是唯一的，没有重复 const set = new Set ([1, 2 , 3 , 4, 4]); [ ...set] //[1, 2 阅读全文
摘要：
Proxy Proxy 用于修改某些操作的默认行为。Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。Proxy 这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代理器” 生成实例 阅读全文
摘要：
Symbol 背景：ES5的对象属性名都是字符串，这容易造成属性名的冲突。ES6引入了一种新的原始数据类型Symbol，表示独一无二的值，它就是Symbol数据类型 特性 1. Symbol值通过Symbol函数生成,它是一种类似于字符串的数据类型 let s = Symbol(); 2. Symb 阅读全文
摘要：
1.字符串的扩展 ES6 加强了对 Unicode 的支持，并且扩展了字符串对象 方法 codePointAt() String.fromCodePoint() at()：ES5对字符串对象提供charAt方法，返回字符串给定位置的字符，但不能识别码点大于0xFFFF的字符。这个可以 normali 阅读全文
摘要：
ES6 许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring） 1.数组解构赋值 let [a, b, c] = [1, 2, 3]; let [foo, [[bar], baz]] = [1, [[2], 3]]; foo // 1 bar // 2 ba 阅读全文
摘要：
let和const命令 Let 声明的变量只在let命令所在的代码块内有效 { let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1 for循环 for (let i = 0; i < 10; i++) {} c 阅读全文
摘要：
ECMAScript 6简介 ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。 //查看已经实现的es6特性 $ node --v8-options | gre 阅读全文
摘要：
原型基础 引入 原型对象的作用 数据共享，节省空间（需要共享的卸载原型对象中，不需要的写在构造函数中） 为了实现继承 简单了解原型对象 问题：用构造函数创建实例化对象时，如果实例化对象中有相同的属性或方法，实例化多个对象会占多个内存，浪费空间 解决：通过原型的方式，把共享的方法单独提出来写 //构造 阅读全文
摘要：
概念 文档：一个页面就是一个文档，文档中有根元素——html——根元素 元素（element）：页面中所有的标签都是元素，元素可以看成是对象。标签可以嵌套，标签中有标签，元素中有元素 节点（node）：页面中所有的内容都是节点，标签，属性，文本。即元素属于节点的一部分。 root:根 由文档及文档中 阅读全文
摘要：
window对象 浏览器的顶级对象：window 页面中的顶级对象：document 页面中的所有内容都是属于浏览器的，即页面的内容也都是window的 由于页面中所有内容都是window的，所以window可以省略 var num=10 console.log(num)==>实则：console. 阅读全文
摘要：
前言 JS分为三个部分 ECMAScript 标准 js的基本的语法 DOM Document Object Model 文档对象模型 BOM Browser Object Model 浏览器对象模型 JavaScript是什么 一门运行在客户端的脚本语言、一门解释性语言、一门动态类型的语言、一门基 阅读全文