React面试题(二)

说说React的事件机制

是什么

React基于浏览器的事件机制自身实现了一套事件机制,包括事件注册,事件的合成,事件派发等
在React中这套事件机制被称之为合成事件

合成事件(SyntheicEvent)

合成事件是React模拟原生DOM事件所有能力的一个事件对象,即浏览器原生事件的跨浏览器包装器

根据W3C规范来定义合成事件,兼容所有浏览器,拥有与浏览器原生事件相同的接口,例如:

const button = <button onClick={handleClick}> 按钮 </button>

如果想要原生的DOM事件,可以通过e.nativeEvent属性获取

const handleClick = (e) => console.log(e.nativeEvent);
const botton = <button onClick={handleClick}>按钮</button>

从上面可以看到React事件和原生事件也非常的相似,但也有一定的区别:

  • 事件名称命名方式不同
// 原生事件绑定方式
<button onclick="handleClick()">按钮命名</button>// React 合成事件绑定方式
const button = <button onClick={handleClick} > 按钮命名</button>
  • 事件函数书写不同
// 原生事件  事件处理函数写法
<button onclick="handleClick()">按钮命名</button>// React 合成事件 事件处理函数写法
const button = <button onclick={handleClick}> 按钮命名 </button>

虽然 onclick 看似绑定到 DOM 元素上,但实际并不会把事件代理函数直接绑定到真实的节点上,而是把所有的事件绑定到结构的最外层,使用一个统一的事件去监听这个事件监听器上维持了一个映射来保存所有组件内部的事件监听和处理画数。当组件挂截或卸时,只是在这个统一的事件监听器上插入或删除一些对象

当事件发生时,首先被这个统一的事件监听器处理,然后在映射里找到真正的事件处理函数并调用。这样做简化了事件处理和回收机制,效率也有很大提升

执行顺序

关于React合成事件与原生事件执行顺序,可以看看下面一个例子:

import React from 'react'
class App extends React.Component{constructor(props){super(props);this.parentRef = React.createRef();this.childRef = React.createRef();}componentDidMount(){console.log("React componentDidMount!");this.parentRef.current?.addEventListener("click",()={console.log("原生事件:父元素DOM事件监听!");});this.childRef.current?.addEventListener("click",()={console.log("原生事件:子元素DOM事件监听!");});document.addEventListener("click",()=>{console.log("原生事件:document DOM事件监听!")});}parentClickFunc = ()=>{console.log("React 事件:父元素事件监听!");};childClickFun = () => {console.log("React 事件:子元素事件监听");}render(){return (<div ref={this.parentRef} onClick={this.parentClickFun}><div ref={this.childRef} onClick={this.childClickFun}>分析事件执行顺序</div></div>)	}
}
export default App;

输出顺序为:

原生事件:子元素DOM事件监听!
原生事件:父元素DOM事件监听!
React事件:子元素事件监听!
React事件:父元素事件监听!
原生事件:document DOM事件监听!

可以得出以下结论:

  • React所有事件都挂载在document对象上
  • 当真实DOM元素触发事件,会冒泡到document对象后,再处理React事件
  • 所以会先执行原生事件,然后处理React事件

所以想要阻止不同时间段的冒泡行为,对应使用不同的方法,对应如下:

  • 阻止合成事件间的冒泡,用e.stopPropagation()
  • 阻止合成事件与外层document上的事件冒泡,用e.nativeEvent.stopImmediatePropagation()
  • 阻止合成事件与最外层document上的原生事件上的冒泡,通过判断e.target来避免
document.body.addEventListener("click",e=>{if(e.target && e.target.matches('div.code')){return;}this.setState({active:false});
})

总结

React事件机制总结如下:

  • React上注册的事件最终会绑定在document这个DOM上,而不是React组件对应的DOM(减少内存开销就是因为所有的事件都绑定在document上,其他节点没有绑定事件)
  • React自身实现了一套事件冒泡机制,所以这也就是为什么我们event.stopPropagation()无效的原因。
  • React通过队列的形式,从触发的塑胶向父组件回溯,然后调用他们JSX中定义的callback
  • React有一套自己的合成事件 SyntheticEvent

React事件绑定的方式有那些?区别?

是什么

在React应用中,事件名都是用小驼峰格式进行书写,例如onclick要改写成onClick最简单的事件绑定如下:

