- 博客(43)
- 收藏
- 关注
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 js中几种循环的退出方式
some退出循环:return / return true(不能return false) every退出循环:return false。every():相当于且,只要有一个不满足条件,就return false,只有都满足条件才会返回true。用return、break、continue的方式都不能终止forEach循环,some():相当于或,只要有一个满足条件,就return true。break:退出循环 continue:退出本次循环。终止for循环的方式:break和continue。
2022-09-12 20:01:21
21561
1
原创 vue2路由跳转和浏览器回退时弹窗的开启
我这里有个需求是在A页面中的详情弹框中,点击按钮跳转到B页面的新增弹框中,并把A页面中的数据带过去填到B页面新增的form表单中,此时如果点击了浏览器的回退按钮,就会重新回到A页面中刚才打开的那条数据的详情弹框。
2023-08-07 16:04:43
1070
原创 通过颜色选择器全局修改svg图片的颜色
此篇文章是一个原生js的项目,要想动态修改图片的颜色,就需要用到svg格式的图片,可以给svg图片下的path设置样式fill为你选择的颜色,即可动态修改图片的颜色。
2023-07-25 10:39:22
986
原创 ES6新增的运算符,指数运算符(**)、链判断运算符(?.)、Null 判断运算符(??)
在链式调用的时候判断,左侧的对象是否为null或undefined。如果是的,就不再往下运算,而是返回undefined。读取对象属性的时候,如果某个属性的值是null或undefined,为它们指定默认值。这个运算符的一个目的,就是跟链判断运算符?上面代码中,默认值只有在左侧属性值为。如果有定义,就会调用该方法,否则。,于常见运算符左结合有所不同。,就会返回默认值300。
2023-06-20 17:31:25
463
原创 CSS元素水平垂直居中的方法
设置父元素为display:table-cell,子元素设置 display: inline-block。这种方法其实和最上面被否定掉的margin负值用法一样,可以说是margin负值的替代方案,并不需要知道自身元素的宽高。translate(-50%, -50%)将会将元素位移自己宽度和高度的-50%绝大多数情况下,设置父元素为相对定位, 子元素移动自身50%实现水平垂直居中。,所以宽高会按照我们的设置来显示,但是实际上。,并且四个定位属性的值都设置了。它就可以上下左右都居中了。
2023-04-08 12:40:28
361
原创 TS2023年面试题汇总~~~~持续更新中!!!!
总的来说,类是面向对象编程的基本组成部分,可以通过类来创建具有一定属性和行为的对象,并且 TypeScript 中的类支持访问修饰符和继承等面向对象编程的概念,使得代码更加规范和易于维护。在 TypeScript 中,泛型可以让我们在定义函数、类、接口时不预先定义具体的类型,而是在使用时再指定类型。与 JavaScript 不同的是,TypeScript 中的类可以使用访问修饰符来控制属性和方法的访问级别,如。类可以包含属性和方法,通过实例化类可以创建对象,对象可以访问类中定义的属性和方法。
2023-04-07 12:36:03
1082
原创 React-Hooks----useCallback()
useCallback() 是一个 React Hook,它用于缓存函数的引用以及处理函数的依赖项,以避免在渲染时重复创建新的函数。
2023-04-06 14:00:54
522
原创 React-Hooks----useReducer()
是React提供的一种状态管理工具,与useState()类似,但更适合处理复杂的状态逻辑。
2023-04-06 13:53:09
672
原创 React-Hooks----useContext()
useContext() 是 React Hooks 中的一个用于访问 React 上下文(Context)的 Hook。它接收一个 React 上下文对象(通常使用 React.createContext 创建),并返回该上下文的当前值。
2023-04-06 13:47:45
779
原创 React-Hooks----useRef()
用于创建对DOM元素的引用。它还可以用于存储组件之间共享的变量,这些变量不会在组件重新渲染时发生更改。
2023-04-06 13:41:45
468
原创 React-Hooks----useEffect()
useEffect() 是 React 中最常用的 Hook 之一,它可以让函数组件拥有类似于类组件中和生命周期函数的功能。
2023-04-06 13:25:29
847
原创 React2023年面试题汇总~~~~持续更新中!!!!
这里总结的所有面试题都是从牛客网找的各种大厂真实场景的面试题,并且做了汇总,各位看官看后做好总结,绝对可以应对88.8%React相关的面试题。
2023-04-06 13:11:41
2296
原创 一文学会数组的reduce()和reduceRight()
如果数组有 n 个成员,这个参数函数就会执行 n - 1 次。建议总是加上第二个参数,这样比较符合直觉,每个数组成员都会依次执行reduce()方法的参数函数。如果要对累积变量指定初值,可以把它放在reduce()方法和reduceRight()方法的。上面代码中,reduce()方法用来求出数组所有成员的和。上面代码指定参数a的初值为10,所以数组从10开始累加,最终结果为25。这四个参数之中,只有前两个是必须的,后两个则是可选的。,这时b是从数组的第一个成员开始遍历,参数函数会执行。
2023-04-06 12:33:59
814
原创 JS2023年面试题汇总~~~~持续更新中!!!!
这里总结的所有面试题都是从牛客网找的各种大厂真实场景的面试题,并且做了汇总,各位看官看后做好总结,绝对可以应对90%JS相关的面试题。
2023-04-06 12:20:48
3139
原创 js闭包详解,看完必会
闭包是指有权访问另一个函数作用域中变量的函数,即使这个函数已经执行完毕并返回。可以通过返回一个函数或者把函数作为参数传递给另一个函数来创建闭包。闭包可以捕获外部函数的变量,并且这些变量可以在闭包内被访问和操作,这使得闭包可以在许多场景下被使用,例如封装变量、实现模块化、缓存数据等。
2023-03-30 17:55:03
533
原创 vue3与vue2的区别
在 Vue 2 中,每个组件实例都有一个与之关联的响应式对象,这可能会导致性能问题。在 Vue 3 中,每个组件实例都有一个唯一的标识符,这样就可以避免不必要的响应式对象的创建和销毁,从而提高性能。Teleport 组件:Vue 3 中新增了 Teleport 组件,它可以将组件的内容移动到指定的 DOM 节点。其他改进:Vue 3 还有一些其他的改进,例如更好的响应式系统、更好的编译器错误提示、更好的 JSX 支持等。,它提供了一种新的组件组织方式,与 Vue 2 中的 Options API 不同。
2023-03-30 17:34:24
538
原创 Vuex详解,从概念理解到使用步骤
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
2023-03-30 17:16:12
186
原创 vue-router路由守卫详解
在 Vue.js 中,Vue Router 提供了一系列的路由守卫(navigation guard),用于在路由切换过程中进行拦截和控制,以满足不同的业务需求。全局路由守卫路由独享守卫组件内的守卫`除了全局路由守卫之外,Vue Router 还提供了路由独享守卫和组件内的守卫。其中,路由独享守卫是针对某个具体的路由实例进行拦截和控制,而组件内的守卫则是针对某个具体的组件进行拦截和控制。
2023-03-30 16:58:41
3386
原创 Vue Router的两种模式Hash模式和history模式
Vue Router 是 Vue.js 官方的路由管理器,可以轻松地实现单页应用(SPA)的路由功能。hash模式和history模式。
2023-03-30 15:43:07
961
原创 Vue.js 插槽详解
插槽允许我们在父组件中定义子组件的模板内容,从而实现动态组件的功能。然后,我们就可以在父组件中使用该变量来访问子组件中的数据了。这样,当子组件被渲染时,父组件中的按钮就会显示在对应的插槽位置。默认插槽是没有名字的插槽,用于将父组件中的内容插入到子组件中指定的位置。这样,当子组件被渲染时,父组件中的按钮就会显示在指定位置。,用于将父组件中的内容插入到子组件中指定名称的插槽中。属性来定义一个变量,然后在父组件中使用该变量来访问子组件中的数据。具体来说,作用域插槽允许我们在子组件中使用。在子组件中,我们使用。
2023-03-30 15:35:45
4239
原创 vue中data为什么是一个函数而不是一个对象?
在Vue.js中,组件的data选项。如果你使用的是对象形式,那么,这可能会导致意外的问题。因此,为了避免这种情况发生,官方建议将data选项写成一个返回对象的函数。
2023-03-30 15:27:39
743
原创 js常见的六种继承方式
然后,createObject函数通过增强新对象的方式,在新对象上添加了sayName方法,从而实现继承和增强。然后,将子类的原型设置为临时构造函数的实例,从而实现了对父类原型的继承。寄生组合式继承是指通过借用构造函数来继承实例属性,然后通过将原型设置为一个继承父类原型的实例来继承父类原型上的属性和方法。这种方式的缺点是所有新对象的实例属性都会共享obj对象的属性,导致无法实现真正意义上的继承。原型式继承是指通过使用一个已有的对象作为新对象的原型来创建新对象,从而实现继承。,从而创建了一个新的对象,并将。
2023-03-29 11:18:46
985
原创 js中的按位运算符详解‘&‘ , ‘|‘, ‘^‘, ‘~‘, ‘<<‘, ‘>>‘, ‘>>>‘
提示:这里对文章进行总结:例如:以上就是今天要讲的内容,本文仅仅简单介绍了pandas的使用,而pandas提供了大量能使我们快速便捷地处理数据的函数和方法。
2023-03-28 21:14:13
2739
原创 css定位深入理解
相对定位(relative positioning)是指,可以通过设置top、bottom、left、right等属性来改变元素的位置。相对定位的特点是,因此在页面布局时往往会使用相对定位来微调元素的位置。
2023-03-28 18:01:04
163
原创 用flex实现三栏布局
上述代码中,.container是一个flex容器,flex-wrap属性设置为wrap以使其在需要时换行。justify-content属性设置为space-between以使三个栏目之间有一定的空隙。align-items属性设置为。CSS三栏布局是指将一个网页分为三个栏位,分别为左栏、中栏和右栏。左栏和右栏使用flex-basis属性设置宽度,中栏使用。三个栏目的背景颜色可以根据实际情况进行调整。以使三个栏目的高度相等。
2023-03-28 17:26:55
2619
原创 cesium中geoJSON数据的生成
1.首先推荐一个生成geoJSON文件的工具,你可以在地图上随意画图形,然后会给你生成对应的geoJSON文件,特别好用。其中数字和字母直接写就行,图标对应的写法在下面,整理了好久。并且翻译过了,英语不好的朋友可以对照着翻译找。
2023-02-24 14:21:22
1495
原创 eltable树形结构搜索后展开
先说一下我这个功能的需求,页面使用el-table展示的树形结构,默认是不展开的。在搜索后,展开搜索到的节点。
2023-02-02 17:59:54
803
1
原创 el-table树形结构修改图标
vue+element开发时,el-table的树形结构,自带的图标不能满足项目需求。需要我们自己修改图标。下图为修改后的样式。
2023-02-02 17:37:16
1887
6
原创 yarn基本使用
速度超快: Yarn 缓存了每个下载过的包,所以再次使用时无需重复下载。同时利用并行下载以最大化资源利用率,因此安装速度更快。1.package.json :文件里记录项目的描述信息:项目作者、项目描述、项目依赖哪些包、插件配置信息等。2.yarn-lock:将这个范围精确到具体版本。主要是为了解决在各个环境中得到确定的node_modules。在执行代码之前,Yarn 会通过算法校验每个安装包的完整性。3.node_modules:包的具体文件。一:使用yarn之前先全局安装yarn。
2023-01-28 20:31:28
497
原创 react项目配置代理
如果是自己练习的项目用不到.git文件,直接把.git文件删除即可。如果是协同开发的项目先把代码commit之后再执行下一步。1.找到 config>webpackDevServer.config.js文件。解包之后出现config,说明解包成功,显示weppack的配置文件。,配置完成之后记得重启项目。
2022-12-16 14:52:04
658
原创 react项目中引入less
如果是自己练习的项目用不到.git文件,直接把**.git文件删除即可**。如果是协同开发的项目先把代码commit之后再执行下一步。2.在改文件中搜索 sassModuleRegex 后,在其下方添加如下代码。解包之后出现config,说明解包成功,显示weppack的配置文件。1.找到webpack.config.js,3.添加后的代码结构为下图。,配置完成之后记得重启项目。
2022-12-15 18:10:55
701
原创 for.in与for.of的区别
(包括它的原型链上的可枚举属性)。循环将遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性(更接近原型链中对象的属性覆盖原型属性)。of语句在可迭代对象(包括Array,Map,Set,String,TypedArray,arguments 对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句。它们之间的主要区别在于它们的迭代方式。以下示例显示了与Array一起使用时,for…of 语句遍历可迭代对象定义要迭代的数据。in语句以任意顺序迭代对象的可枚举属性。
2022-09-12 17:55:28
103
原创 js判断一个空对象的几种方式
Object.getOwnPrototypeNames()方法会返回该对象所有可枚举和不可枚举属性的属性名组成的数组,然后通过判断返回的数组长度是否为0,如果为0就是空对象。Object.keys()是一个对象方法,该方法返回一个数组,包含指定对象自有的可枚举属性, 用此方法只需要判断返回的数组长度是否为0,为0就是空对象。该方法有个缺点,JSON.stringify()只能序列化对象的可枚举的自有属性,即如果有属性是不可枚举或继承属性的话,结果也是true。该方法对于不可枚举的方法也可以检测出来。
2022-09-12 17:38:37
242
原创 JS中或﹑与﹑否﹑异或﹑左移﹑右移﹑头尾补零的右移运算符
内部采用补码形式表示负数,即需要将这个数减去1,再取一次反,然后加上负号,才能得到这个负数对应的10进制值。上面代码中,-4左移一位得到-8,是因为-4的二进制形式是11111111111111111111111111111100,左移一位后得到11111111111111111111111111111000,该数转为十进制(减去1后取反,再加上负号)即为-8。上面表达式中,0(二进制00)与3(二进制11)进行异或运算,它们每一个二进制位都不同,所以得到11(即3)。,就是一个数的二进制形式向右移动时,.
2022-08-10 21:42:44
2087
原创 什么是类数组,如何转为真正的数组
例如下面的objArr对象1.2类数组特点可以转化为真正的数组不可以调用数组的方法可以向数组那样进行循环遍历下面代码对一个类数组进行遍历2:常见的类数组2.1 arguments:代表函数接受的参数集合2.2 HTMLCollection: Element元素的集合2.3 NodeList: 是HTMLCollection集合的父级,返回所有类型的子节点,包括注释节点,文本节点,元素节点等等。2.4:String3:类数组转为数组3.1:Array.form(); es6新增的方
2022-06-30 21:33:37
497
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人