20231216 前端开发日报

Python 作者分享了对 Rust、Go、Julia 和 TypeScript 的看法；localStorage 竟然支持存储 JavaScript 几乎所有数据类型；Linus：批评 GitHub 代码合并【毫无用处的】；前端兼容性问题 – 屏幕尺寸兼容；gRPC-Gateway：高效转换 RESTful 接口 | 开源日报 No.105；前端已死？别低估前端，他是互联网世界的核心【这是一篇治愈系文章】；探索前端项目中icon使用的最佳实践；开发案例：使用canvas实现图表系列之折线图

1. Python 作者分享了对 Rust、Go、Julia 和 TypeScript 的看法

   Python 发明者 Guido van Rossum 分享了他对其他一些编程语言的看法，比如Rust、Go、Julia 和 TypeScript。

2. localStorage 竟然支持存储 JavaScript 几乎所有数据类型

   更好用的 localStorage 封装，支持几乎所有 Javascript 数据类型的存取，当然 sessionStorage 也是支持的。

3. Linus：批评 GitHub 代码合并【毫无用处的】

   Linux 和 Git 的创建者 Linus Torvalds 批评 GitHub 创造了“毫无用处的代码合并”

4. 前端兼容性问题 – 屏幕尺寸兼容

   写在前面 前端开发最让人头疼的莫过于兼容性问题，继上一篇 前端兼容性问题 – CSS、JS 兼容 之后，这一篇主要研究并解决屏幕尺寸的兼容性问题 目录： 当前现状 解决方案 模拟设备测试方案 当前现状

5. gRPC-Gateway：高效转换 RESTful 接口 | 开源日报 No.105

   gRPC-Gateway 是一个强大的工具，它可以将 gRPC 转换为 JSON，同时遵循 gRPC HTTP 规范。它可以帮助您以 gRPC 和 RESTful 风格同时提供 API，具有简单的配置

6. 前端已死？别低估前端，他是互联网世界的核心【这是一篇治愈系文章】

   我的朋友是前端，也在济南工作，一月9.5K，薪资水平不算高，但是22年培训的，工作经历就一年，这个薪资还是可以的了！ 他上家公司工作了三个月，老板被抓起来了，然后9月开始找工作，刚好10月入职新公司.

7. 探索前端项目中icon使用的最佳实践

8. 开发案例：使用canvas实现图表系列之折线图

9. vue 数据更新了，但在页面上没有展示出来

   文章浏览阅读186次，点赞4次，收藏5次。这是因为有时候 vue 无法监听到数据的变化，导致数据变化但是视图没有变化，也就是数据更新了，但在页面上没有显示出来。

10. vue与react 数据流设计理念

    文章浏览阅读355次，点赞17次，收藏3次。这意味着数据只能由父组件流向子组件，而子组件不能直接修改父组件的数据。如果想要修改数据，需要通过回调函数的方式将修改后的数据传递给父组件。这种数据流模型使得数据变更的追踪更加明确，提高了应用的可维护性。总的来说，双向数据流适合简单的表单和用户输入场景，而单向数据流适用于复杂的应用场景，对于大型应用的维护和扩展更加友好。这意味着数据可以从父组件流向子组件，并且子组件对数据的修改也可以反向影响父组件。在前端框架中，数据流是描述数据在组件间传递的方式。它决定了数据的更新方式以及组件之间的依赖关系。

11. vue中实现PDF文件流预览

    文章浏览阅读347次，点赞6次，收藏5次。在展示预览之前，先将数据转换成json格式，如果转换过程中出现异常，则显示错误消息并清空文件预览区域；如果转换成功，则进行具体的展示逻辑。是在关闭文件预览时，清空预览区域的内容，以便下次预览文件时重新加载新的内容。showPdfPreview()方法，用于展示PDF文件的预览，并对异常情况进行处理。Blob 类型的数据转化为 JSON 对象。clearBox() 方法的作用。读取 Blob 类型的数据。这段代码我定义了一个。

12. 原生Html 引入element UI + vue3 表单校验设置

    文章浏览阅读154次。效果：提交时，检验结果展示。

13. VUE + 分布式引导页Intro.js

    文章浏览阅读257次，点赞8次，收藏4次。Intro.js是一个轻量级的JavaScript库，用于在网站或应用程序中创建交互式的引导页。可以向用户展示和解释界面的不同部分。

14. vue 3 select组件

    文章浏览阅读132次，点赞3次，收藏5次。【代码】vue 3 select组件。

15. React中的setState执行机制

    文章浏览阅读363次，点赞10次，收藏10次。react的setState

16. 重学vue(2, 3)及其生态+TypeScript 之 vue部分实现和源码分析(未完待续)

    文章浏览阅读355次，点赞6次，收藏9次。使用 defineProperty 时，我们修改原来的 obj 对象就可以触发拦截，而使用 proxy 就必须修改代理对象，即 Proxy 的实例才可以触发拦截。如果是数组类型，我们就递归调用mount函数即可，将子vNode添加到父节点上。我们传统的前端开发中，我们是编写自己的HTML，最终被渲染到浏览器上的，那么它是什么样的过程呢？功能三：patch函数，用于对两个VNode进行对比，决定如何处理新的VNode。直接通过编写的html元素，渲染成真实的dom树，然后就渲染到浏览器了。

17. computed 和 watch 的奇妙世界：让数据驱动你的 Vue 应用(下)

    文章浏览阅读372次，点赞9次，收藏8次。computed和watchcomputed作用：用于计算和缓存依赖于其它属性的值。应用场景：适用于简单的计算，不涉及复杂的逻辑或异步操作。watch作用：监听属性的变化，并在变化时执行相应的回调函数。应用场景：适用于需要在属性变化时执行复杂的逻辑或异步操作。总的来说，如果需要根据其它属性的值来计算某个属性的值，并且这个计算不涉及复杂的逻辑或异步操作，那么应该优先使用computed。如果需要在属性变化时执行复杂的逻辑或异步操作，那么应该使用watch。

18. vue中iframe标签跨域通信——父子页面之间传值（解决子页面收不到父页面的值或子页面收到的数据为undefined的问题）

    文章浏览阅读133次。解决子页面收不到父页面的值或子页面收到的数据为undefined的问题；背景： 初始化时，父页面发送数据给子页面，需要在子页面加载完成后发送，不然接收不到数据。父页面直接给子页面postMessage发送消息，但是子页面收不到数据；在iFrame.onload函数中发送消息，依旧未收到消息。解决思路：子页面向主网页发送消息，告诉它子网页加载好了，然后主网页再发送消息给子网页进行处理，这样虽然会多一些交互代码，但可以精确地执行交互。