class ShowAlert extends React.Component{showAlert(){console.log("Hi");}render(){return <button onClick={this.showAlert}>show</button>;}
}

从上面可以看到,事件绑定的方法要使用{}包住
上述的代码看似没问题,但是当处理函数输出代码换成console.log(this)的时候,点击按钮,则会发现控制台输出undefined

如何绑定

为了解决上面正确输出this的问题,常见的绑定方式有如下:

  • render方法中使用bind
  • render方法中使用箭头函数
  • constructcx中bind
  • 定义阶段使用箭头函数绑定

render方法中使用bind

如果使用一个类组件,在其中给某个组件/元素一个onClick属性,它现在并会自定绑定其this到当前组件,解决这个问题的方法是在事件函数后使用.bind(this)将this绑定到当前组件中

class App extends React.Component{handleClick(){console.log('this >',this);}render(){return {<div onClick={this.handleClick.bind(this)}>test</div>}}
}

这种方式在组件每次render渲染的时候,都会重新进行bind的操作,影响性能

render方法中使用箭头函数

通过ES6的上下文来将this的指向绑定给当前组件,同样再每一次render的时候都会生成新的方法,影响性能

class App extends React.Component{handleClick(){console.log('this >',this);}render(){return (<div onClick={e => this.handleClick(e)}>test</div>)}
}

constructor中bind

再construct中预先bind当前组件,可以避免再render操作中重复绑定

class App extends React.Component{constructor(props){supper(props);this.handleClick = this.handleClick.bind(this);}handleClick(){console.log('this >',this)}render(){return (<div onClick={this.handleClick}>test</div>)}
}

定义阶段使用箭头函数绑定

跟上述方式三一样,能够避免在render操作中重复绑定,实现也非常的简单,如下:

class App extends React.Component{constructor(props){super(props);}handleClick = () => {console.log('this >',this);}render(){return (<div onClick={this.handleClick}>test</div>)}
}

区别

上述四种方法的方法,区别主要如下:

  • 编写方面:方式一,方式二写法简单,方式三的编写过于冗杂
  • 性能方面:方式一方式二在每次组件render的时候会生成新的方法实例,性能问题欠缺,若该函数作为属性值传递给子组件的时候,都会导致额外的渲染,而方式三,方式四只会生成一个方法实力

综合上述,方式四是最优的事件绑定方式

React构建组件的方法有那些,区别

是什么

组件就是把图形,非图形的各种逻辑均抽象为一个统一的概念(组件)来实现开发的模式
在React中,一个类,一个函数都可以视为一个组件

  • 降低整个系统的耦合度,在保持接口不变的情况下,我们可以替换不同的组件快速完成需求。例如输入框,可以替换为日历,时间,范围等组件作具体的实现
  • 调试方便,由于整个系统是通过组件组合起来的,在出现问题的时候,可以用排除法直接移除组件,或者根据报错的组件快速定位问题,之所以能够快速定位,是因为每个组件之间低耦合,职责单一,所以逻辑会比分析整个系统要简单
  • 提高可维护性,由于每个组件的职责单一,并且组件在系统中是被复用的,所以对代码进行优化可获得系统的整体升级

如何构建

在 React目前来讲,组件的创建分成了三种方式:

  • 函数式创建
  • 通过React.createClass 方式创建
  • 继承 React.Component 创建

函数式创建

在 React Hooks出来之前,函数式组件可以视为无状态组件,只负责根据传入的props来展示视图,不涉及对state状态的操作
大多数组件可以写成无状态组件,通过简单组合构建其他组件
在React中,通过函数简单创建组件的示例如下:

function HelloComponent(props,/* context */){return <div>Hello {props.name}</div>
}

通过React.createClass 方法创建

React.createClass 是react刚开始推荐的创建组件的方式,目前这种创建方式已经不怎么用了,像上述通过函数式创建的方式,最终会通过Babel转化成React.createClass这中形式,转化如下:

function HelloComponent(props)/* context */{return React.createElement("div",null,"Hello ",props.name)
}

由于上述的编写方式过于冗余,目前基本上使用不上

继承React.Component创建

同样在react hooks出来之前,有状态的组件只能通过继承React.Component这种形式进行创建有状态的组件也就是组件内部存在维护的数据,在类创建的方式中通过this.state进行访问当调用this.setState修改组件的状态时,组件会再次调用render()方法进行重新渲染通过继承React.Component创建一个时钟实例如下:

