烟雨数流年的博客

接口是一种能力，一种约束 123456789101112131415(()=>{ interface IPerson{ firstName:string, lastName:string }, function showFullName(person:IPerson) { return person.firstName+'_'+person.lastName } const person = { firstName:'东方', lastName:'不败', } console.log(showFullName(person)) // 东方_不败})() TypeScript 的核心原则之一是对值所具有的结构进行类型检查。我们使用接口（Interfaces）来定义对象的类型。接口是对象的状态(属性)和行为(方法)的抽象(描述) ...

泛型指在定义函数、接口或类的时候，不预先指定具体的类型，而在使用的时候再指定具体类型的一种特性。 引入下面创建一个函数, 实现功能: 根据指定的数量 count 和数据 value , 创建一个包含 count 个 value 的数组 不用泛型的话，这个函数可能是下面这样： 1234567891011function createArray(value: any, count: number): any[] { const arr: any[] = [] for (let index = 0; index < count; index++) { arr.push(value) } return arr}const arr1 = createArray(11, 3)const arr2 = createArray('aa', 3)console.log(arr1[0].toFixed(), arr2[0].split('')) 使用函数泛型12345678910111213funct ...

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

基础类型 TypeScript 支持与 JavaScript 几乎相同的数据类型，此外还提供了实用的枚举类型方便我们使用。 布尔值最基本的数据类型就是简单的true/false值，在JavaScript和TypeScript里叫做boolean（其它语言中也一样）。 1let flag: boolean = true 数字类型和JavaScript一样，TypeScript里的所有数字都是浮点数。 这些浮点数的类型是 number。 除了支持十进制和十六进制字面量，TypeScript还支持ECMAScript 2015中引入的二进制和八进制字面量。 12345678let a1: number = 10 //十进制let a2: number = 0b1010 //二进制let a3: number = 0o12 //八进制let a4: number = 0xa //十六进制console.log(a1);//10console.log(a2);//10console.log(a3);//10console.log(a4);//10 字符串类型JavaScript程 ...

vue3的响应式原理 通过Proxy(代理):拦截对data(数据)任意属性的任意(13种)操作，包括属性的读写，添加，删除等等…… 通过Reflect(反射): 动态对被代理的对象的相应属性进行特定的操作 1234567891011121314151617181920212223242526272829303132333435363738394041const MonsterHunter = { name:'无名氏', title:['新大陆的白凤','指引明路的苍蓝星'], level:'100', armor:{ head:'精英·龙头头盔贝塔', jacket:'精英·龙皮贝塔', hand:'精英·龙岗爪贝塔', trousers:'精英·龙脊阿尔法', shoes:'精英·龙靴贝塔' ...