vue常见题型(1-10)

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档

文章目录

  • 2.2双向绑定的原理是什么
    • vue框架采用的是数据双向绑定的方式,由三个重要部分构成
      • 2.2.1.ViewModel
      • 2.2.2 双向绑定
        • 2.2.3.1.编译`Compile`
        • 2.2.3.2.依赖收集
  • 3.组件通信方式
    • 3.1概念
    • 3.2解决了什么
    • 3.3分类
    • 3.4方案
      • 3.4.1.props
      • 3.4.2.$emit 触发自定义事件
      • 3.4.3.ref
      • 3.4.4.EventBus
      • 3.4.5.provide和inject
      • 3.4.6.vuex
    • 3.5.小结
  • 4.data属性是一个函数和是一个对象的区别?
    • 4.1.实例和组件定义data的区别
    • 4.2.区别
    • 4.3.结论
  • 5.动态给vue的data添加一个新的属性时会发生什么?怎样解决
    • 5.1.直接添加属性
    • 5.2分析
    • 5.3.解决方法
      • 5.3.1.Vue.set()
      • 5.3.2.Object.assign()
      • 5.3.3.$forceUpdate
    • 5.4.小结
  • 6.v-if和v-for的优先级
    • 6.1.作用
    • 6.2.优先级
      • 6.2.1.示例
    • 6.3.注意事项
  • 7.v-show和v-if区别?使用场景
    • 7.1.共同点
    • 7.2.区别
    • 7.3.原理分析
      • 7.3.1.v-show
      • 7.3.2.v-if
    • 7.4.使用场景
  • 8.vue中的key
      • 8.1.1.背后的事情
    • 8.2.设置key与不设置key区别
      • 8.2.1.设置key值一定能提高diff效率吗
  • 9.常用的修饰符
    • 9.1.定义
    • 9.2.作用
      • 9.2.1.表单修饰符
        • 9.2.1.1.lazy
        • 9.2.1.2.trim
        • 9.2.1.3.number
      • 9.2.2.事件修饰符
        • 9.2.2.1.stop
        • 9.2.2.2.prevent
        • 9.2.2.3.self
        • 9.2.2.4.once
        • 9.2.2.5.capture
        • 9.2.2.6.passive
        • 9.2.2.7.native
        • 10.2.3.鼠标按钮修饰符
        • 10.2.4.键盘修饰符
        • 10.2.5.v-bind修饰符
          • 10.2.5.1.async
          • 10.2.5.2.props


2.2双向绑定的原理是什么

vue框架采用的是数据双向绑定的方式,由三个重要部分构成

  • 数据层(Model):应用的数据及业务逻辑
  • 视图层(View):应用的展示效果,ui组件
  • 业务处理层(ViewModel):框架封装的核心,负责将数据与视图关联起来,这个分层的方案,有一个专业术语MVVM这里控制的核心功能便是数据双向绑定

2.2.1.ViewModel

主要职责:

  • 🍕🍕🍕数据变化后更新视图
  • 视图变化后更新数据
    还有两个主要部分
  • 监听器(Observer):对所有数据的属性进行监听
  • 解析器(Compiler):对每个元素节点的指令进行扫描和解析,根据指令模板替换数据,以及绑定相应的更新函数

2.2.2 双向绑定

vue中的双向绑定的流程:

  • 🚜🚜🚜new Vue()首先执行初始化,对data执行响应化处理,这个过程发生在Observe中
  • 对模板执行编译,找到其中动态绑定的数据,从data中获取并初始化视图,发生在Compile中
  • 定义一个更新函数和Watcher,将来对应数据变化时Watcher会调用更新函数
  • 由于data的某个key在一个视图中可能出现多次,所有每个key都需要一个管家Dep来管理多个Watcher
  • 将来data中数据一旦发生变化,会首先找到对应的Dep,通知所有Watcher执行更新函数
    http://cmsadm.caidao8.com/electricityTax/showInstruction.hx?uuid=5c81c7c0e8ba4a078d4c32e811fab932
