qq_42501092的博客

最近学习了一下graphql，想结合之前的技术栈，React和nestjs来做了全栈的小demo，总觉得学习东西不做笔记或者记录，很容易就忘记，虽然做了笔记也很容易忘记，但至少到时候回头看的时候，方便复习吗？至于为啥是选择React，因为公司的技术栈是React，我个人也很喜欢jsx这种风格，hooks出来之后，写起来更爽了，纯纯的个人感情。而选nestjs的原因是相比其他的框架 （express和koa）来说，我觉得他的架构更完整一些，自带支持typescript和es6语法，如果要用express或者。

通过我们的封装以后，我们使用这个组件的方式就变得简单很多啦，就如果出现一个页面有连续的多个表格的情况，我们也可以通过 配置一个对象来实现循环遍历，我自己的感觉就是代码量减少了特别多，以前一个组件一个文件的，一个页面有 5、6 个表格的时候，要创建 5、6 个文件，然后每个都写一遍，这不就是“搬砖”吗？复制来复制去，然后改改参数，如果你发现你的工作就像 “搬砖” 的话，你就要打开自己的思路，一定要想办法结束这种 “搬砖”的状态。工程师就是解决问题的，不要让自己成为问题。

这是一种编程的思维方式，如果经历过一些比较复杂的项目，你可能就能体会到这种方式的好处，我们可以通过一些目录结构，归档分类的方式，让你很容易就找到需要修改的类，只关注修改对象本身。这还只是最简单的一层而已，假设项目大了，依赖多了，你也不清楚会有多少层嵌套，可能梳理这个嵌套逻辑都需要很长时间，这样的代码会比较难维护，不熟悉代码的人，很容易就漏改一些地方。所以，怎么管理我们组件的依赖，让依赖耦合性降低，也是我们作为开发者需要关心的问题，也不在于前端还是后端了对吧。两个类的耦合性就太高了，如果我的。

选项之后，就莫名的出现这个问题。最后找到了终极解决方法，在。于是就搜索引擎转起来嘛，看到的答案基本就是。果然，又出现了另一个问题。创建完项目之后，就想添加个。真的是血压高呀，我之前很少用。身上，但是我也是选择了。的呀，怎么就不行了呢。

NodeJS还在强化中，感觉以前学的都很乱，直接上来就是Koa、Express这些框架，对NodeJs本身的了解还是很少的，只是一味的觉得不就是Javascript嘛，老子写了好几年了，是有点像，但是也不要被前端的思维框住了，不要带着前端的思维学习后端的知识。

我们就规范了代码风格和git commit风格，像我们传统的react或者vue项目，不管是用脚手架创建的项目还是自己从 0 搭建的都是可以用这个流程去配置的。其实还有一个是项目的打包工具的选择和配置。对于怎么选择打包工具，这里有一个权威的网站，里面有介绍主流打包工具的优劣，可以帮助我们做选择。

其实这个问题我也是问别人的，他们都说我搞那么麻烦干嘛，直接默认值不就搞定了吗？但是我总觉得多总结总结方法，可以在以后开发的时候，思路多一些，不会只握着手中仅有的知识，止步不前。多探索探索嘛，不然总觉得自己在搬砖，多回头看看以前写的代码，有机会的话，可以总结或者优化一些，这样就不会觉得自己整天都在干相同的事情啦。

react ref 数组

我之前也有尝试用过 `rollup`，但是我没太注意版本号，就是记得之前在 `rollup.config.js` 的文件中是可以写 `es6` 的语法的，但是最近【2022年11月左右】我使用 `rollup` 的时候遇到一个问题，不能使用 `import` 语法了就是这个 `SyntaxError: Cannot use import statement outside a module`， 一个很常见的问题，一开始我以为是我写错，后来发现配置文件也没啥问题呀

