欢迎来到我的小站

:::tip 说明：本章内容是博主的Vue学习笔记，以官方文档为准。 ::: MVVM模式MVVM模式，M即 model，数据模型；V即 view，视图；VM即 view-model，视图模型。 理解 首先，数据Model通过Data Bindings把数据绑定在View视图上， 当View视图有交互（有改变）的时候，Dom listeners会自动监听，然后更新数据Model。 Q：什么是MVVM模式？ A：MVVM模式，第一个M代表数据模型，V代表视图，VM代表视图模型；它的实际操作原理是：后台数据通过视图模型来渲染视图，就是页面。当用户在页面上进行操作的时候，视图模型会自动监听到用户的操作，从而改变后台数据。

高级类型交叉类型交叉类型是将多个类型合并为一个类型。 这让我们可以把现有的多种类型叠加到一起成为一种类型，它包含了所需的所有类型的特性。 例如，Person & Loggable 同时是 Person 和 Loggable。 就是说这个类型的对象同时拥有了这两种类型的成员。 我们大多是在混入（mixins）或其它不适合典型面向对象模型的地方看到交叉类型的使用。 （在 JavaScript 里发生这种情况的场合很多！） 下面是如何创建混入的一个简单例子： 12345678910111213141516171819202122232425262728293031function extend<T, U> (first: T, second: U): T & U { let result = {} as T & U for (let id in first) { result[id] = first[id] as any } for (let id in second) { i ...

类型推断这节介绍 TypeScript 里的类型推断。即，类型是在哪里如何被推断的。 基础TypeScript 里，在有些没有明确指出类型的地方，类型推断会帮助提供类型。如下面的例子： 1let x = 3 变量 x 的类型被推断为数字。 这种推断发生在初始化变量和成员，设置默认参数值和决定函数返回值时。 大多数情况下，类型推断是直截了当地。后面的小节，我们会浏览类型推断时的细微差别。 最佳通用类型有些时候我们需要从几个表达式中推断类型，会使用这些表达式的类型来推断出一个最合适的通用类型。例如， 1let x = [0, 1, null] 为了推断 x 的类型，我们必须考虑所有元素的类型。 这里有两种选择：number 和 null。 计算通用类型算法会考虑所有的候选类型，并给出一个兼容所有候选类型的类型。 由于最终的通用类型取自候选类型，有些时候候选类型共享一个公共结构，但是却没有一个类型能做为所有候选类型的超级类型。例如： 1234567891011class Animal { numLegs: number}class Bee extends Anima ...

泛型软件工程中，我们不仅要创建定义良好且一致的 API，同时也要考虑可重用性。 组件不仅能够支持当前的数据类型，同时也能支持未来的数据类型，这在创建大型系统时为你提供了十分灵活的功能。 在像 C# 和 Java 这样的语言中，可以使用泛型来创建可重用的组件，一个组件可以支持多种类型的数据。 这样用户就可以以自己的数据类型来使用组件。 基础示例下面来创建第一个使用泛型的例子：identity 函数。 这个函数会返回任何传入它的值。 你可以把这个函数当成是 echo 命令。 不用泛型的话，这个函数可能是下面这样： 123function identity(arg: number): number { return arg} 或者，我们使用 any 类型来定义函数： 123function identity(arg: any): any { return arg} 使用 any 类型会导致这个函数可以接收任何类型的 arg 参数，但是这样就丢失了一些信息：传入的类型与返回的类型应该是相同的。如果我们传入一个数字，我们只知道任何类型的值都有可能被 ...

函数函数是 JavaScript 应用程序的基础，它帮助你实现抽象层，模拟类，信息隐藏和模块。在 TypeScript 里，虽然已经支持类，命名空间和模块，但函数仍然是主要的定义行为的地方。TypeScript 为 JavaScript 函数添加了额外的功能，让我们可以更容易地使用。 基本示例和 JavaScript 一样，TypeScript 函数可以创建有名字的函数和匿名函数。你可以随意选择适合应用程序的方式，不论是定义一系列 API 函数还是只使用一次的函数。 通过下面的例子可以迅速回想起这两种 JavaScript 中的函数： 123456789// 命名函数function add(x, y) { return x + y}// 匿名函数let myAdd = function(x, y) { return x + y;} 在 JavaScript 里，函数可以使用函数体外部的变量。 当函数这么做时，我们说它‘捕获’了这些变量。 至于为什么可以这样做以及其中的利弊超出了本文的范围，但是深刻理解这个机制对学习 JavaScript ...

类对于传统的 JavaScript 程序我们会使用函数和基于原型的继承来创建可重用的组件，但对于熟悉使用面向对象方式的程序员使用这些语法就有些棘手，因为他们用的是基于类的继承并且对象是由类构建出来的。 从 ECMAScript 2015，也就是 ES6 开始， JavaScript 程序员将能够使用基于类的面向对象的方式。 使用 TypeScript，我们允许开发者现在就使用这些特性，并且编译后的 JavaScript 可以在所有主流浏览器和平台上运行，而不需要等到下个 JavaScript 版本。 基本示例下面看一个使用类的例子： 1234567891011class Greeter { greeting: string constructor(message: string) { this.greeting = message } greet() { return 'Hello, ' + this.greeting }}let greeter = new Greeter(' ...

接口TypeScript 的核心原则之一是对值所具有的结构进行类型检查。它有时被称做“鸭式辨型法”或“结构性子类型化”。 在 TypeScript 里，接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。 接口初探下面通过一个简单示例来观察接口是如何工作的： 123456function printLabel(labelledObj: { label: string }) { console.log(labelledObj.label)}let myObj = { size: 10, label: 'Size 10 Object' }printLabel(myObj) 类型检查器会查看 printLabel 的调用。printLabel 有一个参数，并要求这个对象参数有一个名为 label 类型为 string 的属性。 需要注意的是，我们传入的对象参数实际上会包含很多属性，但是编译器只会检查那些必需的属性是否存在，以及其类型是否匹配。 然而，有些时候 TypeScript 却并不会这么宽松 ...

变量声明let 和 const 是 JavaScript 里相对较新的变量声明方式。let 在很多方面与 var 是相似的，但是可以帮助大家避免在 JavaScript 里常见一些问题。const 是对 let 的一个增强，它能阻止对一个变量再次赋值。 因为 TypeScript 是 JavaScript 的超集，所以它本身就支持 let 和 const。 下面我们会详细说明这些新的声明方式以及为什么推荐使用它们来代替 var。 如果你已经对 var 声明的怪异之处了如指掌，那么你可以轻松地略过这节。 var 声明在 ES5 的时代，我们都是通过 var 关键字定义JavaScript 变量： 1var a = 10 大家都能理解，这里定义了一个名为 a 值为 10 的变量。 我们也可以在函数内部定义变量： 12345function f() { var message = 'Hello World!' return message} 并且我们也可以在其它函数内部访问相同的变量： 12345678910function f()  ...

基础类型TypeScript 支持与 JavaScript 几乎相同的数据类型，此外还提供了实用的枚举类型方便我们使用。 布尔值最基本的数据类型就是简单的 true/false 值，在JavaScript 和 TypeScript 里叫做 boolean（其它语言中也一样）。 1let isDone: boolean = false 数字和 JavaScript 一样，TypeScript 里的所有数字都是浮点数。 这些浮点数的类型是 number。 除了支持十进制和十六进制字面量，TypeScript 还支持 ECMAScript 2015中引入的二进制和八进制字面量。 1234let decLiteral: number = 20let hexLiteral: number = 0x14let binaryLiteral: number = 0b10100let octalLiteral: number = 0o24 字符串JavaScript 程序的另一项基本操作是处理网页或服务器端的文本数据。 像其它语言里一样，我们使用 string 表示文本数据类型。 和 JavaScr ...

简介TypeScript 作为 JavaScript 语言的超集，它为 JavaScript 添加了可选择的类型标注，大大增强了代码的可读性和可维护性。同时，它提供最新和不断发展的 JavaScript 特性，能让我们建立更健壮的组件。 TypeScript 的特点TypeScript 主要有 3 大特点： 始于JavaScript，归于JavaScript TypeScript 可以编译出纯净、 简洁的 JavaScript 代码，并且可以运行在任何浏览器上、Node.js 环境中和任何支持 ECMAScript 3（或更高版本）的JavaScript 引擎中。 强大的工具构建大型应用程序 类型允许 JavaScript 开发者在开发 JavaScript 应用程序时使用高效的开发工具和常用操作比如静态检查和代码重构。 类型是可选的，类型推断让一些类型的注释使你的代码的静态验证有很大的不同。类型让你定义软件组件之间的接口和洞察现有 JavaScript 库的行为。 先进的 JavaScript TypeScript 提供最新的和不断发展的 JavaScript 特性，包括 ...