当前位置: 首页 > news >正文

Vue百日学习计划Day28-32天详细计划-Gemini版

总目标: 在 Day 28-32 深入理解 Vue 3 的响应式机制,熟练掌握 Composition API 中的 setup, ref, reactive, toRefs, readonly, computed, watch, watchEffect 等核心 API 的使用。

  • 所需资源:
    • Vue 3 官方文档 (组合式 API): https://cn.vuejs.org/guide/introduction.html#composition-api
    • Vue 3 官方文档 (响应式基础): https://cn.vuejs.org/guide/essentials/reactivity-fundamentals.html
    • Vue 3 官方文档 (计算属性): https://cn.vuejs.org/guide/essentials/computed.html
    • Vue 3 官方文档 (侦听器): https://cn.vuejs.org/guide/essentials/watchers.html
    • Day 21-23 创建并运行成功的 Vue 3 项目(作为实践环境)。

Day 28: 初识 Composition API 与 ref (~3 小时)

  • 本日目标: 了解 Composition API 的作用,学习 setup 函数以及如何使用 ref 创建响应式基本类型数据。

  • 学习计划:

    • 番茄时钟 1 (25 分钟工作 + 5 分钟休息):

      • 内容: 组合式 API 介绍与 setup 函数。
      • 活动: 阅读官方文档“组合式 API 介绍”部分,理解它出现的原因(解决 Options API 的痛点,更好地组织代码)。阅读关于 setup 函数的部分,理解它是组件中 Composition API 的入口,它何时执行,以及它应该返回什么。
      • 实践: 在你的 Vue 项目中创建一个新的 .vue 组件,尝试添加一个空的 setup() 函数或 <script setup> 块。
      • 休息: 短暂休息。
    • 番茄时钟 2 (25 分钟工作 + 5 分钟休息):

      • 内容: ref 的基本使用。
      • 活动: 阅读官方文档“响应式基础”部分关于 ref 的内容。理解 ref 用于创建包含基本类型值(如字符串、数字、布尔值)的响应式引用。
      • 实践:<script setup> 中导入 ref,创建一个计数器变量 count = ref(0)
      • 休息: 短暂休息。
    • 番茄时钟 3 (25 分钟工作 + 5 分钟休息):

      • 内容: 访问和修改 ref 的值 (.value)。
      • 活动: 理解在 <script setup> 或 JavaScript 代码中访问或修改 ref 的值需要通过其 .value 属性。
      • 实践: 添加一个方法 increment = () => { count.value++; }
      • 休息: 短暂休息。
    • 番茄时钟 4 (25 分钟工作 + 5 分钟休息):

      • 内容: ref 在模板中的使用 (自动解包)。
      • 活动: 理解 ref 在模板中访问时是不需要 .value 的,Vue 会自动帮助我们解包。
      • 实践:<template> 中使用 {{ count }} 显示计数器。添加一个按钮,使用 @click="increment" 调用方法。观察点击按钮时页面上的数字是否响应式更新。
      • 休息: 短暂休息。
    • 总结与回顾 (10-15 分钟):

      • 回顾 setup 函数的作用和书写方式(<script setup>)。
      • 巩固 ref 的创建、.value 访问/修改以及模板中的自动解包。
      • 确保你的计数器示例能够正常运行并响应式更新。