2.2.3.1.编译Compile
  • 🤣🤣🤣对每个元素节点的指令进行扫描和解析,根据指令模板替换数据,以及绑定相应的更新函数

在这里插入图片描述

2.2.3.2.依赖收集

data中的某个key,同一个key可能出现多次,每次都需要收集出来用一个watcher来维护他们,此过程称为依赖收集,多个watcher需要一个Dep来管理,需要更新时由Dep统一通知
在这里插入图片描述

3.组件通信方式

3.1概念

  • 🧨🧨🧨组件
  • 通信
    组件是框架最强大的功能之一,每一个.vue结尾的文件都可以称为一个组件。
    通信指的是发送者通过某种格式来传递信息到接收者以达到某个目的。
    广义上,任何信息的传递都是组件间通信。通过一种方式来传递信息以达到某个目的。

3.2解决了什么

🚕🚕🚕通信的本质是信息同步共享,框架中,每个组件之间都有独自的作用域,组件之间的数据是无法共享的。但由于开发中需要让组件之间共享数据,这样通过组件通信就可以实现同步。

3.3分类

  • 父子组件之间
  • 兄弟组件之间
  • 祖孙与后代
  • 非关系组件之间

3.4方案

🍕🍕🍕常规通信方案

  • props
  • $emit触发自定义事件
  • ref
  • EventBus
  • Provide与Inject
  • Vuex

3.4.1.props

在这里插入图片描述

  • 适用场景:父->子
  • 子组件设置props属性,用来接收父组件传递的参数
  • 父组件在使用子组件标签中通过字面量来传递值
    Children.vue
props:{//字符串形式name:String,age:{type:Number,default:19,require:true }
}

Father.vue

<Children name='' age = 19 />

3.4.2.$emit 触发自定义事件

  • 适用场景:子组件传递给父组件
  • 子组件通过$emit触发自定义事件,第二个参数为传递的数据
  • 父组件绑定监听器获取到子组件传递过来的数据
    Children.vue
methods:{sendData(){this.$emit('add',info) }
}

Father.vue

<Children @add="children($event)" />

3.4.3.ref

  • 🌮🌮🌮父组件在使用子组件的时候设置ref
  • 父组件通过设置子组件 ref来获取数据
    父组件
<Children ref="foo" />
//获取子组件实例方法,就能获取到对应数据
this.$refs.foo

3.4.4.EventBus

  • 🚜🚜🚜兄弟组件传值
  • 创建一个中央事件总线EventBus
  • 兄弟组件通过$emit触发自定义事件,$emit第二个参数为传递的数值
  • 另一个兄弟组件通过$on监听自定义事件
//main.js
Vue.prototype.$bus = new Vue()

Children1.vue

this.$bus.$emit('foo')

Children2.vue

this.$bus.$on('foo',this.nameData)

3.4.5.provide和inject

  • 在祖先组件定义provide属性,返回传递的值
  • 在后代组件通过inject接收组件传递过来的值
    祖先组件
provide(){return{foo:'foo' }
}

后代组件

inject:['foo'] //获取到祖先组件传递过来的值

3.4.6.vuex

  • 🥟🥟🥟复杂关系的组件数据传递
  • vuex相当于一个用来存储共享变量的容器
    在这里插入图片描述
  • state用来存放共享变量
  • getter,可以增加一个getter派生状态,(相当于store中的计算属性),用来获得共享变量的值
  • mutations用来存放修改state的方法
  • actions也是用来存放修改state的方法,不过action是在mutations的基础上进行。常用来做一些异步操作

3.5.小结

  • 🌭🌭🌭父子关系选择propsref
  • 🥟🥟🥟兄弟关系选择$bus
  • 🌮🌮🌮祖先与后代选择ProvideInject
  • 🍕🍕🍕复杂关系选择vuex存放共享的数据变量