我也在网上找了很多资料，qiankunjs的文档总觉得有点简陋就这样！！！好像说了怎么做，又好像没说，有一些细节还是得自己实践过才知道。如果有想入手的小伙伴，可以自己动手尝试一下，如果你不是很熟悉的话，不要用vite，很打击信心，很会干扰你学习的进度。

中一个数除以 0 不会报错，他肯定会”瞳孔地震“，不止不会报错，还有一个奇怪的现象，我觉得这个在开发中可能会遇到，我们总是拿后端提供的数据进行操作嘛，然而。做数据的运算真的是处处充满惊喜，我之前做财务系统的时候，都是数据操作，后端总觉得提供了数据，我前端自己操作一下就行了，然后我就踩了各种坑，兄弟们如果要用。类型判断的问题，就突然发现好像自己也没有自己去总结过这些知识点，都是零零散散的，看到一个记一个，忘记了就搜索引擎搜索一下。非他莫属，绝对最“奇葩”的一个类型，唯一一个“我不等于我自己”的类型。

的时候，希望能触发统一的钩子去处理。最简单的场景就是在创建用户、登录和修改密码等操作的时候，希望能通过钩子统一给密码进行加盐处理。我前阵子开发的时候，就遇到这么一个问题，我明明更新了数据，数据库的数据也改变了，但就是不会触发。虽然这个问题很简单，但是开始的时候还是让我懵了一小阵子的，遇到了问题还是要多多总结，多分析，不能解决了问题也不知道为啥解决的就让他过去了，这样会浪费很多成长的机会的。的时候，有这么一种场景，我们在更新一个。的时候，它的原型上面才挂有这个方法。里头的方法，密码还是明文的。

只要把webpack的配置信息配置好了，其他的就交给webpack的complier打包就行了，更多的可能就是要做交互的信息提示，以及异常处理而已

可能这样实现的方式有很多，也有虚拟列表什么之类的方式，经过我的一番研究，我发现一个还不错的方法，不需要借助第三方库就能实现。，其实很新闻的列表有点像，只不过我们这个没有分页处理。处理方案：未出现在屏幕内的模块元素，先不加载，等轮动进屏幕以后再，进行加载。......

从执行步骤上来看，基本就是这 5 步了init: 命令行参数解析createApp：做一些路径上的处理 和文件的写入，把参数给到run：给install和做参数处理install：安装相关依赖：执行node代码。

useState返回的list是基于basestate计算出来的，并且由于闭包的存在，每个「数字按钮」add函数中的list都不同有个问题得说明一下，这并不是React框架的问题，这是JavaScript闭包的特点，而useState是基于basestate更新的，所以就会显示出一种和我们预期不太一样的结果。httpshttpshttpshttps。...

后来我思考了一阵子，我感觉是自己对TypeScript的理解还只是JavaScript的另一种写法，随便加个类型就行，不行就any，没有从JavaScript的思维中走出来。从枚举这个问题上来看，如果用对象的话，这就是一个潜在的问题，而且你可能永远都不会发现，但是用TypeScipt的话，你可以避免这种问题的发生，他避免得你甚至都毫无察觉。对日常中的代码还是要多一些思考，细心一点，我相信没有学不到东西的岗位，只有不够细心的“打工人”......

JQuery 的实现文件路径：思路： 通过不同的选择器类型，创建有不同属性的实例对象代码实现：工厂模式与策略模式的区别不知道大家在刚开始学习的时候，有没有这种感觉，如果是通过不同的参数创建有不同属性的对象，那和 是不是有点像。比如经典的计算年终奖代码：区别用途不一样关注点不一样解决不同的问题经过一段时间的学习以后，公司主要用的技术栈是 + ，我也遇到了觉得可以用上的场景，学以致用才能记住嘛，跟大家分享一下。通过不同的类型，创建具有不同属性的 组件。从不太严格的角度上来看，

vite 大致流程以及小部分源码学习记录

webpack 调试方式webpack Compiler 和 Compilation 的区别webpack 自定义插件