class Timer extends React.Component{constructor(props){super(props);this.state = { seconds:0 };}tick(){this.setState(state=>({seconds:state.seconds+1}));}componentDidMount(){this.interval = setInterval(() => this.tick(),1000);}componentWillUnmount(){clearInterval(this.interval);}render(){return (<div>Seconds:{this.state.seconds}</div>)}
}

区别

由于React.createClass创建的方式过于冗余,并不建议使用,而像函数式创建和类组件创建的区别主要在于需要创建的组件是否需要为有状态组件:

  • 对于一些无状态的组件创建,建议使用函数式创建的方式
  • 由于react hooks的出现,函数式组件创建的组件通过使用hooks方法也能使之成为有状态组件,再加上目前推崇函数式编程,所以这里建议使用函数式的方式来创建组件

在考虑组件的选择原则上,能用无状态组件则用无状态组件

说说react中引入css的方式有哪几种?区别?

是什么

组件式开发选择合适的css解决方案尤为重要
通常会遵循以下规则

  • 可以编写局部css,不会随意污染其他组件内的原生;
  • 可以编写动态的css,可以获取当前组件的一些状态,根据状态的变化生成不同的css样式;
  • 支持所有的css特性,伪类,动画,媒体查询等;
  • 编写起来简洁方便,最好符合一贯的css风格特点

在一方面,vue使用css起来更为简洁:

  • 通过style标签编写样式
  • scoped属性决定编写的样式是否局部有效
  • lang属性设置预处理器
  • 内联样式风格的方法来跟根据最新状态设置和改变css
    而在React中,引入css就不如vue方便简洁,其引入css的方式有很多,各有利弊

方式

常见的css引入方式有以下:

  • 在组件内直接使用
  • 组件中引入.css文件
  • 组件中引入.module.css文件
  • CSS in JS

在组件内直接使用

直接在组件中书写css样式,通过style属性直接引入,如下:

import React,{ Component } from "react";
const div1 = {width:"300px",margin:"30px auto",backgroundColor:"#44014C", // 驼峰法minHeight:"200px",boxSizing:"border-box"
};
class Test extends Component {constructor(props,context){super(props);}render(){return (<div><div style={div1}>123</div><div style={{backgroundColor:"red"}} ></div>);}
}export default Test;

上面可以看到,css属性需要转换成驼峰写法
这种方式优点:

  • 内联样式,样式之间不会有冲突
  • 可以动态获取当前state中的状态
    缺点:
  • 写法上都需要使用驼峰标识
  • 某些样式没有提示
  • 大量的样式,代码混乱
  • 某些样式无法编写(比如伪类/伪元素)

组件中引入css文件

将css单独写在css文件中,然后在组件中直接引入

App.css文件:

.title{color:red;font-size:20px;
}
.desc{color:green;text-decoration:underline;
}

组件中引入:

import React,{ PureComponent } from 'react';
import Home from './Home';
import './App.css';export default class App extends PureComponent{render(){return (<div className="app"><h2 className="title">我是App的标题</h2><p className="desc">我是App中的一段文字描述</p></div>)}
}

这种方式存在不好的地方在于样式是全局生效,样式之间会相互影响

组件中引入.module.css文件

将css文件作为一个模块引入,这个模块中的所有css,只作用于当前组件,不会影响当前组件的后代组件
这种方式是webpack特工的方案,只要配置webpack配置文件中modules:true即可

import React,{ PureComponent } from 'react';
import Home from './Home';
import './App.module.css';export default class App extends PureComponent{render(){return (<div className="app"><h2 className="title">我是App的标题</h2><p className="desc">我是App中的一段文字描述</p></div>)}
}

这种方式能够解决局部作用域问题,但也有一定的缺陷:

  • 引用的类名,不能使用连接符(.xxx-xx),在JavaScript中是不识别的
  • 所有的className都必须使用(style.className)的形式来编写
  • 不方便动态来修改某些样式,依然需要使用内联的方式;

CSS in JS

CSS-in-JS,是指一种模式,其中CSS由JavaScript生成而不是在外部文件中定义此功能并不是React的一部分,而是由第三方库提供,例如:

  • styled-components
  • emotion
  • glamorous
    下面主要看看styled-components的基本使用

