tdl081071tdy的博客

有时我们可能会需要在遍历时使用虚拟标签包裹内容，而不使用实际标签 ，这种时候会有一个问题，就是虚拟标签无法加key，这样控制台会一直有警告。我们可以将虚拟标签换成这种形势，就能正常加key了。

【代码】react-redux。

抽象类内部的抽象属性和抽象方法需要被继承的类来实现，但它内部的普通属性和方法则可以直接被继承使用。枚举的作用很简单，就是用来列举数据，管理一系列数据的，让数据分类更加直观和可读，利于维护。一个类继承了一个接口后，也必须将这个接口的所有属性和方法 实现 ，和抽象类性质也是一样的。泛型就是将类型也参数化，有时类型不明确，需要在用到时候才能指定，这时就可以使用泛型。它本身不能实例化，只能被继承，需要继承后的类来实现它内部的抽象属性和抽象方法。泛型用 T 代替，这个只是规范，用其他的字符代替也行，

接口类型是一种自定义类型，可以让我们自定义出一种数据类型的格式，之后在声明这种类型时值的格式都必须按照接口说描述好的来定义。用type关键字可以声明类型别名，这个类型别名和接口其实有点类似，都是可以用来自定义一个类型。这里 [id:number] 代表的是下标的类型 后面代表的是值类型。这种方式声明的字段代表该字段不是必须的字段，可以不写。声明的字段代表该字段是只读，不可在改。代表返回值的类型为空，可以不返回值。用类型别名来声明一个函数的类型格式。声明一个接口是首字母应该大写。代表函数传入的参数的类型，

并且因为ts是静态类型定义，它在你写代码的时候就会报错，而不是等到编译的时候才报错，而js是动态类型定义，你写代码的时候它是不知道这是什么类型的，要等到编译时才会知道类型，因此如果报错那就只会在运行的时候才会报错，这样就很不友好。例如下面的例子，我们直接调用number类型的toFixed方法，就会报错，因为它类型未知，并不确定是否是number类型，因此也就调用不了。ts 的关键之处就在于他的类型定义，在ts中我们给一个变量赋值了之后，他的类型就固定下来了，你可以去改它的值，但不能改变它的类型。

正常情况下我们一般都是同步引入组件，但在同步引入的情况下，会有个问题，必须等所有的组件全部加载完成之后才会一起显示，例如有个嵌套组件外面几层的组件加载的都很快，但最里面的组件内容很多，加载的慢，但如果同步引入的话，外面的就需要一起等里面的加载完成之后才会一起显示，这样就很慢。、他们的用处不是特别大，只在极少数场景能用到，例如某一个公共功能，这个功能里面返回一个数据，这个数据在其他模块都是可以改的，但是在另一个模块不可改，也不能发生变化，只用来显示，此时就可以使用readonly。

其实他们的重点就在于使用场景不同，例如某一个复杂的业务场景，有很多个相关的计算逻辑，这些计算逻辑任意一个发生变化时都需要重新执行某些事时，此时就可以用到watchEffect，例如购物车系统，与购物车相关的商品发生变化整个购物里的价格逻辑都要发生改变。而下面这个就是watch监听器高级的用法了，这也是它比vue2的更方便的原因，watch总共有三个参数，第二个参数永远是监听的回调函数，第三个参数也永远是监听的配置项，配置是否初始化监听一次，或者是否深度监听，下面这是watch第三个需要注意的地方，

因为他观察者只在。

2，另外一种是通过reactive，但不直接创建一个数组，而是创建一个对象，对象里面在创建一个数组，data.arr=[] 这种方式也是可以的，这种方式相当于是在改对象里面的某个属性，因此也能做到直接赋值。3中的数组如果是reactive直接定义的话不能通过赋值的方式改变界面，目前有两种方式解决这个问题。1，是直接用ref（[1，2，3]）定义，通过arr.value的方式，这种可以直接赋值是有效的。

这两种写法官方是推荐下面这种的，单论便捷性的话，也是下面这种写法更好，但是实际上在真实使用过程中可能还是会存在使用到选项式的地方，这种情况下下面这种写法就不能用了，所以这种情况还是使用上面那种方式更好，总之都能用，看个人喜好，喜欢那种方式就用哪种方式。另外需要注意的是选项式和组合式尽量不要混用，他可以混用，但有问题，选项式api中可以拿到组合式api中setup定义的数据，但组合式api的setup中不能拿到选项式中的数据，另外如果有重名的情况下，以setup中的数据优先级更高。，这个和vue2是一样的。

