- 博客(338)
- 资源 (3)
- 收藏
- 关注
原创 javaScript---箭头函数和普通函数的区别
1、定义区别:箭头函数语法比普通函数更加简洁普通函数使用关键字function定义。箭头函数:如果没有参数,直接写一个();如果一个参数,可以省略();如果多个参数,逗号分割。如果函数体中只有return返回语句或者只有一句代码,return和{}可以省略。2this指向区别箭头函数没有自己的this,箭头函数内部 this 始终指向创建时所在作用域指向的对象。call,apply,bind方法改变不了箭头函数的指向。普通函数:直接调用时指向全局对象;
2024-02-29 13:09:17
880
原创 浏览器---浏览器/http相关面试题
当访问项目的时候,你访问的是nginxIpAddress:3000,nginx将你的请求映射到项目的真实地址A,同理项目中的接口请求例如nginxIpAddress:3000/api/*,nginx将接口请求映射到接口服务的真实地址B。保障了传输过程的安全性。将原本要请求的服务地址,改为请求nginx服务器,利用nginx地址映射将请求映射到真实的服务地址,同时需要添加两个响应头信息,一个是Access-Control-Allow-Origin,Access-Control-Allow-Methods。
2024-02-21 11:29:13
1123
原创 HTML---html面试题
当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内。DOCTYPE>声明位于文档中的最前面,位于标签之前,即告知浏览器的解析器,用什么文档类型规范来解析这个文档。html语义化可以让页面的内容结构化,便于浏览器解析和搜索引擎解析,并提高代码的可维护性和可重用性,语义化标签如等。锚点是文档中某行的一个记号,类似于书签,用于链接到文档中的某个位置。
2024-02-21 10:18:17
944
1
原创 vue3---inputRef.value.focus()报错Cannot read properties of null (reading ‘focus‘)
问题描述:点击编辑按钮,出现el-input框(el-input显示隐藏通过v-if控制)解决方法:方法1:添加nextTick函数,因为使用了v-if执行;方法2:v-if替换为v-show。道理简单,却总是容易忽略,警戒!
2024-01-25 14:37:01
1417
原创 CSS---CSS面试题
css匹配的规则是从右往左开始匹配,如果嵌套的层级更多,页面中的元素更多,那么匹配所要花费的时间代价自然更高,所以我们在编写选择器的时候,可以遵循以下规则:不要嵌套使用过多复杂选择器,最好不要三层以上;声音样式属性:speak、speak-punctuation、speak-numeral、speak-header、speech-rate、volume、voice-family、 pitch、pitch-range、stress、richness、、azimuth、elevation。
2023-07-14 00:04:23
1920
原创 react---react router 5 基本使用
路由是根据不同的 URL 地址展示不同的内容或页面,在 SPA 应用中,大部分页面结果不改变,只改变部分内容的使用。一个路由其实就是一个映射关系。前端路由常见的两种模式:hash和historyhash模式:路由上会有个#号,#后面 hash 值的变化,并不会导致浏览器向服务器发出请求,浏览器不发出请求,也就不会刷新页面。使用 Javascript 来对 location.hash 进行赋值,改变 URL 的hash值,每次 hash 值的变化,会触发hashchange 这个事件。
2023-06-13 08:43:52
2019
原创 react---pubsub-js消息订阅与发布
pubsub是一个用Javascript编写的基于主题的发布/订阅库,适用于任意组件间的通信,需要先订阅再发布 ,在组件即将卸载时钩子函数中进行取消订阅。(3) PubSub.publish('update', data): 发布消息, 触发订阅的回调函数调用。(1) import PubSub from 'pubsub-js' // 引入。(4) PubSub.unsubscribe(token): 取消消息的订阅。2. 下载: 【npm install pubsub-js --save】
2023-06-12 23:08:07
920
原创 react---配置代理
方式一:在package.json中添加proxy【 "proxy":"http://localhost:5000" 】创建代理配置文件,在src下创建配置文件:src/setupProxy.js。案例代码【App.jsx】
2023-06-12 22:45:25
3420
原创 react---todoList案例
state放在哪个组件:如果某个组件组件使用:放在其自身的state中。如果某些组件使用:放在他们共同的父组件state中(官方称此操作为状态提升)状态(state)在哪,操作状态的方法就在哪里。
2023-06-12 22:34:53
1387
原创 react---create-react-app搭建项目
【index.js】--将APP组件渲染到页面。%PUBLIC_URL%代表public目录。【index.html】--应用入口文件。【Hello组件/Welcome组件】3.hello_react示例。
2023-06-12 21:32:46
468
原创 react---生命周期
React 中为我们提供了一些生命周期钩子函数,让我们能在 React 执行的重要阶段,在钩子函数中做一些事情。新的生命周期 对于 旧的生命周期 ,废弃(即将废弃)了 三个 生命钩子: componentWillMount、componentWillReceiveProps、componentWillUpdate;新提出了两个生命钩子:getDerivedStateFromProps(获取派生状态)、getSnapshotBeforeUpdate(存快照,比如用于存放滚动条更新前位置)
2023-06-12 20:46:03
1502
原创 vue---大文件分片上传
思路:将大文件切成小片异步上传可以解决大文件上传过慢的问题,但如果文件很大时,采用一次性异步上传,会在同一时间产生过多的请求,后端服务器处理不过来,导致请求异常。因此将文件切成小片后,再分组上传,比如一组10个切片,等待10个切片的请求上传完成后,再接着下一组,以此减轻对服务器的压力。
2023-06-05 12:06:33
4212
原创 react---react入门
react是用于构建用户界面的javaScript 库,是一个将数据渲染为HTML视图的开源 JavaScript库由FaceBook软件工程师Jordan Walke创建,2013年5月宣布开源。原生js的痛点-原生JS通过DOM Api操作DOM繁琐、效率低;浏览器会进行大量的重绘重排;原生JS没有组件化编码方案,代码复用率低。react 特点:采用组件化模式、声明式编码,提高开发效率及组件复用率。React Native 中可以使用 React语法进行移动端开发使用虚拟DOM (
2023-06-05 00:45:53
82
原创 javaScript---设计模式-提高复用性
(1)JavaScript最初没有专门的继承,所以最初JavaScript推崇函数式的编程,然后进行统一组合桥接到一起。(2)express中创建get等方法:express中有get,post,put等七八个方法,如何方便快速地创建。应用示例:(1)创建不同的选项效果,有一组菜单,上面每种选项都有不同的选中效果。,继承的好处是可以自动获得父类的内容与接口,方便统一化。一系列弹窗,每个弹窗的行为,大小,文字都不同;,组合的好处是耦合低,方便方法复用,方便扩展。定义一系列的骨架,简化后面类似操作的内容。
2023-05-08 08:38:56
540
原创 javaScript---设计模式-封装与对象
把不同的模块拆分为不同的类,给类定义不同的方法;最后把不同的类组合在最终的使用类里。好的封装(不可见、留接口):①变量外部不可见;封装的目的:①定义变量不会污染外部;②能作为一个模块调用;(1)多彩的弹窗:弹窗有多种,它们之间存在内容和颜色上的差异。为了避免重复新建,避免多个对象存在互相干扰。vue-router。当某一个对象需要经常创建的时候。当要创建单个、庞大的组合对象时。需要确保全局只有一个对象。需要组合出一个全局对象。
2023-05-08 08:34:19
812
原创 javaScript---设计模式-设计模式概论
建造者模式-精细化组合对象,需要大量参数,且内部模块庞大;桥接模式-独立出来,然后再对接过去,减少耦合度;单例模式-全局只能有一个实例化对象;数据访问模式-一个方便的数据管理器。职责链模式-像生产线一样组织模块;等待者模式-等你们都回来再吃饭;观察者模式-我作为第三方转发;委托模式-让别人代替你收快递;适配器模式-用适配代替更改;外观模式-给你的一个套餐;享元模式-共享来减少数量;状态模式-用状态代替判断;惰性模式-我要搞机器学习;工厂模式-大量创建对象;命令模式-用命令解耦;策略模式-算法工厂;
2023-05-08 08:30:44
671
原创 CSS---实现一个边长为父元素宽度一半的正方形
解决方法:子元素width:50%;padding设置为百分比时是相对父元素的宽度计算的。问题:实现一个边长为父元素宽度一半的正方形。
2023-05-07 00:26:56
541
原创 javaScript---toString()与Object.prototype.toString()
当我们把Array自身的toString()方法通过delete Array.prototype.toString删除之后,再次使用它时,发现Array原型上没有toString()方法,会往__proto__属性指向的对象上去找,找到并使用了Object原型上的toString(),也便将Object上的toString()方法作用在数组上,得出其数据类型[object Array]Object.toString最终通过原型链调用的是Function.prototype.toString。
2023-05-07 00:07:33
600
原创 vue---SSR与CSR
首次页面加载要等到资源都加载执行完,用户才可以进行操作;更快的内容到达时间 (time-to-content):特别是对于缓慢的网络情况或运行缓慢的设备,用户无需等待页面所有js加载完成就可以看到页面视图(压力来到了服务器,所以需要权衡哪些用服务端渲染,哪些交给客户端)指由服务侧完成页面的 HTML 结构拼接的页面处理技术,发送到浏览器,然后为其绑定状态与事件,成为完全可交互页面的过程;更好的 SEO:搜索引擎优先爬取页面HTML结构,使用ssr时,服务端已经生成了和业务想关联的HTML,有利于seo。
2023-04-27 14:16:42
293
原创 http---HTTP缓存
HTTP 缓存是web性能优化的重要手段,通过复用缓存资源,减少了服务器和客户端的通信次数,降低网络延迟,加速页面加载,解服务器端的压力。显著提升网站和应用的性能,提高用户体验http缓存策略主要分为两种方式:强缓存 (浏览器端执行);协商缓存(服务器端执行)优先级: 强缓存 > 协商缓存
2023-04-26 23:57:06
589
原创 vue---mixin混入
一个混入对象可以包含任意组件选项(如data、methods、created、mounted等等)。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。 我们可以使用混入,向组件注入自定义的行为。和组件注册和指令一样 vue 提供了全局和局部注册mixin的mixin 函数。
2023-04-23 23:49:55
876
原创 vue---组件逻辑复用方法:Mixin/HOC/Renderless组件
下文通过表单校验来分别讲解Mixin/HOC/Renderless组件这三种方式。
2023-04-23 23:48:12
742
原创 vue---父子、兄弟、跨层级关系组件通信
父组件向子组件传递数据是通过props传递的。子组件传递数据给父组件通过自定义事件$emit触发来通知父级组件进行相应的修改。vue---父子传值:props与this.$emit()_vue获取父类属性值_maidu_xbd的博客-优快云博客在vue中,属性props用来实现将父组件的数据传递给子组件。当父组件的属性变化时,将传递给子组件。父组件通过prop向子组件传递数据,子组件可以通过调用内建的$emit方法来触发一个事件$children(vue3废弃)
2023-04-23 19:53:13
1416
原创 vue---双向绑定
vue 中的双向绑定是语法糖。vue.js是采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调来渲染视图。数据和视图同步改变。
2023-04-21 23:53:07
6546
1
原创 vue---自定义指令
什么时候我们需要去自定义一个指令呢?事件修饰符,很大的程度上我们是为了让我们的代码更加显得是数据驱动的以及可测试的,而将DOM操作的相关逻辑单独地委托出来,约定成一些特定的修饰符,为了保证methods方法只有纯粹的数据逻辑(和DOM解耦,易于单元测试),不去处理DOM相关的操作。当我们的methods中存在操作DOM的逻辑的时候,就该思考是否可以抽象成一个自定义指令。自定义指令作用:操作DOM2、自定义指令Vue.directive( ' 自定义指令名 ' , { } )参数一是指令的名字,
2023-04-21 18:05:08
561
原创 vue---data 为什么是函数?
在 Vue 中,每个组件都是一个对象,当多个实例共享同一对象时,它们将共享相同的状态。如果 data 不是一个函数并且是一个对象,那么所有组件实例将共享相同的 data 对象,这样就会导致状态混乱。为了避免这种情况,Vue 强制要求 data 必须是一个函数,这样每个组件实例都会得到一个独立的 data 对象。这样就不会有状态混乱的问题。js中的对象都是通过引用关联的,只有返回一个生产data的函数,这个组件产生的每一个实例才能维持一份被返回对象的独立的拷贝。
2023-04-21 11:31:39
95
原创 vue---JSX
在绝大多数情况下,我们的模板都可以用HTML来书写。但是如果你熟悉虚拟 DOM 并且不喜欢总是重复复制粘贴代码,做到更优雅的可重用性,你也可以不用模板,直接写渲染 (render) 函数,使用可选的 JSX 语法。使用JSX, 首先我们要在单文件组件里面抛弃template模板,然后声明一个render的函数。:Vue.js通过编译将template 模板转换成渲染函数(render) ,执行渲染函数就可以得到一个虚拟节点树。
2023-04-21 11:20:34
88
原创 javaScript---EventLoop事件循环机制
学习EventLoop机制帮助我们理解代码执行顺序。event loop 的机制,就是任务队列、js主线程、异步操作之间的互相协作。
2023-04-20 00:28:12
303
原创 javaScript---js如何实现继承
js实现继承的方法:构造函数继承、原型链继承、组合继承、class继承、实例继承 、拷贝继承 、寄生组合继承。
2023-04-18 18:56:13
646
原创 javaSccript---call()、 bind()、 apply()的区别
/ 17 obj.myFun() // 小张年龄 undefined 例 2 shows() // 盲僧 比较一下这两者 this 的差别,第一个打印里面的 this 指向 obj,第二个全局声明的 shows() 函数 this 是 window;arg1、arg2、... 是一些可选的参数,这些参数将在调用新函数时作为参数列表传递给原函数。call()、apply()、bind() 都是用来重定义 this 这个对象的。是用来改变函数this指向的,第二个参数是是用于传参。
2023-04-17 10:35:11
251
原创 javaScript---读懂promise、async/await
catch 只捕获最近的 then 的回调函数,前面的then的执行不成功的结果,有后面 then 的 reject 回调函数执行,如果没有后续 then 回调函数执行,则会被 catch 捕获执行;catch 方法,该方法相当于 最近的then 方法的第二个参数,指向 reject 的回调函数,另一个作用是,在执行resolve回调函数时,如果出错,抛出异常,进入catch 方法中。promise是如何解决问题的?then、catch返回的promise是新的promise,不是原来的promise。
2023-04-08 12:22:59
411
原创 javaScript---原型链 __proto__、constructor、prototype
_proto__属性的作用就是当访问一个对象的属性时,如果该对象内部不存在这个属性,那么就会去它的__proto__属性所指向的那个对象(父对象)里找,一直找,直到__proto__属性的终点null,再往上找就相当于在null上取值,会报错。(2)函数拥有prototype属性和__proto__、constructor属性(JS中函数也是一种对象)。prototype指向函数的原型对象,这是一个显式原型属性,只有函数才拥有该属性。将对象和原型联系起来组成原型链,就可以让对象访问到不属于自己的属性。
2023-04-07 23:41:08
186
原创 javaScript---内存管理
内存泄漏内存泄漏:任何一个程序的运行都需要分配内存空间,而对于一个页面来说,如果一些不再需要使用的内存没有得到及时释放,我们称这种现象为内存泄漏。一次内存泄漏似乎不会有太大的影响,但内存泄漏堆积会造成内存溢出,内存溢出,简单来说就是我们所需要使用的内存空间大于可用内存,此时我们的程序就会出现内存溢出错误。为什么要管理内存(1)减少浏览器的负担:内存过大会让浏览器压力过大,导致浏览器卡顿(2)Node端:内存如果不够,服务就会中断,而nodejs开启的服务,如果不管理内存,就会中断.
2022-02-04 10:23:10
3891
原创 javaScript---防抖Debounce和节流Throttle
防抖是多次触发只生效最后一次。适用于只需要一次触发生效的场景节流是让操作每隔一段时间才能触发一次。适用于多次触发要多次生效的场景
2022-02-04 10:01:45
785
基于Android的手机通讯录
2016-01-16
本科毕业论文---防盗密码锁的设计
2016-01-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人