本质是通过函数的调用,最终创建出一个组件:

  • 这个组件会被自动添加上一个不重复的class
  • styled-components会给该class添加相关的样式
    基本使用如下:
    创建一个style.js文件用于存放样式组件:
export const SelfLink = styled.div`
height:50px;
border:1px solid red;
color:yellow;
`;
export const selfButton = styled.div`
height:150px;
width:150px;
color:${props => props.color};
background-image:url(${props=>props.src});
background-size:150px 150px;
`

引入样式组件也很简单:

import React,{ Component } from "react";
import { SelfLink,SelfButton } from "./style";class Test extends Componet{constructor(props,context){super(props);}render(){return (<div><SelfLink title="People's Republic of China">app.js</SelfLink><SelfButton color="palevioletred" style={{color:"pink"}} src={{fist}}>SelfButton</SelfButton></div>);}
}export default Test;

区别

通过上面四种样式的引入,可以看到:

  • 在组件内部使用css该方式编写方便,容易能够根据状态修改样式属性,但是大量的颜色编写容易导致代码混乱
  • 组件中引入.css文件符合我们日常的编写习惯,但是作用域是全局的,样式直接会层叠
  • 引入.module.css文件能够解决局部作用域问题,但是不方便动态修改样式,需要使用内联的方式进行样式的编写
  • 通过css in js这种方法,可以满足大部分场景的应用,可以类似于预处理器一样样式嵌套,定义,修改状态等

至于使用React用哪种方案引入css,并没有一个绝对的答案,可以根据各自情况选择合适的方案

说说React生命周期有那些不同阶段?每个阶段对应的方法是?

是什么

生命周期(Life Cycle) 的概念应用很广泛,特别是在经济,环境技术,社会等诸多领域经常出现,其基本含义可以通俗的理解为“从摇篮到坟墓”(Cradle-to-Grave)的过程跟Vue一样,React整个组件生命周期包括从创建,初始化数据,编译模版,挂载Dom->渲染,更新->渲染,卸载等一系列过程

流程

这里主要讲述React16.4之后的生命周期,可以分成三个阶段:

  • 创建阶段
  • 更新阶段
  • 卸载阶段

创建阶段

创建阶段主要分成了以下几个生命周期的方法:

  • constructor
  • getDerivedStateFromProps
  • render
  • componentDidMount
contructor

实例过程中自动调用的方法,在方法内部通过super关键字获取来自父组件的props在该方法中,通常的操作为初始化state状态或者在this上挂载方法

componentDidMount

该方法是新增的生命周期方法,是一个静态的方法,因此不能访问到组件的实例执行时机:组件创建和更新阶段,不论是props变化还是state变化,也会调用在每次 render 方法前调用,第一个参数为即将更新的 props ,第二个参数为上一个状态的 state,可以比较props 和 state 来加一些限制条件,防止无用的state更新该方法需要返回一个新的对象作为新的 state 或者返回 null 表示 state 状态不需要更新

render

类组件必须实现方法,用于渲染DOM结构,可以访问组件state与prop属性
注意:不要在render里面setState,否则会触发死循环导致内存崩溃

componentDidMount

组件挂载到真实DOM节点后执行,其在render方法之后执行
此方法多用于执行一些数据获取,事件监听等操作

更新阶段

该阶段的函数主要为如下方法:

  • getDerivedStateFromProps
  • shouldComponentUpdate
  • render
  • getSnapshotBoforeUpdate
  • componentDidUpdate
getDerivedStateFormProps

该方法介绍同上

shouldComponentUpdate

用于告知组件本身基于当前的 props 和 state 是否需要重新渲染组件,默认情况返回 true执行时机:到新的props或者state时都会调用,通过返回true或者false告知组件更新与否一般情况,不建议在该周期方法中进行深层比较,会影效率同时也不能调用 setState,否则会导致无限循环调用更新

render

介绍同上

getSnapshotBeforeUpdate

该周期函数在 render 后执行,执行之时D0M 元豪还没有被更新该方法返回的一个 5napshot值,作为componentDidUpdate 第三个参数传入

getSnapshotBeforeUpdate(prevProps,prevstate){console.log( '#enter getSnapshotBeforeUpdate');return 'foo';
}
componentDidUpdate(prevProps,prevState,snapshot){console.log( '#enter componentDidUpdate snapshot =',snapshot);
}