当安装了较多模块后，node_modules目录下的文件会很多，直接删除整个目录会很慢，下面介绍些快速删除node_modules目录的方法。方法一：使用rimraf模块的命令在全局安装rimraf模块，然后通过其命令来快速删除node_modules目录：npm install rimraf -grimraf node_modules方法二：使用命令来删除目录Windows下使用rmdir命令首先在cmd窗口中进入到node_modules文件夹所在的路径，接着执行命令：

https://github.com/wangduanduan/jsplumb-chinese-tutorial#211-%E9%99%90%E5%88%B6%E8%8A%82%E7%82%B9%E6%8B%96%E5%8A%A8%E5%8C%BA%E5%9F%9F

//Echarts数据可视化legend图例属性设置legend={ show:true, //是否显示 zlevel:0, //所属图形的Canvas分层，zlevel 大的 Canvas 会放在 zlevel 小的 Canvas 的上面 z:2, //所属组件的z分.

我们知道，在Vue中我们操作某个属性时vue可以实时响应，这是因为当一个vue实例被创建出来之后，它会生成一个Observer观察者实例，然后对vue中的对象属性进行遍历，通过defineProperty将它们转换为了getter和setter，当我们操作某个数据时，就会触发getter和setter，从而完成一个监听操作。下面我们详细解释一下defineProperty以及它的优劣所在：Object.defineProperty(obj,"",{})defineProperty总共有三个参数

Vue的路由机制主要是通过两种模式实现的第一种模式是hash模式 第二种是H5的history模式这是默认的hash模式的路由：改成history模式后const router = new VueRouter({ mode:"history", routes})export default routerHash模式hash模式是以url的hash值来作为路由，这也是vue的默认模式；hash模式的原理是动态的更改location.hash的值

一 虚拟dom在react，vue等技术出现之前，我们要改变页面展示的内容只能通过遍历查询 dom 树的方式找到需要修改的 dom 然后修改样式行为或者结构，来达到更新 ui 的目的。 这种方式相当消耗计算资源，因为每次查询 dom 几乎都需要遍历整颗 dom 树， 并且这个过程又会不可避免的出现大量DOM操作，而DOM的变化又会引发整个文档重排或重绘，从而降低页面渲染性能 此时就产生一个问题，有没有可能我们只更新我们修改的那一部分dom而不要更新去整个dom结构 此时虚拟DOM应用而生 ，如果

要明白事件循环我们首先要了解渲染引擎渲染引擎是个多线程程序 它其中包含了四个线程js引擎线程 事件触发线程 定时任务线程 异步任务线程首先呢 js中包含了同步任务和异步任务两种，首先js引擎线程会创建一个执行栈，所有的同步任务都会被放到这个执行栈中来执行 同时事件触发线程管理着一个任务队列，当一个异步任务被触发后它内部的回调函数就会被放到这个任务队列中，注意此时它并不会执行这个回调函数，只是将它放入任务队列。 然后等js引擎线程中的执行栈中的同步任务执行完成之后，它就会去读取

在Vue开发中 我们有时需要给场景切换加上一个过场动画 但是有一个难题 过场动画如何判断到底是进还退出的我在网上也找过很多方法，比如最常见的就是给路由的meta中加一个标识 通过标识判断大小 从而知道是退是进但是如果路由很多，怎么办，那要判断标识都是一个难题，苦思冥想许久，突然想到一个究极解决办法，我们可以通过时间来判断啊，我们在路由守卫中，每当进入一个路由之前，给他加个时间戳router.beforeEach(async (to, from, next) => { i

在js中很多时候我们都需要使用正则 比如这里我利用正则查找字符 a 后面跟着一个或多个空格的内容，我们便可以这么做let str = "abcdefa aab bb"let reg = /a\s.*/console.log(reg.exec(str))但如果我们把条件改了，我们要查找字符b后面跟着一个或多个空格的内容，那我们不可能去再重新写一个正则这是我们便可以动态的去拼接正则，再js中不能直接使用常规的字符串拼接方式来拼接，它必须使用eval来进行拼接let str =.