Day 29: reactivetoRefs (~3 小时)

  • 本日目标: 学习如何使用 reactive 创建响应式对象和数组,理解 refreactive 的区别,并学习 toRefs 的用途。

  • 所需资源: Vue 3 官方文档 (响应式基础): https://cn.vuejs.org/guide/essentials/reactivity-fundamentals.html

  • 学习计划:

    • 番茄时钟 1 (25 分钟工作 + 5 分钟休息):

      • 内容: reactive 的基本使用。
      • 活动: 阅读官方文档关于 reactive 的内容。理解 reactive 用于创建响应式的对象(包括普通对象、数组和 Map, Set 等集合类型)
      • 实践:<script setup> 中导入 reactive,创建一个用户对象 user = reactive({ name: 'Alice', age: 30 })。创建一个待办事项数组 todos = reactive([{ id: 1, text: 'Learn Vue' }, { id: 2, text: 'Build a project' }])
      • 休息: 短暂休息。
    • 番茄时钟 2 (25 分钟工作 + 5 分钟休息):

      • 内容: 访问和修改 reactive 对象/数组。
      • 活动: 理解直接访问和修改 reactive 返回的代理对象的属性或数组元素就是响应式的,不需要 .value
      • 实践: 在模板中显示 {{ user.name }}{{ user.age }}。使用 v-for 渲染 todos 列表。添加一个方法 updateUser = () => { user.age++; },用按钮触发并观察变化。添加一个方法 addTodo = () => { todos.push({ id: todos.length + 1, text: 'New Task' }); },用按钮触发并观察列表更新。
      • 休息: 短暂休息。
    • 番茄时钟 3 (25 分钟工作 + 5 分钟休息):

      • 内容: ref vs reactive
      • 活动: 阅读官方文档中关于 refreactive 区别的总结。理解 ref 用于基本类型和单个复杂对象/数组(推荐),reactive 主要用于包装根级对象/数组。理解它们的底层实现(ref 包裹在 { value: ... } 对象并通过 reactive 使这个对象响应式)。
      • 思考: 什么时候优先使用 ref?什么时候优先使用 reactive?(通常推荐优先使用 ref,因为它能处理所有类型,且在模板中更简洁)。
      • 休息: 短暂休息。
    • 番茄时钟 4 (25 分钟工作 + 5 分钟休息):

      • 内容: toRefs 的使用场景。
      • 活动: 阅读官方文档关于 toRefs 的内容。理解 toRefs 的主要作用是在解构 reactive 对象时,保持属性的响应性。如果没有 toRefs,直接解构会丢失响应性。
      • 实践: 创建一个 reactive 对象 state = reactive({ foo: 1, bar: 2 })。对比直接解构 { foo, bar } = state 和使用 let { foo, bar } = toRefs(state) 在模板中显示时的响应性差异。
      • 休息: 短暂休息。
    • 总结与回顾 (10-15 分钟):

      • 回顾 reactive 的用法以及与 ref 的核心区别。
      • 巩固 toRefs 在解构 reactive 对象时的重要性。
      • 确保所有实践示例都能按预期工作。

Day 30: 响应式原理基础与 readonly (~3 小时)

  • 本日目标: 初步了解 Vue 3 响应式基于 Proxy 的原理,并学习 readonly 的作用。

  • 所需资源: Vue 3 官方文档 (响应式基础): https://cn.vuejs.org/guide/essentials/reactivity-fundamentals.html (重点关注“它们是如何工作的?”)

  • 学习计划:

    • 番茄时钟 1 (25 分钟工作 + 5 分钟休息):

      • 内容: 响应式原理高层概述 (基于 Proxy)。
      • 活动: 阅读官方文档关于“响应式基础”中“它们是如何工作的?”部分。理解 Vue 3 如何利用 JavaScript 的 Proxy 对象来拦截对象的属性访问 (get) 和修改 (set)。理解依赖追踪 (track) 和触发更新 (trigger) 的概念。不需要深入底层实现细节,理解核心机制即可。
      • 思考: Proxy 相较于 Vue 2 的 Object.defineProperty 有何优势?
      • 休息: 短暂休息。
    • 番茄时钟 2 (25 分钟工作 + 5 分钟休息):

      • 内容: refreactive 如何利用 Proxy。
      • 活动: 回顾 refreactive 的实现方式,理解 reactive 直接对对象/数组创建 Proxy,而 ref 是创建 { value: ... } 对象,然后对这个对象创建 Proxy。理解为什么访问 ref.value 会触发依赖。
      • 思考: 为什么直接替换一个 reactive 对象会丢失响应性?(因为它没有通过 Proxy 代理)。为什么可以直接替换 ref.value?(因为 .value 属性是被 Proxy 代理的)。
      • 休息: 短暂休息。
    • 番茄时钟 3 (25 分钟工作 + 5 分钟休息):

      • 内容: readonly 的基本使用。
      • 活动: 阅读官方文档关于 readonly 的内容。理解 readonly 可以创建一个对象的只读代理。尝试修改只读代理的属性会失败并在开发模式下发出警告。
      • 实践:<script setup> 中导入 readonly。创建一个 reactive 或普通对象 original = reactive({ count: 0 })。创建只读版本 readOnlyCopy = readonly(original)。在模板中显示 readOnlyCopy.count
      • 休息: 短暂休息。
    • 番茄时钟 4 (25 分钟工作 + 5 分钟休息):

      • 内容: 尝试修改 readonly 对象。
      • 活动: 尝试通过 readOnlyCopy.count++ 的方式去修改只读代理的属性。观察浏览器控制台的警告信息。理解 readonly 是浅层的(默认),即如果对象属性是另一个对象,内部对象仍然是可变的(除非嵌套使用 readonly 或使用 shallowReadonly)。
      • 实践: 添加一个方法尝试修改 readOnlyCopy,通过按钮触发。观察警告。了解 shallowReadonly (可选,如果文档提到了)。
      • 休息: 短短休息。
    • 总结与回顾 (10-15 分钟):

      • 回顾 Vue 3 响应式机制的高层原理(Proxy, track, trigger)。
      • 巩固 readonly 的用法和它提供的只读特性。
      • 理解为什么有时需要 readonly (例如,向外部暴露状态但不希望被修改)。

