weixin_43365995的博客

在TypeScript中，变量声明是一项重要的功能，它允许开发人员定义变量并分配值。通过指定变量的类型和作用域，可以确保变量始终具有正确的值，并避免类型错误。同时，遵循命名规则可以使代码更易于阅读和维护。

patch 补丁 执行npm version patch package.json 的版本号将会从1.0.0变成1.0.1。发布前到https://www.npmjs.com/ 查询自己的包名是否可用不然发布的时候会报错。minor 小改动 package.json 的版本号将会从1.0.0变成1.1.0。major 大改动 package.json 的版本号将会从1.0.0变成2.0.0。需要到https://www.npmjs.com/ 网站注册自己的npm 账号。.........

理解this，你要先记住以下两点：this永远指向一个对象this的指向完全取决于函数调用的位置接下来我们用代码的形式一 一举例介绍var obj = { name:'王', fun:output}​var name = '赵';function output(){ console.log(this.name);}​obj.fun(); // 王output(); // 赵上述代码中，fun函数被调用了两次，显而易见的是两次的结果是不一样的；obj.f

接上一篇文章我们接着来说Promisepromise 全网最详解释，包括各方法和手动实现Promises/A+ 规范(1)1.Promises/A+ 规范规范的第一部分，描述了几个术语的意思。promise 是一个包含 then 方法的对象或函数，该方法符合规范指定的行为。thenable 是一个包含 then 方法和对象或者函数。value 就是任意合法 JS 值。exception 就是 throw 语句抛出的值。reason 是一个指示 promise 为什么被 rejected 的

1.Promise 的含义作为 Modern JavaScript 基础设施的一部分，Promises 对前端开发者而言异常重要。它是 async/await语法的基础，是 JavaScript 中处理异步的标准形式。并且，未来的 Web API，只要是异步的，都会以 Promises的形式出现。如果不理解 Promises 相关的知识和运行机制，将来可能无法完成 Web 开发的日常工作。所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法

什么是跨域问题就是前端调用的后端接口不属于同一个域（域名或端口不同），就会产生跨域问题，也就是说你的应用访问了该应用域名或端口之外的域名或端口。这都是同源策略在发挥作用。同源策略同源策略/SOP（Same origin policy）是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同，即便两个不同的域名指向同一个ip地址，也非同源。同源策略限制以下几种行为：

v-for和key在Vue2.x中，我们都知道v-for每次循环都需要给每个子节点一个唯一的key，还不能绑定在template标签上<template v-for="item in list"> <div :key="item.id">...</div> <span :key="item.id">...</span></template> ... ...而在Vue3中，key值应该被放置在template

什么是双向绑定呢？vue又是怎么做的我们接下来就聊一聊什么是双向绑定？当数据模型data变化时，页面视图会得到响应更新vue又是怎么做的？vue其实现原理是对data的getter/setter方法进行拦截（Object.defineProperty或者Proxy），利用发布订阅的设计模式，在getter方法中进行订阅，在setter方法中发布通知，让所有订阅者完成响应。说这些的时候我们在刚使用vue2.x的就会遇到过数据更新了啊，为何页面不更新呢。这其实就是Object.defineP.

最近到了面试季节，做为前端的热门问题我们今天来盘一盘说到深浅拷贝那就要说到JavaScript的数据类型基本数据类型和引用数据类型基本数据类型StringNumberBooleanNullUndefinedSymbol(new in ES 6)引用数据类型ObjectArrayDateRegExpFunction两者特点基本数据类型：直接存储在栈(stack)中的数据引用数据类型：存储的是该对象在栈中引用，真实的数据存放在堆内存里简而言之就是浅拷贝： 创建

在Vue2.x中，v-model相当于绑定value属性和input事件，它本质也是一个语法糖：<child-component v-model="msg"></child-component><!-- 相当于 --><child-component :value="msg" @input="msg=$event"></child-component>在某些情况下，我们需要对多个值进行双向绑定，其他的值就需要显示的使用回调函数来改变了：

在Vue2.x中，我们可以定义data为object或者function，但是我们知道在组件中如果data是object的话会出现数据互相影响，因为object是引用数据类型；在Vue3中，data只接受function类型，通过function返回对象；同时Mixin的合并行为也发生了改变，当mixin和基类中data合并时，会执行浅拷贝合并：const Mixin = { data() { return { user: { name: 'Jack',

Suspense是Vue3推出的一个内置组件，它允许我们的程序在等待异步组件时渲染一些后备的内容，可以让我们创建一个平滑的用户体验；Vue中加载异步组件其实在Vue2.x中已经有了，我们用的vue-router中加载的路由组件其实也是一个异步组件：export default { name: "Home", components: { AsyncButton: () => import("../components/AsyncButton"), },}在Vue3中重新定义，

Teleport翻译过来就是传送、远距离传送的意思；顾名思义，它可以将插槽中的元素或者组件传送到页面的其他位置：在React中可以通过createPortal函数来创建需要传送的节点；本来尤大大想起名叫Portal，但是H5原生的Portal标签也在计划中，虽然有一些安全问题，但是为了避免重名，因此改成Teleport。Teleport一个常见的使用场景，就是在一些嵌套比较深的组件来转移模态框的位置。虽然在逻辑上模态框是属于该组件的，但是在样式和DOM结构上，嵌套层级后较深后不利于进行维护（z-inde

egg 最简单的下载实现如下：async download(){ const { ctx } = this; const filePath = '/path/xml' ctx.attachment('xml'); ctx.set('Content-Type','application/octet-stream'); ctx.boby = fs.createReadStream(filePath)}加入 Content-Length 支持进度条和剩余时间仅需这样实现，即可实现下载

所谓的Fragment，就是片段；在vue2.x中，要求每个模板必须有一个根节点，所以我们代码要这样写：<template> <div> <span></span> <span></span> </div></template>或者在Vue2.x中还可以引入vue-fragments库，用一个虚拟的fragment代替div；在React中，解决方法是通过的一个React.Frag

Composition API（组合API）也是Vue3中最重要的一个功能了，之前的2.x版本采用的是Options API（选项API），即官方定义好了写法：data、computed、methods，需要在哪里写就在哪里写，这样带来的问题就是随着功能增加，代码也越来复杂，我们看代码需要上下反复横跳：Composition API对比❝ 上图中，一种颜色代表一个功能，我们可以看到Options API的功能代码比较分散； Composition API则可以将同一个功能的逻辑，组织在

和computed相对应的就是watch，computed是多对一的关系，而watch则是一对多的关系；vue3也提供了两个函数来侦听数据源的变化：watch和watchEffect。我们先来看下watch，它的用法和组件的watch选项用法完全相同，它需要监听某个数据源，然后执行具体的回调函数，我们首先看下它监听单个数据源的用法：import { reactive, ref, watch } from "vue";const state = reactive({ count: 0,});