随笔分类 - JS / ES / TS
JavaScript / ECMAScript / TypeScript
摘要：computed 类型声明需要用泛型 ###错误写法 const a: Xx[] = computed(()=>{}) ###正确写法 const a = computed<Xx[]>(()=>{}) 直接使用时需要加上 .value 例如 a.value HTML 中可直接使用 :xx="a"
阅读全文
摘要：当开发某个组件右键菜单时，需要禁止鼠标右键默认弹出的菜单 document.addEventListener("contextmenu", (event: MouseEvent) => { event.preventDefault(); });
阅读全文
摘要：###一、API 简介 Page Visibility API 用来检测页面当前是否可见，以及打开网页的时间等 以前监听用户正在离开页面常用的方法是下面三个事件： 1、pagehide 2、beforeunload 3、unload 但这些事件在手机上不触发，因为手机系统可以将进程直接转入后台，然后
阅读全文
摘要：###为什么 Vue 中的 data 必须是个函数？ 官方文档的解释如下： ###为什么会出现上述“影响到其它所有实例”的情况呢？ 其实这个问题取决于 JS 原型链知识，而非 Vue 我们先来看不是函数的情况： function Component() { } Component.prototype
阅读全文
摘要：###一、什么是 Flow Flow 是 facebook 出品的 JavaScript 静态类型检查工具 Vue.js 的源码利用了 Flow 做了静态类型检查，所以了解 Flow 有助于我们阅读源码 ###二、为什么用 Flow JavaScript 是动态类型语言，它的灵活性有目共睹，但是过于
阅读全文
摘要：举个例子：对以下数组按 lastName 的值进行去重 let listData = [ { firstName: "Rick", lastName: "Sanchez", size: 18 }, { firstName: "Morty", lastName: "Smith", size: 6 },
阅读全文
摘要：举个例子：对以下数组按 lastName 的值进行分组分类 const listData = [ { firstName: "Rick", lastName: "Sanchez", size: 18 }, { firstName: "Morty", lastName: "Smith", size:
阅读全文
摘要：###一、JS 实现方式 实现代码： <input type="text" /> <button>一键复制</button> const inputText = document.getElementsByTagName("input")[0]; const copyButton = documen
阅读全文
摘要：命名空间一个最明确的目的就是解决重名问题，其定义了标识符的可见范围，一个标识符可在多个名字空间中定义，它在不同名字空间中的含义是互不相干的。 这样，在一个新的名字空间中可定义任何标识符，它们不会与任何已有的标识符发生冲突，因为已有的定义都处于其他名字空间中。 一、TypeScript 命名空间 Ty
阅读全文
摘要：泛型（Generics）是指在定义函数、接口或类的时候，不预先指定具体的类型，而在使用的时候再指定类型的一种特性 举个例子，以下的 join 函数参数可以是 string 或 number 如果想要实现：前一个参数是什么类型，后一个参数就跟着是什么类型 这时就需要用到泛型 一、函数泛型 上述情况可用
阅读全文
摘要：TypeScript 中使用联合类型经常会有下面的错误出现： 这时就需要用到类型保护，类型保护允许你使用更小范围下的对象类型，常见的类型保护如下： 一、类型断言的类型保护 二、in 语法的类型保护 三、typeof 类型保护 先来看另一种常见的错误： 通过 typeof 类型保护： 四、instan
阅读全文
摘要：一、类型注解（Type annotation） 所谓类型注解，就是人为为一个变量指定类型，例如： const a: number = 123; 在 vscode 中鼠标移入 a 出现提示，冒号后面就是类型注解： 当不添加类型注解时，TypesScript 也能知道变量 a 是一个数字，这就是 Typ
阅读全文
摘要：一、什么是接口 在 TypeScript 中，我们使用接口（Interfaces）来定义对象的类型 接口是一系列抽象方法的声明，是一些方法特征的集合，第三方可以通过这组抽象方法调用，让具体的类执行具体的方法 TypeScript 中接口除了可用于对类的一部分行为进行抽象以外，还可用于对「对象的形状（
阅读全文
摘要：一、TypeScript 的安装及使用 1、安装 npm i typescript -g // ts 全局包 npm i ts-node -g // 使用 ts-node 直接运行 ts 文件 2、使用 将 TypeScript 转换为 JavaScript 代码： tsc test.ts 使用 n
阅读全文
摘要：指针锁定 Pointer Lock API 通过它可以访问原始的鼠标运动（基于指针的相对位移 movementX / movementY），把鼠标事件的目标锁定到一个特定的元素，同时隐藏视图中的指针光标（可通过 ESC 显示），并且可以消除鼠标在一个方向上移动的边界限制。 这个 API 对于需要大量
阅读全文
摘要：Async 和 Awaiit 是 Promise 的扩展，我们知道 JavaScript 是单线程的，使用 Promise 之后可以使异步操作的书写更简洁，而 Async 使 Promise 像同步操作 一、Async Async 自动将常规函数转换成 Promise，返回值一个 Promise 对
阅读全文
摘要：一、什么是 Babel Babel 是一个工具链，主要用于将 ECMAScript 2015+ 版本的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其它环境中。 // Babel 输入：ES2015 箭头函数 [1,2,3].map((n)=>n+1) //
阅读全文
摘要：一、什么是 reduce() ？ reduce() 方法对数组中的每个元素执行一个升序执行的 reducer 函数，并将结果汇总为单个返回值 const array1 = [1, 2, 3, 4]; const reducer = (accumulator, currentValue) => acc
阅读全文
摘要：ES5 数组遍历方法 1、for 循环 const arr = [1, 2, 3, 4, 5] for (let i = 0; i < arr.length; i++) { console.log(arr[i]) } 2、forEach const arr = [1, 2, 3, 4, 5] arr
阅读全文
摘要：题目要求： 解法一： 直接用 sort 从大到小排序，取第 k 个 var findKthLargest = function (nums, k) { nums.sort((a, b) => { return b - a }); return nums[k - 1]; }; 解法二（优化性能）： 使
阅读全文
浙公网安备 33010602011771号