此方法的目的在于获取组件更新前的一些信息,比如组件的滚动位置之类的,在组件更新后可以根据这些信息恢复一些UI视觉上的状态

componentDidUpdate

执行时机:组件更新结束后触发
在该方法中,可以根据前后的props和state的变化做出相应的操作,如获取数据,修改DOM样式等

卸载阶段

componentWillUnmount

此方法用于组件卸载前,清理一些注册是监听时间,或者取消订阅的网络请求等,一旦一个组件实例被卸载,其不会被再次挂载,而只可能是被重新创建

总结

通过两个图的对比,可以发现新版的生命周期减少了以下三种方法:

  • componentWillMount
  • componentWillReceiveProps
  • componentWillUpdate

其实这三个方法仍然存在,只是在前者加上了 UNSAFE_的前缀,如 UNSAFE_componentWillMount ,并不像字面意思那样表示不安全,而是表示这些生命周期的代码可能在未来的 react 版本可能度除

同时也新增了两个生命周期函数:

  • getDerivedStateFromProps
  • getSnapshotBeforeUpdate

感谢大家观看,我们下次见

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/34523.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何实现CloudFlare免费内网穿透?

有时候我们可能需要用到内网穿透技术,将本机的资源开放到网络上供人访问! 但是有时候我们只需要将一个项目开放的时候,使用frp就有点不划算了,特别是近几年服务器的价格水涨船高,要知道使用frp需要一台服务器和一个域名才可以的,这不今天就告诉大家一个用cloudflare实现…

Python web 开发 flask 实践

1、前言 前文已经介绍了很多关于 python 的算法和脚本的写法&#xff0c;在本文将开启python的 web 的开发&#xff0c;和java 类似的&#xff0c;对于 web 开发也需要引入框架&#xff0c;对于 python 的 web 开发来说常见的有 flask 和 django 两种&#xff0c;在本文中将要…

vscode用vue框架1写一个登陆页面

目录 一、创建登录页面 二、构建好登陆页面的路由 三、编写登录页代码 1.添加基础结构 2.给登录页添加背景 3.解决填充不满问题 4.我们把背景的红颜色替换成背景图&#xff1a; 5.在页面中央添加一个卡片来显示登录页面 6.设置中间卡片页面的左侧 7.设置右侧的样式及…

华芯微特SWM34-使用定时器捕获快速解码EV1527编码

在无线应用领域&#xff0c;很多433Mhz和315Mhz的遥控器&#xff0c;红外探测器&#xff0c;门磁报警器&#xff0c;无线门铃等都使用EV1527编码格式来发射数据。发射和接收均有对应的RF芯片完成&#xff0c;而且成本极低&#xff08;目前市场价3毛钱不到&#xff09;。接收芯片…

复分析——第7章——ζ 函数和素数定理(E.M. Stein R. Shakarchi)

第7章 ζ函数和素数定理 Bernhard Riemann, whose extraordinary intuitive powers we have already mentioned, has especially renovated our knowledge of the distribution of prime numbers, also one of the most mysterious questions in mathematics. He has tau…

《中国尘肺病农民工调查报告(2023)》

这份报告由中华社会救助基金会大爱清尘基金发布。 《中国尘肺病农民工调查报告(2023)》是一份深入探讨中国尘肺病农民工现状与挑战的研究报告。报告不仅详细记录了尘肺病患者的生存困境、经济与医疗状况,还对政策的实施效果进行了评估,并提出了针对性的建议。通过对不同地区、…

Vitis Accelerated Libraries 学习笔记--Vision 库介绍

目录 1. 简介 2. 分类介绍 2.1 图像容器 2.2 图像处理基础 2.3 图像滤波和平滑 2.4 图像变换和增强 2.5 图像分析和特征检测 2.6 数学和算术操作 2.7 图像校正和优化 2.8 颜色和阈值处理 2.9 高级图像处理 2.10 光流和运动估计 2.11 图像转换和映射 2.12 其他特殊…

docker camunda 8.5 部署步骤

Camunda Platform 8 环境准备 Docker 版本要求 Docker 20.10.16 is required; docker compose version 1.27.0.;github 开源地址:https://github.com/camunda/camunda-platformcamunda7 文档地址:https://docs.camunda.org/manual/7.21/user-guide/process-engine/社区地址: …

Android Media Framework(八)OMXNodeInstance - Ⅰ