Day 31: 计算属性 (computed) (~3 小时)

  • 本日目标: 学习如何使用 computed 创建依赖于其他响应式状态的派生状态。

  • 所需资源: Vue 3 官方文档 (计算属性): https://cn.vuejs.org/guide/essentials/computed.html

  • 学习计划:

    • 番茄时钟 1 (25 分钟工作 + 5 分钟休息):

      • 内容: computed 的基本使用 (Getter)。
      • 活动: 阅读官方文档“计算属性”部分。理解 computed 创建一个响应式的“计算属性”,其值会根据依赖的响应式状态自动更新。学习最常见的用法:传入一个 getter 函数。
      • 实践:<script setup> 中导入 computed。定义一个响应式变量 message = ref('Hello')。创建一个计算属性 reversedMessage = computed(() => message.value.split('').reverse().join(''))
      • 休息: 短暂休息。
    • 番茄时钟 2 (25 分钟工作 + 5 分钟休息):

      • 内容: computed 在模板中的使用与依赖追踪。
      • 活动: 理解计算属性在模板中直接使用即可,就像普通属性一样(也不需要 .value)。理解 Vue 会自动追踪计算属性 getter 函数中访问的响应式依赖。
      • 实践: 在模板中显示 {{ reversedMessage }}。添加一个按钮或输入框修改 message.value,观察 reversedMessage 是否自动更新。
      • 休息: 短暂休息。
    • 番茄时钟 3 (25 分钟工作 + 5 分钟休息):

      • 内容: computed 与 Setter (Setter)。
      • 活动: 阅读官方文档关于计算属性 Setter 的内容。理解计算属性默认只有 getter,是只读的。如果需要通过修改计算属性来影响其依赖的原始数据,需要提供一个 Setter 函数。
      • 实践: 创建一个计算属性 fullName,依赖 firstNamelastName。为 fullName 添加一个 Setter,当设置 fullName 时,更新 firstNamelastName。使用 v-model 绑定到 fullName 在输入框中进行实践。
      • 休息: 短暂休息。
    • 番茄时钟 4 (25 分钟工作 + 5 分钟休息):

      • 内容: computed vs 方法 (Methods)。
      • 活动: 阅读官方文档关于计算属性和方法对比的内容。理解计算属性是基于缓存的,只有当依赖的响应式状态改变时才会重新计算。方法每次调用都会执行。
      • 思考: 什么时候应该用 computed?什么时候应该用方法?(computed 适用于需要缓存的、依赖其他响应式状态的派生数据;方法适用于事件处理或不依赖响应式状态的普通逻辑)。
      • 休息: 短短休息。
    • 总结与实践 (10-15 分钟):

      • 回顾 computed 的基本用法 (getter, setter)。
      • 巩固 computed 的缓存特性及其与方法的区别。
      • 尝试在你的实践项目中添加一个需要计算属性的场景,例如显示购物车总价、过滤列表等。

