Pasoul
Pasoul
类型断言指手动指定一个值的类型，一般用来告诉`typescript`编译器：我已经明确知道这个值的类型是什么 ## 语法 `值` 或 `值 as 类型` ## 简单的例子 在[高级类型](https://github.com/Pasoul/blog/issues/21)一节中，我们提到**当一个联合类型的变量不能确定是哪个类型的时候，我们只能访问所有类型公有的属性和方法** ``` function getLength(something: string | number): number { return something.length; } // Property 'length' does not exist on type...
类型别名通常用来给一个类型取新名字。本质上不会创建一个新的类型，而是对原有类型的引用。 ## 语法 `type 新名字 = 类型` ## 简单的例子 ``` type Name = string; // NameResolver表示这是一个函数类型，并且函数的返回值类型是string type NameResolver = () => string; type NameOrResolver = Name | NameResolver; function getName(n:...
## 联合类型 联合类型表示一个值的类型可以是多个类型中的一种，多个类型之间用`竖线（|）`分开，比如`number|string`表示类型既可以是`number`也可以是`string` ### 简单的例子 ``` // 声明一个变量，值类型可以是number类型和string类型 let age: number|string = '10'; age = 10; ``` 但是如果我们给`age`赋值的类型是其他类型，编译将会报错： ``` let age: number|string = '10'; age = 10; age = true;...
枚举通常用于取值限定在一定范围的场景，比如一周只有七天，颜色被限定为红绿蓝等。 ### 简单的例子 枚举使用enum关键字来定义 `enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat};` 枚举成员默认被赋值为从0开始递增的数字，同时也可以从枚举值反向映射到枚举名 ``` enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat}; console.log(Days['Sun']); // 0 console.log(Days['Mon']); // 1...
# 名词解释 - Schema： 用于定义数据库的结构，类似创建表时的数据定义，不具备数据库的操作能力 - Model： 由Schema编译而成的假想（fancy）构造器，具有抽象属性和行为，可以对数据库进行增删盖茶，Model的每一个实例（instance）就是一个document。document可以保存到数据库和从数据库检索。 - Instance： 由Model创建的实例。 # 概念解析  # 简介 Mongoose是Nodejs环境下对Mongodb进行便捷操作的工具，使用之前需要先安装[Mongodb](https://www.mongodb.com/download-center#atlas)和[Nodejs](https://nodejs.org/en/download/),推荐一款mongodb的可视化工具[Robomongo](https://robomongo.org/download) # Mongoose的安装 npm i mongoose 安装成功之后可以通过require('mongoose')使用，并且可以在package.json的dependencies看到当前版本号 # 创建一个简单的数据库连接 创建mongoose.js，执行以下代码node mongoose.js ``` const mongoose...
## 我们为什么要持续集成？ 试想以下两个场景： 场景一：你在开发新功能的时候，同事A找你要小程序体验二维码，于是你只能： ``` git stash // 缓存本地修改 git checkout release // 切换到测试分支 yarn test // 打测试包 ... // 预览、切回分支 git stash pop // 还原本地修改 ``` 然后整理被打断的代码思路，继续coding，暗自吐槽（二维码是有35min过期时间的，一会又得找我了...） 场景二：小程序到了提测日期，恰巧负责开发的你今天请假了，意味着没人可以为测试同学打包，因此耽误了项目进度。 以上两个场景我们发现一个共同的问题，小程序的体验发布太依赖开发者，因为通常只有开发者熟悉微信开发者工具一系列的上传流程，从而导致影响开发进度、发布流程不可控等一系列问题......
# loader webpack允许我们在js模块中`import`css文件，这一切归功于强大的loader，可以使你在`import`或‘加载’模块时预处理文件，编译普通css模块一般使用`style-loader`和`css-loader`，后者将解析(resolve) `import/require()`的css模块，包括处理css中的`url()`和`@import`，前者将解析后的样式嵌入到`style`标签中，内联到html的head标签 # 使用style-loader和css-loader ## 安装 `npm install style-loader css-loader --save-dev` ## 用法 建议将style-loader和css-loader结合使用 项目目录：  - dist 存放打包后的文件 - src/css 创建极简单的样式 base.css: ``` html{ background: #f00; }...
# 概念 在实际业务中，某些文件不需要初始化的时候就加载进来，我们需要将这部分代码进行分割，只在合适的时机加载它们，这样既可以节省用户带宽，也可以提高页面载入速度 # 实现 ## webpack methods 1. require.ensure 参数: []:dependencies依赖，不会执行依赖 callback: 需要require要执行的依赖 errorCallback（可选） chunkName 2.require.include ## ES2015 Loader
# 为什么要提取公共代码 - 减少代码冗余 - 提高加载速度 # CommonsChunkPlugin CommonsChunkPlugin是webpack内置的插件，用于建立一个独立的文件，这个文件包括多个入口chunk的公共模块，通过将公共模块拆分出来，在最开始的时候加载一次，便存到缓存中供后续使用。 `new webpack.optimize. CommonsChunkPlugin(options)` ## 配置 ``` { // chunk的名称，如果传入数组，相当于数组的每一项都调用实例化插件 name: string, // or name: string[], // chunk的文件名模板，可以包含跟output.filename相同的占位符 filename: string, // 通常是个>1的整数，表示至少被chunk引入多少次，该模块才会被提取到公共chunk里...
# 需求分析 list页面点击列表的某一项(比如活动列表)，进入到detail页面进行编辑，list页面和detail页面关系是这样： ``` { path: '/list', component: List, children: [ path: 'detail', component: Detail ] } ``` detail页面返回到list页面时，希望刷新整个列表，但不刷新list页面(list页面还有其他的数据) # 最初的方法 1. 定义event bus，分别在list页面和detail页面引入 2. 在list的created钩子函数里面监听刷新事件 ``` Bus.$on('refreshList', () =>...