OpenMAX框架的学习有两大难点&#xff0c;一是组件的状态切换与buffer的流转过程&#xff0c;这部分内容我们已经在IL Spec中学习过了&#xff1b;二是OMX组件使用的buffer类型与buffer分配过程&#xff0c;这一节我们来重点剖析OMX组件使用的buffer类型。 1、引言 在实际应用…

业务架构交付物

背景 业务的核心元素、扩展元素以及它们的协同关系&#xff0c;业务架构和其他架构的关系等等已经有了不少认识&#xff0c;那么&#xff0c;通过对业务架构的还原和分析&#xff0c;到底能够得到什么业务架构的内容呢&#xff1f;它可以是一套流程框架体系&#xff0c;也可以…

探索约束LLM输出JSON的应用

0、 引言 JSON&#xff08;JavaScript Object Notation&#xff09;因其简洁、易读和易于解析的特性&#xff0c;已成为全球使用最广泛的数据交换格式之一。它能够满足各种数据交换需求&#xff0c;特别是在构建人工智能驱动的应用程序时&#xff0c;工程师们经常需要将大型语…

深度学习工具|LabelImg(标注工具)的安装与使用教程

1 简介 Label是一款免费的图像标注软件&#xff0c;可以以矩形框的形式对图像中的物体进行标记&#xff0c;常用于分类和目标检测。并可以将标记信息保存为PasclVOC&#xff08;xml&#xff09;、YOLO&#xff08;txt&#xff09;、CreateML&#xff08;json&#xff09;格式。…

Python中对含有转义字符的变量,如何处理

file_path C:\Users\EDY\PJ-IPAStudio\designer\project 这是一个路径的字符串&#xff0c;要访问这个路径下的文件&#xff0c;是会报错的 file_path rC:\Users\EDY\PJ-IPAStudio\designer\project 需要在前面添加 r 如果他是一个变量&#xff0c;如何对变量里的字符修改呢&…

0802功放2

功放要记一般的式子&#xff0c;而非最大的式子&#xff0c;因为总不能总开到最大音量上工作&#xff0c;而是在比较合适的音量上工作 运放的最大电压也是比电源低1~2V 饱和三极管的功率&#xff0c;电流越大&#xff0c;饱和压降越大&#xff1f;&#xff1f;&#xff1f;不…

C++青少年简明教程目录

C青少年简明教程目录 学习编程语言时&#xff0c;会遇到“开头难”和“深入难”的问题&#xff0c;这是许多编程学习者都会经历的普遍现象。这些问题并不是无法克服的&#xff0c;通过选择适合的教程、多做练习&#xff0c;可以逐步克服这些困难。根据我的学习和辅导经验&…

STM32G474的浮点数四则运算速度实测

一、FPU的启用 FPU 即浮点运算单元&#xff08;Float Point Unit&#xff09;。浮点运算&#xff0c;对于定点 CPU&#xff08;没有 FPU 的 CPU&#xff09;来说必须要按照 IEEE-754 标准的算法来完成运算&#xff0c;是相当耗费时间的。而对于有 FPU 的 CPU来说&#xff0c;浮…

oracle 窗口函数使用

Oracle 数据库中的窗口函数&#xff08;也称为分析函数或OLAP函数&#xff09;允许您对一组相关的行执行计算&#xff0c;而不是只针对单行。这些函数在数据分析中特别有用&#xff0c;因为它们允许您执行诸如计算移动平均值、累积总和、百分比排名等操作。 以下是一些常用的 …

关于区间预测在医学预测模型中应用的一点思考

区间预测在医学预测模型中的应用 什么是区间预测 区间预测是指在给出确切预测值的同时&#xff0c;还提供预测值的可能范围&#xff0c;称为预测区间。与置信区间是不同的概念。区间预测主要用于结局是连续变量的情况&#xff0c;例如预测房价或股票价格。通过提供一个范围&…

【Golang】Steam 创意工坊 Mod 文件夹批量重命名

本文将介绍一个使用Go语言编写的脚本&#xff0c;其主要功能是解析XML文件并基于解析结果重命名文件夹。这个脚本适用于需要对文件夹进行批量重命名&#xff0c;并且重命名规则依赖于XML文件内容的情况。 脚本功能概述 Steam创意工坊下载的Mod文件夹批量重命名为id名称 运行前…

Linux文件权限相关命令

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…