【React1】React概述、基本使用、脚手架、JSX、组件
文章目录
- 1. React基础
- 1.1 React 概述
- 1.1.1 什么是React
- 1.1.2 React 的特点
- 声明式
- 基于组件
- 学习一次,随处使用
- 1.2 React 的基本使用
- 1.2.1 React的安装
- 1.2.2 React的使用
- 1.2.3 React常用方法说明
- React.createElement()
- ReactDOM.render()
- 1.3 React 脚手架的使用
- 1.3.1 React 脚手架的意义
- 1.3.2 使用React 脚手架初始化项目
- 另:npx命令介绍
- 1.3.3 在脚手架中使用React
- 2. JSX
- 2.1 JSX的基本使用
- 2.1.1 React.createElement()的问题
- 2.1.2 JSX简介
- 2.1.3 JSX使用步骤
- 2.1.4 思考:为什么脚手架中可以使用JSX语法?
- 2.1.5 JSX的注意点
- 2.2 JSX中使用Javascript表达式
- 2.3 JSX的条件渲染
- 2.4 JSX的列表渲染
- 2.5 JSX的样式处理
- 2.5.1 行内样式 -- style
- 2.5.2 类名 -- className
- 2.6 JSX总结
- 3. React组件基础
- 3.1 React组件的介绍
- 3.2 React组件的两种创建方式
- 3.2.1 使用`函数`创建组件
- 3.2.2 使用`类class`创建组件
- 3.2.3 把创建好的组件,`抽离成独立的JS文件`
- 3.3 React事件处理
- 3.3.1 事件绑定
- 3.3.2 事件对象
- 3.4 有状态组件 和 无状态组件
- 3.5 组件中的state 和 setState()
- 3.5.1 state的基本使用
- 1. `初始化state` / 初始化状态
- 2. `获取状态` / 在组件中使用状态
- 3.5.2 setState()修改状态state
- 3.5.3 从JSX中`抽离`事件处理程序
- 3.6 事件绑定this指向
- 3.7 表单处理
参考:
- React 入门实例教程 - 阮一峰–太早,不推荐
- React 官网
- React 官网 -中文
- React入门看这篇就够了
加微信
1124692
领取资料
1. React基础
React基础目标:
- 能够说出
react是什么
- 能够说出
react的特点
- 能够掌握
react的基本使用
- 能够使用
react脚手架
1.1 React 概述
1.1.1 什么是React
React
是一个用于构建用户界面
的javascript库
。
用户界面:对前端来说就是HTML页面, 所以,React 主要用来写HTML页面,或
构建Web应用
。
- 如果从
MVC的角度看,React仅仅是视图层(V)
,也就是只负责视图的渲染
,而并非提供了完整的M 和 C的功能。 - React
起源于Facebook的内部项目
,后又用来假设Instagram的网站,并与2013年5月开源
。
React简介
- React 是Facebook用来
创建用户界面的JS库
,在2013年开源。- React
不是一个MVC框架
,而是一个用于构建组件化UI的库
,是一个前端界面
开发工具,所以很多人认为React 是MVC中的V(视图view)
。- React的存在能够很好的解决“
构建随着时间数据不断变化
的大规模应用
程序” – 相当于一个组件化的思想
,把一个大应用拆分成很多小的组件,所以React能够引导我们重新思考如何构建应用程序
。- React的核心就是
封装可复用性高的组件
,各个组件维护自己的状态和UI
,当状态变更,自动重新渲染
整个组件。
学习React前了解:
- 目前前端的主流框架由Vue、React、Angular组成。
- Angular因为
革命性太高
(每次发布新版本,都会颠覆前面版本的语法与使用,所以维护成本比较高),所以Vue、React 比较受欢迎- Vue、React 都是一个
MVVM框架
,为什么需要MVVM框架? – 以往用js 或者jquery 来操作大量的dom,会导致渲染的时间很慢,但是MVVM这种设计模式不会直接操作dom,而是用model来代替dom,用js形成一个虚拟的dom树,只会在最后一次进行渲染(什么时候数据不修改了,确定了dom了,才会对dom进行渲染,不像实际dom,操作一次渲染一次)
1.1.2 React 的特点
- 声明式
- 基于组件
- 学习一次,随处使用
声明式
- 只需要描述UI(HTML)看起来是什么样,就跟写HTML一样
- 我们负责
用React代码来描述结构
,React负责渲染UI,并在数据变化时更新UI
//比如我们在页面中响应一个标题,我们只需要写一个h1标签
const jsx = <div className = "app"><h1>Hello React! 动态变化数据:{count}</h1>
</div>
基于组件
- 组件是React最重要的内容
- 组件表示页面中的一部分内容
组合、复用多个组件
,可以实现完整的页面功能
学习一次,随处使用
- React的必杀技
- 使用React 不仅可以
开发Web应用
,还可以开发移动端(安卓/苹果)原生应用
(react-native),还可以开发VR(虚拟现实)应用
(react 360)
React 特性
React 是声明式、组件化的,非常灵活。
- 声明式
- 组件化
- 灵活 : 支持单页面(一个html,由路由方式去进行分发) / 多页面(多个html)
- 支持
服务端渲染
,可以把react 放到node服务器中渲染页面出来,一些官网、商城的项目,react 写的是单页面,但需求是多页面,这时可以用next.js来生成多个视图,这样方便做seo优化,提高网站排名- 可以做react native ,还可以做app开发,所以react 应用非常广泛。
组件化 和 模块化的区别:
- 组件化侧重于UI,把前端一个独立的UI模块,开发成一个小的组件,然后在不同的页面进行嵌套、拼接,就像积木一样。
- 模块化侧重于功能,比如get、post请求这个功能要在很多地方用到,我们就把它做成一个独立的模块,在其他地方使用。
1.2 React 的基本使用
1.2.1 React的安装
- 安装命令:
npm i react react-dom
- react 包是
核心
,提供了创建元素、组件
等功能 - react-dom 包提供
DOM相关功能
等
安装完成后可在package.json中查看
node_modules中有相应的包,且可在package.json中查看具体信息
1.2.2 React的使用
1. 引入react
原生的html中引react库的方法:
<!-- React -->
<script src="https://cdn.jsdelivr.net/npm/react@17.0.2/umd/react.production.min.js"></script>
<!-- React DOM -->
<script src="https://cdn.jsdelivr.net/npm/react-dom@17.0.2/umd/react-dom.production.min.js"></script>
或者,像上面用npm 安装后,引入
<script src="./node_modules/react/umd/react.development.js"></script>
<script src="./node_modules/react-dom/umd/react-dom.development.js"></script>
2. 创建react元素
<script>const title = React.createElement('h1',null,'Hello React') // React是由核心库react.js提供的
</script>
- 渲染创建好的react元素到页面中
ReactDOM.render(title,document.getElementById('app')) //ReactDOM 是由react-dom提供的
完整代码如下:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>lxz20231103</title>
</head>
<body><div id="app"></div><!-- 1.引入js文件 --><script src="./node_modules/react/umd/react.development.js"></script><script src="./node_modules/react-dom/umd/react-dom.development.js"></script><script>// 2. 创建react元素// React.createElement('元素名称',元素属性,'元素子节点(文本节点或者元素节点)')const title = React.createElement('h1',null,'Hello React') //声明一个常量title来接收创建好的React元素// 3. 渲染react元素到页面某元素中// ReactDOM.render(要渲染的react元素,要把元素渲染、挂载在哪位位置(挂载点))ReactDOM.render(title,document.getElementById('app'))</script>
</body>
</html>
1.2.3 React常用方法说明
React.createElement()
- 了解即可,因为这个方法用起来不是特别友好,在创建复杂结构的时候会很繁琐,后面会有一种简单友好的方法来创建react元素
- 参数:
参数1:元素名称,也就是html元素的名字,字符串
,eg: ‘p’,'h1’等
参数2:元素属性,没有属性写null
,有属性写对象
,eg: {title:‘我是标题’}
参数3及以后的参数:元素的子节点
,所以这个方法不知有3个参数,可能有很多参数
情况1: 没有属性,文本子节点
const title = React.createElement('h1',null,'Hello React') // 没有属性的h1标签,子节点是文本 Hello React
情况2:有属性,文本子节点
const title = React.createElement('p',{id:'p1',title:'我是标题'},'Hello React'
)
情况3:
const title = React.createElement('p', // 元素1:创建元素的 标签名称{id:'p1',title:'我是标题'}, // 元素2: 创建元素的 属性'Hello React', // 元素3 及以后 : 创建元素的子节点,子节点1:文本React.createElement('span',null,'加油!') // 元素3 及以后 : 创建元素的子节点,同级子节点2:元素
)
类似上图这样一个简单的结构也要很多代码,所以这个方法用起来并不是很方便,了解即可
ReactDOM.render()
- 作用:用来将创建好的react元素渲染到页面中
- 参数:
参数1:创建好的react元素或者组件
参数2:dom对象,通常用document.getElementById('app')
来获取根节点
1.3 React 脚手架的使用
1.3.1 React 脚手架的意义
- 脚手架是开发
现代web应用
的必备
- 现代web应用不再像传统的方式去创建页面写css,js那样
- 现在web应用写代码只是其中的一环,除此之外还有代码规范、项目打包上线、预编译等等问题要考虑。所以我们需要一套完整的解决方案来帮我们开发项目,如果手动一个个处理,就很繁琐,因此我们需要这么一套工具,这个工具就是脚手架。
- 另外我们还可以充分的利用webpack、babel、eslint等工具来辅助我们进行项目的开发。
使用react 完全不用考虑webpack等的配置问题,react脚手架是开箱即用的,我们可以用更多的时间来关注业务,而非配置。
1.3.2 使用React 脚手架初始化项目
- 初始化项目:
- 推荐使用:
npx create-react-app my-app-name
- 方式2:
npm init react-app my-app-name
- 方式3:
yarn create react-app my-app-name
happy hacking – 快乐黑客
- 启动项目,在
项目根目录
执行命令:npm start
- 项目根目录-- 有
p
相关文章:
【React1】React概述、基本使用、脚手架、JSX、组件
文章目录 1. React基础1.1 React 概述1.1.1 什么是React1.1.2 React 的特点声明式基于组件学习一次,随处使用1.2 React 的基本使用1.2.1 React的安装1.2.2 React的使用1.2.3 React常用方法说明React.createElement()ReactDOM.render()1.3 React 脚手架的使用1.3.1 React 脚手架…...
k8s部署kafka集群
k8s部署kafka集群 kafka(Kafka with KRaft) mkdir -p ~/kafka-ymlkubectl create ns kafkacat > ~/kafka-yml/kafka.yml << EOF apiVersion: v1 kind: Service metadata:name: kafka-headlessnamespace: kafkalabels:app: kafka spec:type: C…...
(C++回溯01) 组合
77、组合 回溯题目三步走 1. 确定参数 2. 确定终止条件 3. for 循环横向遍历,递归纵向遍历 class Solution { public:vector<vector<int>> result;vector<int> path;void backtracking(int n, int k, int startIndex) {if(path.size() k) {…...
k8s学习笔记——安装istio的仪表盘之prometheus安装
接上一篇,继续安装istio的dashboard。 先到istio-1.22.0/samples/addons目录下,把yaml文件中的镜像仓库地址修改了,修改地址参考我之前写的CSDN里的镜像对照表。不然直接执行kubectl apply -f samples/addons这个命令后,依据会出…...
四、GD32 MCU 常见外设介绍 (7) 7.I2C 模块介绍
7.1.I2C 基础知识 I2C(Inter-Integrated Circuit)总线是一种由Philips公司开发的两线式串行总线,用于内部IC控制的具有多端控制能力的双线双向串行数据总线系统,能够用于替代标准的并行总线,连接各种集成 电路和功能模块。I2C器件能够减少电…...
Apollo 配置中心的部署与使用经验
前言 Apollo(阿波罗)是携程开源的分布式配置管理中心。 本文主要介绍其基于 Docker-Compose 的部署安装和一些使用的经验 特点 成熟,稳定支持管理多环境/多集群/多命名空间的配置配置修改发布实时(1s)通知到应用程序支…...
Perl中的设计模式革新:命令模式的实现与应用
Perl中的设计模式革新:命令模式的实现与应用 在面向对象编程中,设计模式是解决特定问题的成熟模板。命令模式作为行为设计模式之一,它将请求封装为对象,从而允许用户根据不同的请求对客户进行参数化。本文将深入探讨如何在Perl中…...
Java8-求两个集合取交集
在Java8中,求两个集合的交集可以使用不同的三种方式:传统的循环遍历、使用Stream API的filter操作和使用Stream API的Collection操作。 方法一:传统的循环遍历 首先,我们创建两个集合list1和list2,并给它们添加一些元…...
爬虫学习4:爬取王者荣耀技能信息
爬虫:爬取王者荣耀技能信息(代码和代码流程) 代码 # 王者荣耀英雄信息获取 import time from selenium import webdriver from selenium.webdriver.common.by import By if __name__ __main__:fp open("./honorKing.txt", "…...
在Ubuntu 14.04上安装和使用Memcache的方法
前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站。 简介 随着您的网站的增长和流量的增加,最快显示压力的组件之一是后端数据库。如果您的数据库没有分布式和配置来处理高负载…...
PCDN技术如何降低运营成本?
PCDN技术通过以下几种方式降低运营商的运营成本: 1.利用用户设备作为缓存节点: PCDN技术将用户设备纳入内容分发网络,利用这些设备的闲置带宽和存储资源来缓存和分发内容。这种方式不需要运营商投入大量的高成本服务器和带宽资源,从而降低了硬件和带宽…...
服务器数据恢复—V7000存储硬盘故障脱机的数据恢复案例
服务器存储数据恢复环境: 某品牌P740小型机AIXSybaseV7000磁盘阵列柜,磁盘阵列柜中有12块SAS机械硬盘(其中包括一块热备盘)。 服务器存储故障: 磁盘阵列柜中有一块磁盘出现故障,运维人员用新硬盘替换掉故障…...
BSV区块链在人工智能时代的数字化转型中的角色
发表时间:2024年6月13日 企业数字化转型已有约30年的历史,而人工智能(以下简称AI)将这种转型提升到了一个全新的高度。这并不难理解,因为AI终于使企业能够发挥其潜力,实现更宏大的目标。然而࿰…...
android audio 相机按键音:(二)加载与修改
相机按键音资源,加载文件路径: frameworks/av/services/camera/libcameraservice/CameraService.cpp 按键音,加载函数: void CameraService::loadSoundLocked(sound_kind kind) { ATRACE_CALL(); LOG1("Cam…...
Linux grep技巧 提取log中的json数据
目录 一. 前提1.1 数据准备1.2 需求1.3 分析 二. 数据提取2.1 提取所有的json数据2.2 提取子项目的全部json数据2.3 提取指定项目的json数据 一. 前提 1.1 数据准备 545-1 2024/07/20 18:20:21 [ERROR] MPX001 eventControlleraupay transactionIdA545 {"event":&q…...
HDShredder 7 企业版案例分享: 依照国际权威标准,安全清除企业数据
HDShredder 7 企业版用户案例 天津鸿萌科贸发展有限公司是德国 Miray 公司 HDShredder 数据清除软件的授权代理商。近日,上海某网络科技有限公司采购 HDShredder 7 企业版x4,为公司数据存储资产的安全清除工作流程配备高效的执行工具。HDShredder 7 企业…...
centos系统使用mysqldump数据备份与恢复
文章目录 使用mysqldump备份数据库一、数据库备份1. 基础备份2. 额外选项(一般组合使用) 二、数据库恢复 使用mysqldump备份数据库 一、数据库备份 1. 基础备份 #备份单个数据库 mysqldump -u 用户名 -p 数据库名 > 备份文件.sql#备份多个数据库 mysqldump -u 用户名 -p …...
【element ui】input输入控件绑定粘贴事件,从 Excel 复制的数据粘贴到输入框(el-input)时自动转换为逗号分隔的数据
目录 1、需求2、实现思路:3、控件绑定粘贴事件事件修饰符说明: 4、代码实现🚀写在最后 1、需求 在 Vue 2 和 Element UI 中,要实现从 Excel 复制空格分隔的数据,并在粘贴到输入框(el-input)时自动转换为逗号分隔的数据…...
Chapter18 基于物理的渲染——Shader入门精要学习
Chapter18 基于物理的渲染 一、PBS理论和数学基础1.光是什么微表面模型 2.渲染方程3.精确光源4.双向反射分布函数 BRDF5.漫反射项(Lambert 模型)Lambertian BRDF为:Disney BRDF中漫反射项 6.高光反射项微面元理论BRDF的高光反射项①菲涅尔反射…...
DolphinScheduler学习
1.查看文档 点击访问:https://dolphinscheduler.apache.org/zh-cn/docs 我们可以看到相关的文档简介里有 介绍 DolphinScheduler是Apache DolphinScheduler 是一个分布式易扩展的可视化DAG工作流任务调度开源系统。适用于企业级场景,提供了一个可视化…...
我用Tauri开发的待办效率工具开源了!
开源仓库地址 gitee Git仓库地址:https://gitee.com/zhanhongzhu/zhanhongzhu.git 应用地址 windows应用地址下载 https://kestrel-task.cn 具体内容 也可以看🎉使用Taurivitekoa2mysql开发了一款待办效率应用 这篇文章。 💻技术栈 Tauri: Tauri…...
【黑科技】:Laravel 项目性能提升 20 倍
令人激动的黑科技:Laravel 项目性能提升 20 倍 这个项目能够在无需修改任何代码且无需第三方扩展的前提下,将你的 Laravel 项目性能提高 20 倍。它仅依赖于 PHP 原生的 pcntl、posix、fiber 和 sockets。 项目灵感 起因是看到官方发布的 PHP 8.1 更新…...
User Allocation In MEC: A DRL Approach 论文笔记
论文:ICWS 2021 移动边缘计算中的用户分配:一种深度强化学习方法 代码地址:使用强化学习在移动边缘计算环境中进行用户分配 目录 Ⅰ.Introduction II. MOTIVATION-A.验证假设的观察结果 II. MOTIVATION-A Motivating Example 数据驱动…...
leetcode 69. x 的平方根
可以使用二分查找法或牛顿迭代法来实现 LeetCode 问题 69. x 的平方根。下面是使用二分查找法和牛顿迭代法的 C 实现。 二分查找法 #include <iostream>class Solution { public:int mySqrt(int x) {if (x 0) return 0;int left 1, right x, ans 0;while (left <…...
基于词级ngram的词袋模型对twitter数据进行情感分析
按照阿光的项目做出了学习笔记,pytorch深度学习实战项目100例 基于词级ngram的词袋模型对twitter数据进行情感分析 什么是 N 符? N 格是指给定文本或语音样本中 n 个项目的连续序列。这些项目可以是音素、音节、字母、单词或碱基对,具体取…...
Linux-Centos-改密码(单用户登陆)
笔记一: centos7单用户修改root密码 在CentOS 7中,如果您是唯一的用户或者您确信其他用户不会登录,您可以按照以下步骤来修改root密码: 1.重启系统。 2.启动时出现引导界面时,按任意键进入GRUB菜单。 3.选择要启动的内…...
java实现OCR图片识别,RapidOcr开源免费
先看一下识别效果(自我感觉很牛逼),比Tess4J Tesseract省事,这个还需要训练,安装软件、下载语言包什么的 很费事,关键识别率不高 RapidOcr不管文字的横竖,还是斜的都能识别(代码实现…...
PCB工艺边设计准则
在PCB设计时,通常会在电路板的边缘预留一定的空间,这部分空间被称为工艺边。它有助于在生产过程中确保电路板的尺寸和形状的准确性。以使得组装时更加顺畅、便捷。而工艺边的加工,使得线路板上的元件可以精准地与设备对接,从而提高…...
CTF-NSSCTF题单[GKCTF2020]
[GKCTF 2020]CheckIN 这道题目考察:php7-gc-bypass漏洞 打开这道题目,开始以为考察反序列化,但实际并不是,这里直接用$_REQUEST传入了参数便可以利用了。这里出现了一个eval()函数,猜测考察命…...
redis的分片集群(仅供自己参考)
前言:为什么使用分片集群:因为redis的主从和哨兵机制主要是用来解决redis的高并发读的问题,还有redis的高并发的写的问题没有解决。使用分片集群就可以很好的解决redis写的问题,有多个master就可以实现并发的写。同时,…...
自动驾驶-机器人-slam-定位面经和面试知识系列01之常考公式推导(01)
李群李代数扰动bundle adjustment 这个博客系列会分为C STL-面经、常考公式推导和SLAM面经面试题等三个系列进行更新,基本涵盖了自己秋招历程被问过的面试内容(除了实习和学校项目相关的具体细节)。在知乎和牛客也会同步更新,全网…...
netty入门-5 ServerBootstrap与Bootstarp
前言 本来这篇应该紧接着说明Future和Promise。 但是考虑前文第三篇即用到了ServerBootstrap来启动一个服务器,并且我读的闪电侠netty,先写的服务器与客户端启动这部分。索性就先写出来了。主要内容来自闪电侠netty ServerBootstrap ServerBootstrap就…...
JavaEE - Spring Boot 简介
1.Maven 1.1 什么是Maven 翻译过来就是: Maven是⼀个项⽬管理⼯具。基于POM(Project Object Model,项⽬对象模型)的概念,Maven可以通 过⼀⼩段描述信息来管理项⽬的构建,报告和⽂档的项⽬管理⼯具软件。 可以理解为:Maven是一个项目管理工具…...
SwiftUI革新:Xcode UI开发的新纪元
SwiftUI革新:Xcode UI开发的新纪元 SwiftUI作为Apple推出的声明式UI框架,彻底改变了在Xcode中构建用户界面的方式。它不仅简化了代码,还提高了开发效率,并且使得UI设计更加直观和灵活。本文将深入探讨如何在Xcode中使用SwiftUI进…...
22、基于共享内存的数据结构——用十个块来提高并发性
初级代码游戏的专栏介绍与文章目录-CSDN博客 我的github:codetoys,所有代码都将会位于ctfc库中。已经放入库中我会指出在库中的位置。 这些代码大部分以Linux为目标但部分代码是纯C的,可以在任何平台上使用。 为了提高并发性,把…...
【ffmpeg命令入门】实现画中画
文章目录 前言画中画是什么画中画的外观描述效果展示为什么要用画中画应用场景示例 使用FFmpeg添加画中画示例命令参数解释调整嵌入视频的位置调整嵌入视频的大小处理音频 总结 前言 FFmpeg 是一款强大的多媒体处理工具,广泛用于音视频的录制、转换和流处理。它不仅…...
基于 LangChain+LangGraph 来实现一个翻译项目
相信大家在看文档的时候,有时会比较苦恼,比如 AI 相关的文档都是外文,中文文档比较少,看起来会比较吃力,有的时候会看不懂,翻译软件又翻得很乱,完全看不了,今天就基于 LangChain 和 …...
javascript 如何将 json 格式数组转为 excel 表格| sheetJS
案例 // https://unpkg.com/xlsx0.18.5/dist/xlsx.full.min.js function exportXlsx(jsonData, fileName , mine null) {const workbook XLSX.utils.book_new();// 将JSON数组转换成工作表const worksheet XLSX.utils.json_to_sheet(jsonData);// 向工作簿添加工作表XLSX.…...
网页制作技术在未来会如何影响人们的生活?
网页制作技术在未来会如何影响人们的生活? 李升伟 网页制作技术在未来可能会从以下几个方面显著影响人们的生活: 1. 工作与学习方式的变革:远程办公和在线教育将更加普及和高效。通过精心制作的网页,人们能够实现更便捷的协作…...
【计算机网络】网络层——IPv4地址(个人笔记)
学习日期:2024.7.24 内容摘要:IPv4地址,分类编址,子网,无分类编址 IPv4地址概述 在TCP/IP体系中,IP地址是一个最基本的概念,IPv4地址就是给因特网上的每一台主机的每一个接口分配一个在全世界…...
c++ 学习笔记之多线程:线程锁,条件变量,唤醒指定线程
基于CAS线程加锁方式 CAS(Compare-And-Swap)和 mutex 都是用于实现线程安全的技术,但它们适用于不同的场景,具有不同的性能和复杂性。下面是对两者的区别和使用场景的详细解释: CAS(Compare-And-Swap&…...
《0基础》学习Python——第二十三讲__网络爬虫/<6>爬取哔哩哔哩视频
一、在B站上爬取一段视频(B站视频有音频和视频两个部分) 1、获取URL 注意:很多平台都有反爬取的机制,B站也不例外 首先按下F12找到第一条复制URL 2、UA伪装,下列图片中(注意代码书写格式) 3、Co…...
第13周 简历职位功能开发与Zookeeper实战
第13周 简历职位功能开发与Zookeeper实战 本章概述1. Mysql8窗口函数over使用1.1 演示表结构与数据1.2 案例1:获取男女总分数1.3 案例2****************************************************************************************本章概述 1. Mysql8窗口函数over使用 参考案例…...
什么是大型语言模型 (LLM)
本章探讨下,人工智能如何彻底改变我们理解和与语言互动的方式 大型语言模型 (LLM) 代表了人工智能的突破,它采用具有广泛参数的神经网络技术进行高级语言处理。 本文探讨了 LLM 的演变、架构、应用和挑战,重点关注其在自然语言处理 (NLP) 领…...
【人工智能】AI时代:探索个人潜能的新视角
文章目录 🍊Al时代的个人发展1 AI的高速发展意味着什么1.1 生产力大幅提升1.2 生产关系的改变1.3 产品范式1.4 产业革命1.5 Al的局限性1.5.1局限一:大模型的幻觉1.5.2 局限二:Token 2 个体如何应对这种改变?2.1 职场人2.2 K12家长2.3 大学生2.4 创业者 …...
pyaudio VAD通过声音音频值分贝大小检测没人说话自动停止录制
效果可能说话声音小可能不被监听到,需要更改QUIET_DB阈值,另外delay_time值是低于阈值多久就可以停止保存当前的语音 import pyaudio import waveimport sys import numpy as npdef record_auto(MIC_INDEX=1):开启麦克风录音,保存至temp/speech_record.wav音频文件音量超过…...
《后端程序猿 · @Value 注释说明》
📢 大家好,我是 【战神刘玉栋】,有10多年的研发经验,致力于前后端技术栈的知识沉淀和传播。 💗 🌻 CSDN入驻不久,希望大家多多支持,后续会继续提升文章质量,绝不滥竽充数…...
【LeetCode】71.简化路径
1. 题目 2. 分析 3. 代码 我写了一版很复杂的代码: class Solution:def simplifyPath(self, path: str) -> str:operator [] # 操作符的栈dir_name [] # 文件名的栈idx 0cur_dir_name ""while(idx < len(path)):if path[idx] /:operator.ap…...
DockerCompose 安装环境
1. Redis version: 3 services:redis:image: redis:6.2.12container_name: redisports:- "6379:6379"environment:TZ: Asia/Shanghaivolumes:# 本地数据目录要先执行 chmod 777 /usr/local/docker/redis/data 赋予读写权限,否则将无法写入数据- /usr/loc…...
学习笔记之JAVA篇(0724)
p 方法 方法声明格式: [修饰符1 修饰符2 ...] 返回值类型 方法名(形式参数列表){ java语句;......; } 方法调用方式 普通方法对象.方法名(实参列表)静态方法类名.方法名(实参列表) 方法的详…...