Day 32: 侦听器 (watch, watchEffect) (~3 小时)

  • 本日目标: 学习如何使用 watchwatchEffect 来执行副作用,以响应响应式状态的变化。

  • 所需资源: Vue 3 官方文档 (侦听器): https://cn.vuejs.org/guide/essentials/watchers.html

  • 学习计划:

    • 番茄时钟 1 (25 分钟工作 + 5 分钟休息):

      • 内容: watch 的基本使用 - 侦听单个源。
      • 活动: 阅读官方文档“侦听器”部分关于 watch 的内容。学习 watch 用于侦听特定的响应式数据源(一个 ref、一个 reactive 对象、一个 getter 函数)。
      • 实践:<script setup> 中导入 watch。侦听之前创建的 count ref,当它变化时打印新的值和旧的值:watch(count, (newValue, oldValue) => { console.log('Count changed from', oldValue, 'to', newValue); });
      • 休息: 短暂休息。
    • 番茄时钟 2 (25 分钟工作 + 5 分钟休息):

      • 内容: watch 侦听多个源与选项。
      • 活动: 学习 watch 如何侦听一个数组的多个源。学习 watch 的选项,特别是 immediate: true (立即执行一次回调) 和 deep: true (深度侦听 reactive 对象的内部属性变化)。
      • 实践: 侦听一个 reactive 对象的某个属性 (() => user.age)。侦听整个 reactive 对象 (user, 需要 deep: true)。尝试使用 immediate: true 使侦听器在创建时立即执行。
      • 休息: 短暂休息。
    • 番茄时钟 3 (25 分钟工作 + 5 分钟休息):

      • 内容: watchEffect 的基本使用。
      • 活动: 阅读官方文档关于 watchEffect 的内容。理解 watchEffect立即执行一次,并且自动追踪回调函数中使用的所有响应式依赖,当其中任何一个改变时重新运行回调。
      • 实践:<script setup> 中导入 watchEffect。创建一个 watchEffect(() => { console.log('User age is now:', user.age); console.log('Message is:', message.value); }); 观察它如何自动追踪 user.agemessage.value 的变化。
      • 休息: 短暂休息。
    • 番茄时钟 4 (25 分钟工作 + 5 分钟休息):

      • 内容: watch vs watchEffect 与副作用清除。
      • 活动: 对比 watchwatchEffect 的区别(明确指定依赖 vs 自动追踪依赖;惰性执行 vs 立即执行)。理解它们都用于执行“副作用”(如数据获取、DOM 操作、设置定时器)。学习如何在侦听器回调中返回一个清除函数,用于清理副作用(例如清除定时器、取消进行中的异步请求)。
      • 思考: 在什么场景下更适合用 watch?什么场景下更适合用 watchEffect
      • 实践: 创建一个简单的异步操作(如 setTimeout),在 watchwatchEffect 回调中调用它,并返回一个清除函数来取消它。
      • 休息: 短短休息。
    • 总结与实践 (10-15 分钟):

      • 回顾 watchwatchEffect 的用法、区别以及副作用清除。
      • 思考实际应用中侦听器的场景(例如:根据用户 ID 变化重新加载数据、根据输入框内容实时搜索)。
      • 尝试在你的实践项目中实现一个需要侦听器功能的例子。

掌握检查:

  • 在 Day 32 结束时,你应该能够:
    • 在组件中使用 <script setup>
    • 使用 refreactive 创建不同类型的响应式数据。
    • 理解 ref.value 的作用以及在模板中的自动解包。
    • 知道 toRefs 何时需要使用(解构 reactive 对象)。
    • 理解 readonly 的作用。
    • 对 Vue 3 响应式基于 Proxy 的原理有一个基本概念。
    • 使用 computed 创建派生状态,并理解其缓存特性。
    • 使用 watch 侦听特定数据源的变化,并使用常用选项(immediate, deep)。
    • 使用 watchEffect 实现自动追踪依赖的副作用。
    • 理解 watchwatchEffect 的主要区别和适用场景。

相关文章:

Vue百日学习计划Day28-32天详细计划-Gemini版

总目标: 在 Day 28-32 深入理解 Vue 3 的响应式机制&#xff0c;熟练掌握 Composition API 中的 setup, ref, reactive, toRefs, readonly, computed, watch, watchEffect 等核心 API 的使用。 所需资源: Vue 3 官方文档 (组合式 API): https://cn.vuejs.org/guide/introducti…...

Leetcode134加油站

题目链接 134 题意图解&#xff1a; 题目给了n个节点&#xff0c;这些节点呈现环状&#xff0c;每次到一个低点要消耗cost[i]的油量。 从中我们可以得出一个结论&#xff1a;看一个点能不能到下一个点&#xff0c;就要用当前的油量减去消耗的量&#xff0c;那么gas[i] - cost…...

用算术右移实现逻辑右移及用逻辑右移实现算术右移

函数srl()用算术右移实现逻辑右移&#xff0c;函数sra()用逻辑右移实现算术右移。 程序代码 int sra(int x,int k); unsigned int srl(unsigned int x, int k);void main() {int rx1,k,x1;unsigned int rx2,x2;k3;x10x8777;x20x8777;rx1sra(x1, k);rx2srl(x2, k);while(1); }…...

箭头函数及其与普通函数区别的详细解释

一、箭头函数的基本特性 语法简洁性 箭头函数使用 > 符号定义&#xff0c;省略 function 关键字&#xff0c;适合快速定义匿名函数或简单表达式。 // 普通函数 function sum(a, b) { return a b; } // 箭头函数 const sum (a, b) > a b;若函数体为单行表达式&#x…...

Denoising Score Matching with Langevin Dynamics

在自然图像等复杂数据集中&#xff0c;真实数据往往集中分布在一个低维流形上&#xff0c;概率密度函数的梯度&#xff08;即得分函数&#xff09;难以定义与估计。为缓解该问题&#xff0c;SMLD 提出使用不同强度的高斯噪声对数据进行扰动&#xff0c;扰动后的数据不再集中于低…...