4.data属性是一个函数和是一个对象的区别?

4.1.实例和组件定义data的区别

vue实例的时候定义data属性即可以是一个对象,也可以是一个函数

const app = new Vue({el:"#app",//对象格式data:{foo:"foo"  },//函数格式data(){return{foo:"foo" } }
})

组件中定义data属性,只能是一个函数
如果定义为一个对象

Vue.component('component1',{template:`<div>组件</div>`,data:{foo:'foo' }
})

则会得到警告信息,返回的data应该是一个函数

4.2.区别

function Component(){}
Component.prototype.data = {count:0
}

创建两个组件实例

const componentA = new Component()
const componentB = new Component()
//修改`componentA`组件`data`属性的值,`componentB`中的值也发生了变化
console.log(componentB.data.count)//0
componentA.data.count = 1
console.log(componentB.data.count)//1
//因为共用了一个内存地址

采用函数的形式,则不会有影响(函数返回的对象内存地址并不相同)

function Component(){this.data = this.data()
}
Component.prototype.data = function(){return {count:0 }
}
//修改`componentA`组件`data`属性的值,`componentB`中的值不受影响
console.log(componentB.data.count)//0
componentA.data.count = 1
console.log(componentB.data.count)//1

4.3.结论

  • 🍔🍔🍔根实例对象data可以是对象也可以是函数(根实例时单例),不会产生数据污染情况。
  • 组件实例对象data必须是函数,目的是为防止多个组件实例对象之间共用一个data,会产生数据污染。采用函数的形式,initData时会将其作为工厂函数都会返回全新的data对象

5.动态给vue的data添加一个新的属性时会发生什么?怎样解决

5.1.直接添加属性

从一个例子开始,定义一个p标签,通过v-for遍历
然后,给button绑定点击事件,预期点击按钮时,数据新增一个属性,界面新增一行

<p v-for="(value,key) in item" :key="key">{{value}}</p>
<button @click="addProperty">动态添加新属性</button>

实例化一个实例,定义data属性和methods方法

