11 2022 档案
摘要:Vue模板语法有2大类: 1.插值语法: 功能:用于解析标签体内容。 写法:{{xxx}},xxx是js表达式,且可以直接读取到data中的所有属性。 2.指令语法(): 功能:用于解析标签(包括:标签属性、标签体内容、绑定事件.....)。 注意:插值语法能做的,指令语法也能做。指令语法能做的,插
阅读全文
摘要:初识Vue 1.想让Vue工作,就必须创建一个Vue实例,且要传入一个配置对象; 2.root容器里的代码依然符合html规范,只不过混入了一些特殊的Vue语法; 3.root容器里的代码被称为【Vue模板】; 4.Vue实例和容器是一一对应的; 5.真实开发中只有一个Vue实例,并且会配合着组件一
阅读全文
摘要:开发环境搭建 下载vue.js 首先我们下载需要的js文件: 创建页面并引入vue.js <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>初识Vue</title> <!-- 引入Vue --> <script type="
阅读全文
摘要:泛型(Generic) 定义一个函数或类时,有些情况下无法确定其中要使用的具体类型(返回值、参数、属性的类型不能确定),此时泛型便能够发挥作用。 示例: /* * 在定义函数或是类时,如果遇到类型不明确就可以使用泛型 * * */ function fn<T>(a: T): T{ return a;
阅读全文
摘要:封装 对象实质上就是属性和方法的容器,它的主要作用就是存储属性和方法,这就是所谓的封装 默认情况下,对象的属性是可以任意的修改的,为了确保数据的安全性,在TS中可以对属性的权限进行设置 只读属性(readonly): 如果在声明属性时添加一个readonly,则属性便成了只读属性无法修改 TS中属性
阅读全文
摘要:接口(Interface) 接口的作用类似于抽象类,不同点在于接口中的所有方法和属性都是没有实值的,换句话说接口中的所有方法都是抽象方法。接口主要负责定义一个类的结构,接口可以去限制一个对象的接口,对象只有包含接口中定义的所有属性和方法时才能匹配接口。同时,可以让一个类去实现接口,实现接口时类中要保
阅读全文
摘要:抽象类(abstract class) 抽象类是专门用来被其他类所继承的类,它只能被其他类所继承不能用来创建实例 使用abstract开头的方法叫做抽象方法,抽象方法没有方法体只能定义在抽象类中,继承抽象类时抽象方法必须要实现 示例: (function () { /* * 以abstract开头的
阅读全文
摘要:示例 ts文件: (function () { class Animal { name: string; constructor(name: string) { this.name = name; } sayHello() { console.log('动物在叫~'); } } class Dog
阅读全文
摘要:继承 * - 使用继承后,子类将会拥有父类所有的方法和属性 * - 通过继承可以将多个类中共有的代码写在一个父类中, * 这样只需要写一次即可让所有的子类都同时拥有父类中的属性和方法 * 如果希望在子类中添加一些父类中没有的属性或方法直接加就行 * - 如果在子类中添加了和父类相同的方法,则子类方法
阅读全文
摘要:示例: class Dog{ name: string; age: number; // constructor 被称为构造函数 // 构造函数会在对象创建时调用 constructor(name: string, age: number) { // 在实例方法中,this就表示当前当前的实例 //
阅读全文
摘要:TypeScript中的类的定义与使用示例 // 使用class关键字来定义一个类 /* * 对象中主要包含了两个部分: * 属性 * 方法 * */ class Person{ /* * 直接定义的属性是实例属性,需要通过对象的实例去访问: * const per = new Person();
阅读全文
摘要:webpack 通常情况下,实际开发中我们都需要使用构建工具对代码进行打包,TS同样也可以结合构建工具一起使用,下边以webpack为例介绍一下如何结合构建工具使用TS。 步骤: 初始化项目 进入项目根目录,执行命令 npm init -y 主要作用:创建package.json文件 下载构建工具
阅读全文
摘要:编译选项 自动编译文件 编译文件时,使用 -w 指令后,TS编译器会自动监视文件的变化,并在文件发生变化时对文件进行重新编译。但是一次只能编译一个文件。 示例: tsc xxx.ts -w 如下: 自动编译整个项目 如果直接使用tsc指令,则可以自动将当前项目下的所有ts文件编译为js文件。 但是能
阅读全文
摘要:首先我们可以在main方法中加一个弹层来中断程序: MessageBox(nullptr, L"test", L"test", 0); 然后cmd中执行这个exe的时候,会弹出一个弹层,这时候到vs程序中,进行附加程序: 选择需要调试的程序,这样就可以在vs中进行debug调试了。
阅读全文
摘要:对象 示例: //#region js写法 // object表示一个js对象 let a: object; a = {}; a = function () { }; //#endregion //#region TypeScript写法 // {} 用来指定对象中可以包含哪些属性 // 语法:{属
阅读全文
摘要:基本类型 类型声明 类型声明是TS非常重要的一个特点 通过类型声明可以指定TS中变量(参数、形参)的类型 指定类型后,当为变量赋值时,TS编译器会自动检查值是否符合类型声明,符合则赋值,否则报错 简而言之,类型声明给变量设置了类型,使得变量只能存储某种类型的值,防止随意对变量任意类型的值 语法: l
阅读全文
摘要:首先是安装完成了nodel.js,然后以管理员身份在cmd或者powershell中: npm i -g typescript 然后输入tsc: 输出上面这一堆,表示安装完成。
阅读全文
摘要:NPM和模块化结合使用 前提是要先安装node.js 如果在vscode的终端中一直不成功的话,可以在cmd里,以管理员身份来安装jquery: 下面是使用方法: //修改背景颜色为粉色 // ES6引入jquery写法 import $ from 'jquery';// 类似于node.js:co
阅读全文
摘要:模块化 模块化是指将一个大的程序文件,拆分成许多小的文件,然后将小文件组合起来。 模块化的好处 模块化的优势有以下几点: 1) 防止命名冲突 2) 代码复用 3) 高维护性 模块化规范产品 ES6 之前的模块化规范有: 1) CommonJS => NodeJS、Browserify 2) AMD
阅读全文
摘要:对象扩展 ES6 新增了一些 Object 对象的方法 1) Object.is 比较两个值是否严格相等,与『 』行为基本一致(+0 与 NaN) 2) Object.assign 对象的合并,将源对象的所有可枚举属性,复制到目标对象 3) __proto__、setPrototypeOf、 set
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>数值扩展</tit
阅读全文
摘要:class 类 ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板。通过 class 关键字,可以定义类。基本上,ES6 的 class 可以看作只是一个语法糖,它的绝大部分功能,ES5 都可以做到,新的 class 写法只是让对象原型的写法更加清晰、更像面向对象编
阅读全文
摘要:Map ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合。但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。Map 也实现了iterator 接口,所以可以使用『扩展运算符』和『for…of…』进行遍历。 Map 的属性和方法: 1) size 返回 Map 的元素
阅读全文
摘要:Set ES6 提供了新的数据结构 Set(集合)。它类似于数组,但成员的值都是唯一的,集合实现了 iterator 接口,所以可以使用『扩展运算符』和『for…of…』进 行遍历,集合的属性和方法: 1) size 返回集合的元素个数 2) add 增加一个新元素,返回当前集合 3) delete
阅读全文
摘要:Promise Promise 是 ES6 引入的异步编程的新解决方案。语法上 Promise 是一个构造函数, 用来封装异步操作并可以获取其成功或失败的结果。 1) Promise 构造函数: Promise (excutor) {} 2) Promise.prototype.then 方法 3)
阅读全文
摘要:生成器 生成器函数是 ES6 提供的一种异步编程解决方案,语法行为与传统函数完全不同 比如: function * gen(){ yield '一只没有耳朵'; yield '一只没有尾巴'; return '真奇怪'; } let iterator = gen();// 这时候不是真正的执行 co
阅读全文
摘要:迭代器 遍历器(Iterator)就是一种机制。它是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署 Iterator 接口,就可以完成遍历操作。 1) ES6 创造了一种新的遍历命令 for...of 循环,Iterator 接口主要供 for...of 消费 2) 原生具备
阅读全文
摘要:Symbol 基本使用 ES6 引入了一种新的原始数据类型 Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,是一种类似于字符串的数据类型。 Symbol 特点 1) Symbol 的值是唯一的,用来解决命名冲突的问题 2) Symbol 值不能与其他数据进行运算 3
阅读全文
摘要:<script> // 『...』 扩展运算符能将『数组』转换为逗号分隔的『参数序列』 //声明一个数组 ... const tfboys = ['易烊千玺','王源','王俊凯']; // => '易烊千玺','王源','王俊凯' // 声明一个函数 function chunwan(){ con
阅读全文
摘要:(1) // ES6 引入 rest 参数,用于获取函数的实参,用来代替 arguments // ES5 获取实参的方式 function date(){ console.log(arguments); } date('白芷','阿娇','思慧'); 结果是一个object对象: (2)rest
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>函数参数默认值</
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>箭头函数</tit
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>简化对象写法</t
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>模板字符串</ti
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>变量的解构赋值</
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>const 定义常
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>let</titl
阅读全文
摘要:缓存过期策略 如果数据库管理员来删除了数据呢,会存在缓存里面的数据不可用!缓存出现脏数据库;这是无法完全避免的; 什么情况下使用缓存? 二八原则 查询频繁;修改少! 一般有如下三种策略: 永不过期 一直能够使用 绝对过期 过了多长时间以后,就过期了 就不能用了,此时可以直接将数据删除 滑动过期 设定
阅读全文