Flink的时间问题

Apache Flink 中的 时间语义&#xff08;Time Semantics&#xff09; 是流处理的核心概念之一。Flink 支持多种时间类型&#xff0c;用于控制窗口计算、事件排序和状态管理等操作。 &#x1f552; 一、Flink 时间分类 类型名称描述Processing Time处理时间每个算子基于本地系统…...

3:OpenCV—视频播放

播放来自文件或相机的视频 在本教程中&#xff0c;我将向您展示如何使用OpenCV从文件或相机/网络摄像头捕获和播放视频。尽管OpenCV没有针对视频处理进行优化&#xff0c;但它提供了一个简单的API来播放视频。在我们的OpenCV程序中&#xff0c;我们所要做的就是从视频文件或相…...

AI工程 新技术追踪 探讨

文章目录 一、核心差异维度对比二、GitHub对AI工程师的独特价值三、需要警惕的陷阱四、推荐追踪策略五、与传统开发的平衡建议 以下内容整理来自 deepseek 作为AI工程师&#xff0c;追踪GitHub开源项目 对技术成长和职业发展的影响 比传统应用开发工程师 更为显著&#xff0c;…...

C++:函数模板

所谓函数模板就是定义一个通用的函数&#xff0c;不指定具体的参数&#xff0c;用一个虚拟参数代替&#xff1b; 当函数调用时&#xff0c;会根据实参判断具体的类型。 注意&#xff1a;不要使用默认参数&#xff1b;可以重载但尽量不要重载。 #include<iostream> usi…...

一款适配国内的视频软件,畅享大屏与局域网播放

软件介绍 今天要给大家安利一款超强视频播放软件——MXPlayer。它的解码实力堪称一绝&#xff0c;市面上不管是常见的 MP4、MKV 格式&#xff0c;还是对播放设备要求极高的超高清 4K、HDR 视频&#xff0c;甚至那些鲜为人知的冷门格式&#xff0c;它统统都能流畅播放&#xff…...

SONiC系统之高速数据遥测High Frequency Telemetry

SONiC系统之高速数据遥测High Frequency Telemetry 数据遥测 这篇文章介绍了SONiC系统支持Telemetry的软件架构以及gNMI接口中Telemetry Streaming功能Dial-in和Dial-out两者模式的区别。正如该文指出的那样&#xff0c;该结构面临扩展性问题&#xff0c;当AI训练、推理等大型…...

【Java ee初阶】jvm(3)

一、双亲委派机制&#xff08;类加载机制中&#xff0c;最经常考到的问题&#xff09; 类加载的第一个环节中&#xff0c;根据类的全限定类名&#xff08;包名类名&#xff09;找到对应的.class文件的过程。 JVM中进行类加载的操作&#xff0c;需要以来内部的模块“类加载器”…...

C++ for QWidget:connect(连接)

语法&#xff1a; QObject::connect(发射信号的对象,发射的信号,接收信号的对象,接收后执行的命令) #include "mainwindow.h" #include "ui_mainwindow.h"MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow) {ui-&g…...

uni-app学习笔记七-vue3事件处理

本文主要用于记录vue3中的点击事件和change事件 点击事件&#xff1a;v-on:click,可简写为click change事件&#xff0c;用于监听值发生改变的的事件处理&#xff1a;change 示例代码&#xff1a; <template><view class"box" click"onClick"…...

【C++进阶篇】C++容器完全指南:掌握set和map的使用,提升编码效率

C容器的实践与应用&#xff1a;轻松掌握set、map与multimap的区别与用法 一. 序列式容器与关联式容器1.1 序列式容器 (Sequential Containers)1.2 关联式容器 (Associative Containers) 二. set系列使用2.1 set的构造和迭代器2.2 set的增删查2.2.1 插入2.2.2 查找2.2.3 删除 2.…...

吴恩达机器学习(1)——机器学习算法分类

1、机器学习算法 1、监督学习 在实际应用中最为常见的快速进度结果 2、非监督学习 2、监督学习&#xff08;Supervised Learning&#xff09; 2.1、回归算法 [!note] 监督学习 是指学习从 x -> y 或者从输入到输出映射的算法 监督学习的关键特征是你给学习算法提供学习…...

我的创作纪念日——512天