const app = new Vue({el:"#app",data:()=>{item:{oldProperty:"旧属性" } },methods:{addProperty(){this.item.newProperty = "新属性" //添加console.log(this.item);//输出 }}
})

触发按钮,发现数据更新了,但页面没有更新

5.2分析

vue2是用Object.defineProperty实现的数据响应式

const obj = {};
Object.defineProperty(obj,'foo',{get(){console.log(`get foo:${val}`)return val;},set(newVal){if(newVal !== val){console.log(`set foo:${newVal}`)val = newVal }}
})

🍕🍕🍕当访问foo属性或者设置foo值的时候都能够触发settergetter

obj.foo
obj.foo = 'new'

🍔🍔🍔当为obj添加新属性时,却无法触发事件属性的拦截

obj.newPro = '新属性' 

🍟🍟🍟一开始objfoo属性被设定成响应式数据,而newPro是后面新增的属性,并没有通过Object.defineProperty设置成响应式数据

5.3.解决方法

🍳Vue不允许在已经创建的实例上动态添加新的响应式属性,若想实现数据与视图同步更新,以下三种方式

  • Vue.set()
  • Object.assign()
  • $forceUpdated()

5.3.1.Vue.set()

🧀Vue.set(target,propertyName/index,value)

  • {Object | Array} target
  • { string | number } propertyName/index
  • { any } value
    🧨返回值:设置的值
    🌮通过Vue.set向响应式对象中添加一个property,并确定这个新property同样是响应式的,且触发视图更新。其内部是调用defineReactive方法,通过Object.difineProperty实现属性拦截

5.3.2.Object.assign()

🍿直接使用Object.assign()添加到对象的新属性不会触发更新,应创建一个新的对象,合并原对象和混入对象的属性

this.someObject = Object.assign({},this.someObject,{newProperty1:1,newProperty2:2})

5.3.3.$forceUpdate

🚓如果需要在vue中做一次强制更新,99.9%的情况,是在某个地方做了错误的写法,迫使实例重新渲染。仅仅影响实例本身和插入插槽内容的子组件,而不是所有子组件。

5.4.小结

  • 如果添加少量的新属性,可以采用Vue.set()
  • 如果添加大量的新属性,采用Object.assign()创建新对象
  • (不建议)比较粗暴的方式$forceUpdate() 强制刷新
    🌭vue3proxy实现的数据响应式,添加新属性时可以实现数据响应式

6.v-if和v-for的优先级

6.1.作用

🐱‍🏍v-if指令用于条件性地渲染一块内容。指令表达式返回true时被渲染
v-for指令基于一个数组来渲染一个列表。需要使用item in data形式的特殊语法,其中data是源数据,而item是被迭代的数组元素的别名
🚗在v-for时,建议设置key值,并且保证每个key值是独一无二的,这便于diff算法进行优化

6.2.优先级

🍖v-ifv-for都是vue模板系统中的一个指令
在模板编译时,会将指令系统转化成可执行的render函数

6.2.1.示例

<div id="app"><p v-if="isShow" v-for="item in items">{{item.title}}</p>
</div>

🍟创建vue实例,存放isShowitems数据

const app = new Vue({el:"#app",data(){return{items:[{title:"foo"},{title:"更多"} ] } },computed:{isShow(){return this.items && this.items.length > 0 } }
})

🧇模板指令的代码都会生成在render函数中,通过app.$options.render就能得到渲染函数

f anonymous(){with(this){return _c('div',{attrs:{"id":"app"}},_l((items),function(item){return (isShow) ? _c("p",[_v("\n" + _s(item.title) + "\n")]) : _e() }),0)}
}

_l是vue的列表渲染函数,函数内部都会进行一次if判断
初步得到结论:v-for优先级是比v-if
🍖再将v-forv-if放到不同标签上

<div id="app"><template v-if="isShow"><p v-for="item in listData" :key="item.id">{{}}</p> </template>
</div>

再输出render函数

f anonymous(){with(this){return _c('div',{attrs:{"id":"app"}},[(isShow)?[_v("\n"),_l((items),function(item){return _c('p',[_v(_s(item.title))])})]:_e()],2)}
}

当作用在不同标签上时,是先进行判断,再进行列表的渲染。
在进行if判断时,v-for是比v-if先进行判断
最终结论:v-for优先级高于v-if

6.3.注意事项

🥞两个指令不要放在同一个元素上,带来性能方面的浪费。
外层嵌套template(页面渲染不生成dom节点),进行判断,在内部v-for循环
如果条件出现在内部,通过计算属性computed提前过滤掉不需要显式的项

computed:{listdata:function(){return this.list.filter(function(item){return item.isShow }) }
}

7.v-show和v-if区别?使用场景

7.1.共同点

🌮都能控制元素是否显式

7.2.区别

  • 控制手段不同
  • 编译过程不同
  • 编译条件不同
    🍿控制手段不同:v-show隐藏是为元素添加样式隐藏display:none,dom元素依旧还在。v-if显式隐藏是将dom整个添加或删除
    🧇编译过程不同:v-if切换有有一个局部编译/卸载的过程,切换过程中合适地销毁和重建内部的事件监听和子组件。v-show只是简单的基于css切换
    🧀编译条件:v-if是真正的条件渲染,它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。只有渲染条件为假时,并不做操作,直到为真才渲染。
    🌭性能消耗:v-if有更高的切换消耗;v-show有更高的初始渲染消耗;

7.3.原理分析

大概过程

  • 将模板template转为ast结构的js对象
  • ast得到的js对象拼装renderstaticRenderFns函数
  • renderstaticRenderFns函数被调用后生成虚拟VNODE节点,该节点包含创建DOM节点所需信息
  • vm.patch函数通过虚拟DOM算法利用VNODE节点创建真实DOM

7.3.1.v-show

🚓不管初始条件是什么,元素总是会被渲染

7.3.2.v-if

🥙v-if在实现上比v-show要复杂,因为还有else else-if等条件需要处理

7.4.使用场景

v-if相比v-show开销更大,如果需要频繁切换,使用v-show较合适,如果在运行时条件很少改变,使用v-if较合适

8.vue中的key

🚓在使用v-for时,需要给单元加上key
key是给每一个vnode的唯一id,也是diff的一种优化策略,可以根据key,更准确,更快的找到对应的vnode节点

8.1.1.背后的事情

  • 🎉如果不用key,Vue会采用就地原则,最小化element的移动,并且会尝试尽最大程度在同适当的地方对相同类型的element,做patch或者reuse
  • 🍟如果使用key,Vue会根据keys的顺序记录element,曾经拥有了key的element 如果不再出现的话,会被直接remove或destoryed
  • 用+new Date()生成的时间戳作为key,手动强制触发重新渲染
  • 当拥有新值的render作为key时,拥有了新key的comp出现了,那么旧key Comp会被移除,新 key Comp触发渲染

8.2.设置key与不设置key区别

🧨创建一个实例,2秒后往items插入数据

<body><div id="app"><p v-for="item in items" :key="item">{{item}}</p> </div><script>const app = new Vue({el:'#app',data:{items:['a','b','c','d']},mounted(){setTimeout(()=>{this.itmes.splice(2,0,'f')},2000) } }) </script>
</body>

🥪在不使用key时,
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

8.2.1.设置key值一定能提高diff效率吗

  • 🧀文档明确表示
    当用v-for正在更新已渲染过的元素列表时,它默认用"就地复用"策略。如果数据项的顺序被改变,vue将不会移动dom元素来匹配数据项的顺序,而是简单复用此处每个元素,并且确保它在特定索引下显示已渲染过的每个元素。
  • 🍗此默认的模式是高效的,只适用于不依赖子组件状态或临时dom状态(例如:表单输入值)的列表渲染输出
  • 🌭

9.常用的修饰符

9.1.定义

  • 🌮是用于限定类型以及类型成员的声明的一种符号
    处理了许多DOM事件的细节,不再需要花时间去处理零碎的事情,而能有更多的精力专注于程序的逻辑处理。
    分为以下五种:
  • 表单修饰符
  • 事件修饰符
  • 鼠标按键修饰符
  • 键值修饰符
  • v-bind修饰符

9.2.作用

9.2.1.表单修饰符

🌭在填写表单时用的最多的是input标签,指令用的最多的是v-model,关于表单的修饰符有

  • lazy
  • trim
  • number
9.2.1.1.lazy

🍿在填写完信息后,光标离开标签时,才会将值赋予给value,也就是在change事件之后之后再进行信息同步

<input type="text" v-model.lazy="value" />
<p>{{value}}</p>
9.2.1.2.trim

🧀自动过滤用户输入的首空格字符,而中间的空格不会过滤

<input type="text" v-model.trim="value" />
9.2.1.3.number

🍗自动将用户的输入值转为数值类型,但如果这个值无法被parseFloat解析,则会返回原来的值

<input v-model.number="age" type="number">

9.2.2.事件修饰符

🥪是对事件捕获以及目标进行了处理,有如下

  • stop
  • prevent
  • self
  • once
  • capture
  • passive
  • native
9.2.2.1.stop

🧨阻止事件冒泡,相当于调用event.stopPropagation方法

<div @click="shout(2)"><button @click.stop="shout(1)">ok</button>
</div>
9.2.2.2.prevent

🚗阻止默认行为,相当于event.preventDefault方法

<form v-on:submit.prevent="onSubmit"></form>
9.2.2.3.self

🎉只当在event.target是当前元素自身时触发处理函数

<div v-on:click.self="">...</div>

🍕顺序很重要;相应的代码会以同样的顺序产生。用v-on:click.prevent.self会阻止所有的点击。而v-on:click.self.prevent 只会阻止对元素自身的点击

9.2.2.4.once

🚓绑定了事件,只能触发一次,第二次就不会触发

<button @click.once="add(1)">ok</button>
9.2.2.5.capture

🍚使事件触发从包含这个元素的顶层开始往下触发

<div @click.capture="add(1)">
obj1
<div @click.capture="add(2)">
obj2
<div @click="add(3)">
obj3
<div @click="add(4)">
obj4</div>
</div>
</div>
</div>
9.2.2.6.passive

🍔在移动端,当监听元素滚动事件时,会一直触发onscroll事件会让网页变卡,因此使用时,相当于给onscroll事件加了一个.lazy修饰符

//滚动事件的默认行为将会立即触发,而不会等待`onScroll`完成,其中包括`event.preventDefault()`的情况
<div v-on:scroll.passive="onScroll"></div>

🥫 .passiveprevent不能一起使用,因为.prevent将会被忽略,同时浏览器会展示一个警告

9.2.2.7.native

🥞让组件变成像html内置标签那样监听根元素的原生事件,否则组件上使用v-on只会监听自定义事件

<chrildren-component v-on:click.native="add" />

注意:使用native修饰符来操作普通html标签是会令事件失效。

10.2.3.鼠标按钮修饰符

🍔鼠标按钮修饰符针对的就是左键、右键、中键点击

  • left左键
  • middle中键
  • right右键
<button @click.left="add(1)">ok</button>
<button @click.right="add(2)"></button>
10.2.4.键盘修饰符

🍚键盘事件(onkeyup,onkeydown),keyCode有很多,但vue为我们提供了很多别名,分为以下两种

  • 普通键(enter、tab、delete、space、esc、)
  • 系统修饰键(ctrl、alt、meta、shift...)
//只有按键为keyCode的时候才触发
<input type="text" @keyup.keyCode="add()">

还可以通过以下方式自定义一些全局的键盘吗别名

Vue.config.keyCodes.f2 = 113
10.2.5.v-bind修饰符

🚓为属性进行操作,

  • async
  • prop
  • camel
10.2.5.1.async

🥪能对props进行一个双向绑定

//父组件
<component :myMessage.sync="bar"></component>
//子组件
this.$emit('update:myMessage',params)

以上方式相当于以下的简写

<component :myMessage="bar" @update:myMessage="add"></component>
<script>
add(e){this.bar = e
}
</script>
<!--子组件-->
<script>
func(){this.$emit('update:myMessage',data)
}
</script>

🍞使用sync需要注意以下:

  • 使用async的时候,子组件传递的事件名称格式必须为update:value,其中value必须与子组件中props中声明的名称完全一致
  • 注意带有.async修饰符的v-bind不能和表达式一起使用
  • v-bind.sync用在一个字面量的对象上,例如v-bind.sync="{title:doc.title}",是无法正常工作的。
10.2.5.2.props

🍿设置自定义标签属性,避免暴露数据,防止污染HTML结构

<input id="uid" title="title1" value="1" :index.prop="index">

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

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

相关文章

论文阅读:人工智能赋能源网荷储协同互动的应用及展望

论文阅读&#xff1a;人工智能赋能源网荷储协同互动的应用及展望 [1]王继业.人工智能赋能源网荷储协同互动的应用及展望[J].中国电机工程学报,2022,42(21):7667-7682.DOI:10.13334/j.0258-8013.pcsee.220538. 文章目录 论文阅读&#xff1a;人工智能赋能源网荷储协同互动的应用…

虚幻引擎5(UE5)学习教程

虚幻引擎5&#xff08;UE5&#xff09;学习教程 引言 虚幻引擎5&#xff08;Unreal Engine 5&#xff0c;简称UE5&#xff09;是Epic Games开发的一款强大的游戏引擎&#xff0c;广泛应用于游戏开发、影视制作、建筑可视化等多个领域。UE5引入了许多先进的技术&#xff0c;如…

Golang | Leetcode Golang题解之第543题二叉树的直径

题目&#xff1a; 题解&#xff1a; func diameterOfBinaryTree(root *TreeNode) int {var (dfs func(node *TreeNode) int // node节点深度ans int)dfs func(node *TreeNode) int {//边界if node nil {return -1}//求左右子树深度leftDepth : dfs(node.Left)rightDepth : d…

【TS】九天学会TS语法——3.TypeScript 函数

今天学习 TypeScript 的函数&#xff0c;包括函数类型、可选参数、默认参数、剩余参数。 函数声明和表达式函数类型可选参数和默认参数剩余参数 在 TypeScript 中&#xff0c;函数是编程的核心概念之一。它们允许我们将代码组织成可重用的块&#xff0c;并提供了强大的抽象能力…

解决程序因缺少xinput1_3.dll无法运行的有效方法,有效修复丢失xinput1_3.dll

如果你的电脑在运行某些应用程序或游戏时提示“xinput1_3.dll丢失”或“找不到xinput1_3.dll”的错误消息&#xff0c;那么很可能是因为你的系统中缺少这个重要的DLL文件而导致的问题。那么电脑出现xinput1_3.dll丢失的问题时有哪些方法进行修复呢&#xff1f; 如何确定电脑是否…

Golang--面向对象

Golang语言面向对象编程说明&#xff1a; Golang也支持面向对象编程(OOP)&#xff0c;但是和传统的面向对象编程有区别&#xff0c;并不是纯粹的面向对象语言。所以我们说Golang支持面向对象编程特性是比较准确的。Golang没有类(class)&#xff0c;Go语言的结构体(struct)和其…

语音识别中的RPM技术:原理、应用与发展趋势

目录 引言1. RPM技术的基本原理2. RPM的应用领域3. RPM技术的挑战与发展趋势4. 总结 引言 在语音识别和音频处理领域&#xff0c;RPM&#xff08;Recurrent Phase Model&#xff0c;递归相位模型&#xff09;技术正逐渐崭露头角。它作为一种创新的信号处理方法&#xff0c;通过…

IntelliJ Idea设置自定义快捷键

我IDEA的快捷键是自己修改成了和Eclipse相似&#xff0c;然后想要跳转到某个方法的上层抽象方法没有对应的快捷键&#xff0c;IDEA默认的是Ctrl U &#xff08;Windows/Linux 系统&#xff09; 或 Command U &#xff08;Mac 系统&#xff09;&#xff0c;但是我的不起作用&a…

深入探讨钉钉与金蝶云星空的数据集成技术

钉钉报销数据集成到金蝶云星空的技术案例分享 在企业日常运营中&#xff0c;行政报销流程的高效管理至关重要。为了实现这一目标&#xff0c;我们采用了轻易云数据集成平台&#xff0c;将钉钉的行政报销数据无缝对接到金蝶云星空的付款单系统。本次案例将重点介绍如何通过API接…

Python 数据结构对比:列表与数组的选择指南

文章目录 &#x1f4af;前言&#x1f4af;Python中的列表&#xff08;list&#xff09;和数组&#xff08;array&#xff09;的详细对比1. 数据类型的灵活性2. 性能与效率3. 功能与操作4. 使用场景5. 数据结构选择的考量6. 实际应用案例7. 结论 &#x1f4af;小结 &#x1f4af…

ML 系列:机器学习和深度学习的深层次总结( 19)— PMF、PDF、平均值、方差、标准差

一、说明 在概率和统计学中&#xff0c;了解结果是如何量化的至关重要。概率质量函数 &#xff08;PMF&#xff09; 和概率密度函数 &#xff08;PDF&#xff09; 是实现此目的的基本工具&#xff0c;每个函数都提供不同类型的数据&#xff1a;离散和连续数据。 二、PMF 的定义…

string模拟实现插入+删除

个人主页&#xff1a;Jason_from_China-CSDN博客 所属栏目&#xff1a;C系统性学习_Jason_from_China的博客-CSDN博客 所属栏目&#xff1a;C知识点的补充_Jason_from_China的博客-CSDN博客 string模拟实现reserve 这里实现的是扩容 扩容这里是可以实现缩容&#xff0c;可以实现…

《JVM第8课》垃圾回收算法

文章目录 1.标记算法1.1 引用计数法1.2 可达性分析法 2.回收算法2.1 标记-清除算法&#xff08;Mark-Sweep&#xff09;2.2 复制算法&#xff08;Coping&#xff09;2.3 标记-整理算法&#xff08;Mark-Compact&#xff09; 3.三种垃圾回收算法的对比 为什么要进行垃圾回收&…

编程之路:蓝桥杯备赛指南

文章目录 一、蓝桥杯的起源与发展二、比赛的目的与意义三、比赛内容与形式四、比赛前的准备五、获奖与激励六、蓝桥杯的影响力七、蓝桥杯比赛注意事项详解使用Dev-C的注意事项 一、蓝桥杯的起源与发展 蓝桥杯全国软件和信息技术专业人才大赛&#xff0c;简称蓝桥杯&#xff0c…

全网最适合入门的面向对象编程教程:58 Python字符串与序列化-序列化Web对象的定义与实现

全网最适合入门的面向对象编程教程&#xff1a;58 Python 字符串与序列化-序列化 Web 对象的定义与实现 摘要&#xff1a; 如果我们要在不同的编程语言之间传递对象&#xff0c;就必须把对象序列化为标准格式&#xff0c;比如XML\YAML\JSON格式这种序列化Web对象。这种序列化W…

使用YOLO 模型进行线程安全推理

使用YOLO 模型进行线程安全推理 一、了解Python 线程二、共享模型实例的危险2.1 非线程安全示例&#xff1a;单个模型实例2.2 非线程安全示例&#xff1a;多个模型实例 三、线程安全推理3.1 线程安全示例 四、总结4.1 在Python 中运行多线程YOLO 模型推理的最佳实践是什么&…

每日一题|3255. 长度为 K 的子数组的能量值 II|递增序列、计数器

同昨天的解法一样&#xff0c;遍历一遍的同时&#xff0c;统计当前最长的子串长度&#xff0c;如果>k&#xff0c;则将子串开始位置处赋值子串当前位置元素的值。 class Solution:def resultsArray(self, nums: List[int], k: int) -> List[int]:res [-1] * (len(nums)…

金华迪加现场大屏互动系统 mobile.do.php 任意文件上传漏洞复现

0x01 产品描述&#xff1a; ‌ 金华迪加现场大屏互动系统‌是由金华迪加网络科技有限公司开发的一款专注于增强活动现场互动性的系统。该系统设计用于提供高质量的现场互动体验&#xff0c;支持各种大型活动&#xff0c;如企业年会、产品发布会、展览展示等。其主要功能包…

【网络面试篇】HTTP(1)(笔记)——状态码、字段、GET、POST、缓存

目录 一、相关问题 1. HTTP请求常见的状态码和字段&#xff1f; &#xff08;1&#xff09;状态码 &#xff08;2&#xff09;字段 ① Host 字段 ② Content-length 字段 ③ Connection 字段 ④ Content-Type 字段 ⑤ Content-Encoding 字段 2. GET 和 POST 的区别&a…

Java学习Day60:微服务总结!(有经处无火,无火处无经)

1、技术版本 jdk&#xff1a;17及以上 -如果JDK8 springboot&#xff1a;3.1及其以上 -版本2.x springFramWork&#xff1a;6.0及其以上 -版本5.x springCloud&#xff1a;2022.0.5 -版本格林威治或者休斯顿 2、模拟springcloud 父模块指定父pom <parent><…