avatar
文章
130
标签
48
分类
22

首页
归档
标签
分类
关于
BlogMind
搜索
首页
归档
标签
分类
关于

BlogMind

对函数式编程的理解?优缺点?
发表于2024-08-10|更新于2025-02-07|JavaScript|JavaScript
一、是什么函数式编程是一种”编程范式”(programming paradigm),一种编写程序的方法论 主要的编程范式有三种:命令式编程,声明式编程和函数式编程 相比命令式编程,函数式编程更加强调程序执行的结果而非执行的过程,倡导利用若干简单的执行单元让计算结果不断渐进,逐层推导复杂的运算,而非设计一个复杂的执行过程 举个例子,将数组每个元素进行平方操作,命令式编程与函数式编程如下 12345678// 命令式编程var array = [0, 1, 2, 3]for(let i = 0; i < array.length; i++) { array[i] = Math.pow(array[i], 2)}// 函数式方式[0, 1, 2, 3].map(num => Math.pow(num, 2)) 简单来讲,就是要把过程逻辑写成函数,定义好输入参数,只关心它的输出结果 即是一种描述集合和集合之间的转换关系,输入通过函数都会返回有且只有一个输出值 可以看到,函数实际上是一个关系,或者说是一种映射,而这种映射关系是可以组合的,一旦我们知 ...
说说你对vue的mixin的理解,有什么应用场景?
发表于2024-08-04|更新于2025-02-08|Vue|面试•Vue
一、mixin是什么Mixin是面向对象程序设计语言中的类,提供了方法的实现。其他类可以访问mixin类的方法而不必成为其子类 Mixin类通常作为功能模块使用,在需要该功能时“混入”,有利于代码复用又避免了多继承的复杂 Vue中的mixin先来看一下官方定义 mixin(混入),提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。 本质其实就是一个js对象,它可以包含我们组件中任意功能选项,如data、components、methods 、created、computed等等 我们只要将共用的功能以对象的方式传入 mixins选项中,当组件使用 mixins对象时所有mixins对象的选项都将被混入该组件本身的选项中来 在Vue中我们可以局部混入跟全局混入 局部混入定义一个mixin对象,有组件options的data、methods属性 12345678910var myMixin = { created: function () { this.hello() }, methods: { hello: fu ...
Vue常用的修饰符有哪些有什么应用场景
发表于2024-07-29|更新于2025-02-08|Vue|面试•Vue
一、修饰符是什么在程序世界里,修饰符是用于限定类型以及类型成员的声明的一种符号 在Vue中,修饰符处理了许多DOM事件的细节,让我们不再需要花大量的时间去处理这些烦恼的事情,而能有更多的精力专注于程序的逻辑处理 vue中修饰符分为以下五种: 表单修饰符 事件修饰符 鼠标按键修饰符 键值修饰符 v-bind修饰符 二、修饰符的作用表单修饰符在我们填写表单的时候用得最多的是input标签,指令用得最多的是v-model 关于表单的修饰符有如下: lazy trim number lazy在我们填完信息,光标离开标签的时候,才会将值赋予给value,也就是在change事件之后再进行信息同步 12<input type="text" v-model.lazy="value"><p>{{value}}</p> trim自动过滤用户输入的首空格字符,而中间的空格不会过滤 1<input type="text" v-model.trim=&quo ...
Javascript中如何实现函数缓存?函数缓存有哪些应用场景?
发表于2024-07-22|更新于2025-02-07|JavaScript|JavaScript
一、是什么函数缓存,就是将函数运算过的结果进行缓存 本质上就是用空间(缓存存储)换时间(计算过程) 常用于缓存数据计算结果和缓存对象 1234const add = (a,b) => a+b;const calc = memoize(add); // 函数缓存calc(10,20);// 30calc(10,20);// 30 缓存 缓存只是一个临时的数据存储,它保存数据,以便将来对该数据的请求能够更快地得到处理 二、如何实现实现函数缓存主要依靠闭包、柯里化、高阶函数,这里再简单复习下: 闭包闭包可以理解成,函数 + 函数体内可访问的变量总和 123456789(function() { var a = 1; function add() { const b = 2 let sum = b + a console.log(sum); // 3 } add()})() add 函数本身,以及其内部可访问的变量,即 a = 1 ,这两个组合在⼀起就形成了闭包 柯里化把接受 ...
JavaScript中的事件模型
发表于2024-07-20|更新于2025-02-07|JavaScript|JavaScript
一、事件与事件流javascript中的事件,可以理解就是在HTML文档或者浏览器中发生的一种交互操作,使得网页具备互动性, 常见的有加载事件、鼠标事件、自定义事件等 由于DOM是一个树结构,如果在父子节点绑定事件时候,当触发子节点的时候,就存在一个顺序问题,这就涉及到了事件流的概念 事件流都会经历三个阶段: 事件捕获阶段(capture phase) 处于目标阶段(target phase) 事件冒泡阶段(bubbling phase) 事件冒泡是一种从下往上的传播方式,由最具体的元素(触发节点)然后逐渐向上传播到最不具体的那个节点,也就是DOM中最高层的父节点 12345678910<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Event Bubbling</title> </head> <body> ...
Vue实例挂载的过程
发表于2024-07-19|更新于2025-02-08|Vue|面试•Vue
一、思考我们都听过知其然知其所以然这句话 那么不知道大家是否思考过new Vue()这个过程中究竟做了些什么? 过程中是如何完成数据的绑定,又是如何将数据渲染到视图的等等 一、分析首先找到vue的构造函数 源码位置:src\core\instance\index.js 12345678function Vue (options) { if (process.env.NODE_ENV !== 'production' && !(this instanceof Vue) ) { warn('Vue is a constructor and should be called with the `new` keyword') } this._init(options)} options是用户传递过来的配置项,如data、methods等常用的方法 vue构建函数调用_init方法,但我们发现本文件中并没有此方法,但仔细可以看到文件下方定定义了很多初始化方法 12345init ...
列表页跳转详情页的一些最佳实践?
发表于2024-07-15|更新于2025-02-07|前端最佳实践|Vue•React•前端路由
一、常见问题在列表页跳转到详情页时,通常会遇到以下问题: 详情页数据获取方式 返回列表页如何定位到之前位置 列表页数据缓存 详情页数据共享 URL 参数处理 二、解决方案1. 数据传递方式1.1 URL 参数传递123456789101112131415161718192021222324252627282930313233343536// Vue Router 示例const routes = [ { path: '/detail/:id', name: 'detail', component: DetailPage, props: true // 将路由参数作为组件的 props }]// 列表页跳转methods: { goToDetail(id) { this.$router.push({ name: 'detail', params: { id }, query: { ...
对事件循环的理解
发表于2024-07-13|更新于2025-02-07|JavaScript|JavaScript
一、是什么首先,JavaScript 是一门单线程的语言,意味着同一时间内只能做一件事,但是这并不意味着单线程就是阻塞,而实现单线程非阻塞的方法就是事件循环 在JavaScript中,所有的任务都可以分为 同步任务:立即执行的任务,同步任务一般会直接进入到主线程中执行 异步任务:异步执行的任务,比如ajax网络请求,setTimeout 定时函数等 同步任务与异步任务的运行流程图如下: 从上面我们可以看到,同步任务进入主线程,即主执行栈,异步任务进入任务队列,主线程内的任务执行完毕为空,会去任务队列读取对应的任务,推入主线程执行。上述过程的不断重复就事件循环 二、宏任务与微任务如果将任务划分为同步任务和异步任务并不是那么的准确,举个例子: 1234567891011121314console.log(1)setTimeout(()=>{ console.log(2)}, 0)new Promise((resolve, reject)=>{ console.log('new Promise') ...
什么是事件代理?应用场景?
发表于2024-07-11|更新于2025-02-07|JavaScript|JavaScript
一、是什么事件代理,俗地来讲,就是把一个元素响应事件(click、keydown……)的函数委托到另一个元素 前面讲到,事件流的都会经过三个阶段: 捕获阶段 -> 目标阶段 -> 冒泡阶段,而事件委托就是在冒泡阶段完成 事件委托,会把一个或者一组元素的事件委托到它的父层或者更外层元素上,真正绑定事件的是外层元素,而不是目标元素 当事件响应到目标元素上时,会通过事件冒泡机制从而触发它的外层元素的绑定事件上,然后在外层元素上去执行函数 下面举个例子: 比如一个宿舍的同学同时快递到了,一种笨方法就是他们一个个去领取 较优方法就是把这件事情委托给宿舍长,让一个人出去拿好所有快递,然后再根据收件人一一分发给每个同学 在这里,取快递就是一个事件,每个同学指的是需要响应事件的 DOM 元素,而出去统一领取快递的宿舍长就是代理的元素 所以真正绑定事件的是这个元素,按照收件人分发快递的过程就是在事件执行中,需要判断当前响应的事件应该匹配到被代理元素中的哪一个或者哪几个 二、应用场景如果我们有一个列表,列表之中有大量的列表项,我们需要在点击列表项的时候响应一个事件 1234567<ul ...
Vue中的$nextTick有什么作用?
发表于2024-07-09|更新于2025-02-08|Vue|面试•Vue
一、NextTick是什么官方对其的定义 在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM 什么意思呢? 我们可以理解成,Vue 在更新 DOM 时是异步执行的。当数据发生变化,Vue将开启一个异步更新队列,视图需要等队列中所有数据变化完成之后,再统一进行更新 举例一下 Html结构 1<div id="app"> {{ message }} </div> 构建一个vue实例 123456const vm = new Vue({ el: '#app', data: { message: '原始值' }}) 修改message 123this.message = '修改后的值1'this.message = '修改后的值2'this.message = '修改后的值3' 这时候想获取页面最新的D ...
1…678…13
avatar
Answer Ran
欢迎来到我的博客,这里是一个分享技术与生活的空间,希望能带给大家有价值的内容😉
文章
130
标签
48
分类
22
公告
努力更新中......面试ing......

微信交流群
扫码加入交流群,一起学习进步
最新文章
2.19 前端面试复盘(四)2025-02-21
2.19 前端面试复盘(四)2025-02-19
如何实现高性能的虚拟滚动?2025-02-18
2.15 前端面试复盘(三)2025-02-15
2.15 前端面试复盘(二)2025-02-15
分类
  • AI1
  • JavaScript36
  • Vue43
  • webpack3
  • 交互1
  • 前端15
    • 地图开发1
    • 工程化1
标签
webpack 基建 JavaScript 组件库 微前端 前端 免疫力 AI伦理 部署 真菌感染 WebSocket AI 前端开发 前端路由 人工智能 DevOps 错误处理 职场 面试 地图 鼻窦炎 前端优化 生活方式 Vue 最佳实践 即时通讯 架构 前端监控 健康 网络通信 性能优化 微信小程序 前端特效 Excel Vue3 工程化 未来发展 网络 Vuex CSS
归档
  • 二月 202516
  • 一月 202512
  • 十二月 202414
  • 十一月 20244
  • 十月 20243
  • 九月 20245
  • 八月 20248
  • 七月 202413
网站资讯
文章数目 :
130
本站访客数 :
本站总访问量 :
最后更新时间 :
©2025 Answer Ran
搜索
数据库加载中