2023 年 12 月 19 日&#xff0c;我撰写了第 1 篇记录型博客《数据结构课程设计——报数问题》&#xff0c;这是我记录一段实践经验的开始。 回望那时的自己&#xff0c;还很稚嫩&#xff0c;刚刚迈入计算机的大门不久&#xff0c;一切都显得新鲜而充满挑战。今天是我成为创作者…...

SpringBoot快速上手

1.Maven Maven是项目管理工具&#xff0c;通过pom.xml文件来获取jar包&#xff0c;而不用手动去添加jar包 引入依赖之后需要刷新maven&#xff0c;以下这两个地方都可以 中央仓库 &#xff1a; Central Repository: Maven Repository: Central 2.Spring Boot 2.1创建项目…...

自动化:批量文件重命名

自动化&#xff1a;批量文件重命名 1、前言 2、效果图 3、源码 一、前言 今天来分享一款好玩的自动化脚&#xff1a;批量文件重命名 有时候呢&#xff0c;你的文件被下载下来文件名都是乱七八糟毫无规律&#xff0c;但是当时你下载的时候没办法重名或者你又不想另存为重新重…...

低延迟与高性能的技术优势解析:SmartPlayer VS VLC Media Player

在实时视频流的应用中&#xff0c;RTSP&#xff08;Real-Time Streaming Protocol&#xff09;播放器扮演着至关重要的角色&#xff0c;尤其是在视频监控、远程医疗、直播等高实时性需求的场景中。随着行业需求的不断升级&#xff0c;对播放器的低延迟、稳定性、兼容性等方面的…...

java中的Servlet2.x详解

一、Servlet 2.x 版本演进与核心特性 Servlet 2.x 是 Java Web 开发中承上启下的重要版本系列&#xff0c;主要包括 Servlet 2.4 和 Servlet 2.5 两个子版本。以下是其核心特性与改进&#xff1a; Servlet 2.4&#xff08;2003年发布&#xff09; XML Schema 支持&#xff1a;…...

大模型deepseek如何助力数据安全管理

敏感数据识别与处理 精准定位敏感信息 &#xff1a;运用多模态识别引擎技术&#xff0c;快速扫描上传文件与输入内容&#xff0c;精准识别身份证号、银行卡号、商业合同关键信息等各类敏感数据&#xff0c;并支持金融、医疗等行业定制化规则库&#xff0c;满足不同行业的特殊需…...

【linux驱动】【设备树】按键设备树讲解

设备树你添加电源键示例。 / {gpio-keys {compatible = "gpio-keys";#address-cells = <1>;#size-cells = <0>;button@1 {label = "Power Button";linux,code = <KEY_POWER>; // 按键编码,定义在include/uapi/linux/input-event-code…...

Vibe Coding:编程中的氛围与效率的艺术

引言 在软件开发的世界里&#xff0c;我们常常关注语言特性、框架选择和算法效率&#xff0c;却较少讨论一个同样重要的因素——编程时的"氛围"&#xff08;vibe&#xff09;。Vibe Coding是一种关注开发者心理状态、工作环境和整体"感觉"的编程方法论。它…...

算法岗实习八股整理——深度学习篇(不断更新中)

目录 激活函数特征典型例子sigmod函数tanh函数补充&#xff1a;零中心化输出优势非线性特性如何提升神经网络表现 激活函数 特征 非线性&#xff1a;激活函数满足非线性时&#xff0c;才不会被单层网络替代&#xff0c;神经网络才有意义可微性&#xff1a;优化器大多数是用梯…...

Java IO及Netty框架学习小结

Netty netty官网: Netty 什么是Netty&#xff1f; Netty 是 一个异步事件驱动的网络应用程序框架&#xff0c;用于快速开发可维护的高性能协议服务器和客户端。Netty 是一个 NIO 客户端服务器框架&#xff0c;可以快速轻松地开发网络应用程序&#xff08;例如协议服务器和客…...

理想AI Talk第二季-重点信息总结

一、TL&#xff1b;DR 理想为什么要做自己的基模&#xff1a;座舱家庭等特殊VLM场景&#xff0c;deepseek/openai没有解决理想的基模参数量&#xff1a;服务端-300B&#xff0c;VLencoder-32B/3.6B&#xff0c;日常工作使用-300B&#xff0c;VLA-4B为什么自动驾驶可以达成&…...

软件架构之-论软件系统架构评估以及应用

论软件系统架构评估以及应用 摘要正文 摘要 2023年2月&#xff0c;本人所在集团公司承接了长三角地区某省渔船图纸电子化审查系统项目开发&#xff0c;该项目旨在为长三角地区渔船建造设计院&#xff0c;以及渔船图纸审查机构提供一个便捷化的服务平台。在此项目中&#xff0c;…...

Java面试实战:从Spring Boot到分布式缓存的深度探索

Java面试实战&#xff1a;从Spring Boot到分布式缓存的深度探索 场景介绍 在一家著名的互联网大厂&#xff0c;面试官老王正对求职者“水货程序员”明哥进行Java技术面试。明哥带着一点紧张和自信&#xff0c;迎接这场技术“拷问”。 第一轮&#xff1a;基础问题 老王&#…...

2025年全国青少年信息素养大赛C++小学全年级初赛试题

一、单选题 1、在C中&#xff0c;表示逻辑运算符 "或" 的是&#xff1f;&#xff08; &#xff09;&#xff08;5 分&#xff09; A&#xff0e;|| B&#xff0e;& C&#xff0e; D&#xff0e; 解析&#xff1a;||是或者&#xff0c; &&是并且 2、…...

React中巧妙使用异步组件Suspense优化页面性能。

文章目录 前言一、为什么需要异步组件&#xff1f;1. 性能瓶颈分析2. 异步组件的价值 二、核心实现方式1. React.lazy Suspense&#xff08;官方推荐&#xff09;2. 路由级代码分割&#xff08;React Router v6&#xff09; 总结 前言 在 React 应用中&#xff0c;随着功能复…...

nginx相关面试题30道

一、基础概念与核心特性 1. 什么是 Nginx&#xff1f;它的主要用途有哪些&#xff1f; 答案&#xff1a; Nginx 是一款高性能的开源 Web 服务器、反向代理服务器及负载均衡器&#xff0c;基于事件驱动的异步非阻塞架构&#xff0c;擅长处理高并发场景。 主要用途&#xff1a;…...

java中的Servlet1.x详解

Servlet 1.x 是 Java Web 开发的早期规范&#xff0c;为后续版本奠定了基础。以下是其核心特性、使用方式及与现代版本的对比分析&#xff1a; 一、Servlet 1.x 的核心特性 基础接口与实现 Servlet 1.x 的核心是 javax.servlet.Servlet 接口&#xff0c;开发者必须直接实现其五…...

给大模型“贴膏药”:LoRA微调原理说明书

一、前言&#xff1a;当AI模型开始“叛逆” 某天&#xff0c;我决定教deepseek说方言。 第一次尝试&#xff08;传统微调&#xff09;&#xff1a; 我&#xff1a;给deepseek灌了100G东北小品数据集&#xff0c;训练三天三夜。结果&#xff1a;AI确实会喊“老铁666”了…但英…...

【数字电路】第七章 脉冲波形的产生与整形电路

一、脉冲波形的产生与整形电路概述 1.矩形脉冲的获得方法 2.矩形脉冲的主要参数 3.本章所涉及的电路 4.稳态与暂稳态 电路的暂稳态实际上是通过RC电路的充放电来实现的。 5.TTL电路输入等效电路 6.TTL电路的输出等效电路 7.CMOS电路的输入等效电路 8.CMOS电路的输出等效电路 …...

React Flow 边的基础知识与示例:从基本属性到代码实例详解

本文为《React Agent&#xff1a;从零开始构建 AI 智能体》专栏系列文章。 专栏地址&#xff1a;https://blog.csdn.net/suiyingy/category_12933485.html。项目地址&#xff1a;https://gitee.com/fgai/react-agent&#xff08;含完整代码示​例与实战源&#xff09;。完整介绍…...

DB-MongoDB-00002--Workload Generator for MongoDB

## DB-MongoDB-00002–Workload Generator for MongoDB 1、介绍 Workload Generator for MongoDB was designed to help MongoDB users effortlessly generate data and simulate workloads for both sharded and non-sharded clusters. The generated workloads include s…...

buck变换器的simulink/matlab仿真和python参数设计

什么是Buck电路? BUCK电路是一种降压斩波器&#xff0c;降压变换器输出电压平均值Uo总是小于输出电压UD。通常电感中的电流是否连续&#xff0c;取决于开关频率、滤波电感L和电容C的数值。BUCK也是DC-DC基本拓扑&#xff0c;或者称为电路结构&#xff0c;是最基本的DC-DC电路…...

谷歌地球引擎GEE将多个遥感影像作为多个波段合并成一张图像并下载的方法

本文介绍在谷歌地球引擎&#xff08;Google Earth Engine&#xff0c;GEE&#xff09;中&#xff0c;下载多年的逐日的ERA5土壤湿度数据&#xff0c;并在下载时&#xff0c;将每年同月份内的每一天的图像作为一个波段加以合并的方法。 在之前的文章GEE谷歌地球引擎批量下载逐日…...

Debezium快照事件监听器系统设计

Debezium快照事件监听器系统设计 1. 系统概述 1.1 设计目标 为 Debezium 的快照过程提供可扩展的事件监听机制允许外部系统在快照过程中执行自定义逻辑提供线程安全的事件分发机制确保监听器的异常不会影响主快照流程1.2 核心功能 表快照开始事件监听表快照完成事件监听行数据…...

选择之困:如何挑选合适的 Python 环境与工具——以 Google Colaboratory 为例

引言:选择之困与 Python 的多样性 在过去的十年中,Python 编程语言以其简洁的语法、强大的功能和广泛的适用性迅速崛起,成为全球最受欢迎的编程语言之一。从数据科学到 Web 开发,从自动化脚本到人工智能,Python 无处不在。然而,这种多样性和快速发展也带来了一个显著的问…...

基于Java+MySQL+Servlet的留言系统开发全解析

本系统基于Java Web技术栈开发&#xff0c;采用前后端分离架构&#xff0c;后端通过Servlet实现业务逻辑&#xff0c;前端使用HTML/CSS/JavaScript构建交互界面。本文将详细解析系统设计思路、技术实现与核心代码&#xff0c;助您快速掌握留言系统开发精髓。 一、项目简介 本留…...

实操分享java应用容器化,使用docker作为容器工具

### 一. 目的 将现有的java应用容器化,使用docker作为容器工具。 ### 二. 配置 #### 1. Java应用中的配置 ##### a. Java子项目中的pom文件配置 ```xml <build> <plugins> <plugin> <groupId>org.spring…...

李臻20242817_安全文件传输系统项目报告_第12周

安全文件传输系统项目报告&#xff08;第 9 周&#xff09; 1. 代码链接 Gitee 仓库地址&#xff1a;https://gitee.com/li-zhen1215/homework/tree/master/Secure-file 代码结构说明&#xff1a; project-root/├── src/ # 源代码目录│ ├── main.c # 主程序入口│ ├…...

19-I2C库函数

一、IIC配置流程 IIC配置流程需要添加的库函数&#xff1a;stm32f4xx_i2c.c 1、理解电路原理图 SCL --- PB8 SDA -- PB9 使用I2C1 2、配置I2C库函数的步骤 &#xff08;1&#xff09;使能GPIOB组时钟RCC_AHB1PeriphClockCmd(RCC_AHB1Periph_GPIOB, ENABLE);&#xff08;2…...

minicom串口调试助手

sudo apt-get install minicom 配置 sudo minicom -s 然后用方向键向下移动到“Serial port setup”&#xff0c;回车 按键盘“A”把串口的映射文件名输入。 按键盘“E”可以修改波特率 按键盘“F”把硬件流关闭&#xff0c;否则minicom可能无法接收键盘输入。 配置好后&…...

扫描件交叉合并PDF免费软件 拖拽即合并 + 自动对齐页码 档案整合更轻松

各位办公小能手们&#xff01;我跟你们说啊&#xff0c;今天要给你们介绍个超厉害的工具&#xff0c;叫PDFCrossMerge。这玩意儿就像一个神奇的文档小魔法师&#xff0c;专门搞PDF扫描件交叉合并的事儿&#xff0c;能解决单面扫描文件正反面页码顺序的大难题。 先说说它的核心…...

atcoder C - ~

https://atcoder.jp/contests/abc406/tasks/abc406_c 题目简述&#xff1a; 给定一个序列p&#xff0c;让你求出p的所有子序列中波浪形序列的个数 波浪形序列的定义&#xff1a;1&#xff1a;长度>4&#xff1b;2&#xff1a;仅存在一个波峰和波谷&#xff1b;3&#xff1…...

PCB设计实践(十八)PCB设计铜厚选择及分层设计深度解析

PCB铜箔厚度作为电路板设计的核心参数之一&#xff0c;直接影响电路性能、可靠性及成本。本文将从铜厚选择的六大核心要素、多层板分层设计的策略、制造工艺的耦合关系三大维度&#xff0c;系统性解析PCB铜厚设计的工程方法论&#xff0c;并结合典型应用场景提供决策框架。 一、…...

React 19中如何向Vue那样自定义状态和方法暴露给父组件。

文章目录 前言一、什么是 useImperativeHandle&#xff1f;1.1 为什么需要 useImperativeHandle&#xff1f;1.2 基本语法 二、useImperativeHandle 的常见用法3.1 暴露自定义方法3.2子组件封装的弹窗关闭方法暴露给外部 注意点&#xff1a;总结 前言 在 React 的函数组件中&a…...