JS
关注
分享
扫一扫
文章平均质量分 51
前端菜菜DayDayUp
一辈子很短，努力的做好两件事就好；
第一件事是热爱生活，好好的去爱身边的人；
第二件事是努力学习，在工作中取得不一样的成绩，实现自己的价值；
展开
-
JS 中 reduce()方法及使用详解
JS 中 reduce()方法及使用详解原创 2023-02-01 16:01:45 · 112017 阅读 · 4 评论 -
js实现-数组对象按照另一个数组进行排序
js实现-数组对象按照另一个数组进行排序原创 2022-12-19 14:44:00 · 2969 阅读 · 0 评论 -
nanoid的使用--一个小巧、安全、URL友好、唯一的 JavaScript 字符串ID生成器。
nanoid的使用原创 2022-08-29 17:01:31 · 1344 阅读 · 0 评论 -
js中finally的使用
finally的使用。原创 2022-07-13 17:14:14 · 8948 阅读 · 0 评论 -
JS-数组对象，根据日期对象进行排序，按照时间进行升序或降序
排序在项目中还是挺常用的，一般都是从后台获取数组对象，然后根据其中的一个属性进行升序或者降序处理，下面我们就来根据栗子介绍一下；1、封装数组对象排序方法；// 封装数组对象排序方法 compare(prop) { return function(a, b) { return b[prop] - a[prop] // 降序 //return a[prop] - b[prop] //...原创 2022-04-24 11:30:31 · 13513 阅读 · 0 评论 -
防抖与节流详解
1. 概念防抖 是指在一定时间内，在动作被连续频繁触发的情况下，动作只会被执行一次，也就是说当调用动作过n毫秒后，才会执行该动作，若在这n毫秒内又调用此动作则将重新计算执行时间，所以短时间内的连续动作永远只会触发一次，比如说用手指一直按住一个弹簧，它将不会弹起直到你松手为止。节流 是指一定时间内执行的操作只执行一次，也就是说即预先设定一个执行周期，当调用动作的时刻大于等于执行周期则执行该动作，然后进入下一个新周期，一个比较形象的例子是如果将水龙头拧紧直到水是以水滴的形式流出，那你会发现每隔一段时间，原创 2022-03-13 16:20:20 · 12040 阅读 · 0 评论 -
js 五种绑定this，默认绑定、隐式绑定、显式绑定、new绑定、箭头函数绑定详解
壹 ❀ 引可以说this与闭包、原型链一样，属于JavaScript开发中老生常谈的问题了，百度一搜，this相关的文章铺天盖地。可开发好几年，被几道this题安排明明白白的人应该不在少数（我就是其一）。我觉得this概念抽象，变化多端总是让人晕头转向，但平心它并不是有多难，今天我们就从this绑定的五种场景（默认绑定、隐式绑定、显式绑定、new绑定、箭头函数绑定）出发，静下心来好好聊聊这个 this，本文开始。贰 ❀ this默认绑定this默认绑定我们可以理解为函数调用时无任何调用前缀的情景原创 2022-01-10 17:44:11 · 893 阅读 · 1 评论 -
10个清晰实用的JavaScript代码片段
1、单行If-Else语句你可能熟悉这样的常规if-else语句：if(10<100){console.log("True");}else{console.log("False");}//True但是，你知道吗，你可以通过使用三元运算符，以更短，更简洁的方式编写上面的代码？10<100?console.log（“True”）:console.log（“False”） //True通常，三元运算符遵循以下简单模式：...原创 2022-01-06 11:48:51 · 750 阅读 · 0 评论 -
JS中 throw error 与 throw new Error（error）的用法和区别
抛出错误一般都是与try catch 同时出现的，1、throw new Error(error); 这个是创建错误，创造一个错误类型抛出；2、throw error 这个是抛出错误。上代码：throw new Error(error) ---- 注意： Error首字母大写var a = 5;try{ if(a==5){ // 抛出错误 throw new Error("loopTerminates"); //Error要大写 ...原创 2021-12-08 11:19:42 · 12213 阅读 · 0 评论 -
开发总结----一直更新
一、js如何判断数组为空？方法一：arr.length (推荐使用)let arr = [];if (!arr.length){ console.log("数组为空")}else { console.log("数组不为空")}二、js判断数组是否含有某个值？方法一：arr.indexOf()if (arr.indexOf(2) != -1){ console.log("数组含有2")}else { console.log("数组不含2")}...原创 2021-11-11 16:20:10 · 117 阅读 · 0 评论 -
JS判断某个字符串是否包含另一个字符串的5种方法
本文给大家带来JS中判断某个字符串是否包含另一个字符串的五种方法，有string对象的方法，match() 方法，RegExp对象的方法，test() 方法，exec() 方法，具体内容详情大家参考下本文：String对象的方法：方法一：indexOf()（推荐）var str = "123"console.log(str.indexOf("2") != -1); // trueindexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串...原创 2021-10-28 20:10:44 · 20404 阅读 · 2 评论 -
JS结合Vue实现时间过滤器-filters
实现时间过滤器需要 Vue.filter对象，自定义过滤器的名称为dateFormat，后面就是传入的参数，originVal就是传入需要的时间。 通过new Date()方法获取传入的日期对象，然后就通过这个日期对象获取具体的年月份，以及时分秒的值，最后再返回需要的日期格式，使用时间过滤器，代码如下：...原创 2021-10-27 16:08:19 · 1349 阅读 · 0 评论 -
JS实现显示当前实时时间
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do.原创 2021-10-27 14:34:48 · 817 阅读 · 0 评论 -
JS实现隐藏手机号码中间4位数
在前端开发中，遇到如下需求：隐藏手机号码，将中间几位替换为*。通过js如何实现手机号码隐藏中间4位呢？下面整理几种实现方式：1. 使用正则function geTel(tel){ var reg = /^(\d{3})\d{4}(\d{4})$/; return tel.replace(reg, "$1****$2");}//测试var tel = "17326453333"; console.log(geTel(tel));//173****33332. 通过长度原创 2021-10-14 19:17:57 · 8319 阅读 · 1 评论 -
JS实现登录页密码的显示和隐藏功能
在登录页经常会用到通过点击文本框的类似小眼睛图片来实现隐藏显示密码的功能，其实实现原理很简单，通过点击事件来改变input的type类型，具体过程看代码：在没给大家分享实现代码之前，先给大家展示下效果图：<script type="text/javascript">//获取input框内的切换图片id和input文本框的id var demoImg = document.getElementById("showText"); var demoInput = document.原创 2021-10-14 19:15:11 · 743 阅读 · 0 评论 -
JS 两个数组（对象）去重合并
1、数组的合并去重：<script> let arr1 = [3,5,2,3,6]; let arr2 = [5,2,4,6,8,7,9,2]; let arr = arr1.concat(arr2); //合并数组 let arrNew= new Set(arr); //通过set集合去重 console.log("arrNew",Array.from(arrNew)); //将set集合转化为数组</script>2.原创 2021-09-30 17:44:50 · 15944 阅读 · 2 评论 -
06JS高级-内存溢出与内存泄漏
1.内存溢出*一种程序运行出现的错误*当程序运行需要的内存超过了剩余的内存时,就出抛出内存溢出的错误2.内存泄露*占用的内存没有及时释放*内存泄露积累多了就容易导致内存溢出*常见的内存泄露:*意外的全局变量*没有及时清理的计时器或回调函数*闭包<!--1. 内存溢出 * 一种程序运行出现的错误 * 当程序运行需要的内存超过了剩余的内存时, 就出抛出内存溢出的错误2. 内存泄露 *...原创 2021-09-18 14:24:48 · 254 阅读 · 0 评论 -
05JS高级-闭包
一、引入<body><button>测试1</button><button>测试2</button><button>测试3</button><!--需求: 点击某个按钮, 提示"点击的是第n个按钮"--><script type="text/javascript"> var btns = document.getElementsByTagName('button') //原创 2021-09-18 11:36:40 · 146 阅读 · 0 评论 -
04JS高级-执行上下文与执行上下文栈
1、变量提升与函数提升<!--1. 变量声明提升 * 通过var定义(声明)的变量, 在定义语句之前就可以访问到 * 值: undefined2. 函数声明提升 * 通过function声明的函数, 在之前就可以直接调用 * 值: 函数定义(对象)3. 问题: 变量提升和函数提升是如何产生的?--><script type="text/javascript"> console.log('-----') /* 面试题 : 输出 undefin原创 2021-09-14 17:08:07 · 117 阅读 · 0 评论 -
JS之深浅拷贝详解
1、深拷贝与浅拷贝的区别如何区分深拷贝与浅拷贝，简单点来说，就是假设B复制了A，当修改A时，看B是否会发生变化，如果B也跟着变了，说明这是浅拷贝；如果B没变，那就是深拷贝。2、栈堆、基本数据类型、引用数据类型栈堆：存放数据的地方基本数据类型：number，string，boolean，null，undefined引用数据类型：function，Array，objecttips：基本数据类型保存在栈内存，引用类型保存在堆内存中。根本原因在于保存在栈内存的必须是大小固定的数据，引用类型的原创 2021-09-13 17:39:14 · 3747 阅读 · 3 评论 -
03JS高级-原型与原型链
一、原型（prototype）<!--1. 函数的prototype属性(图) * 每个函数都有一个prototype属性, 它默认指向一个Object空对象(即称为: 原型对象) * 原型对象中有一个属性constructor, 它指向函数对象2. 给原型对象添加属性(一般都是方法) * 作用: 函数的所有实例对象自动拥有原型中的属性(方法)--><script type="text/javascript"> // 每个函数都有一个prototype原创 2021-09-13 15:33:51 · 276 阅读 · 0 评论 -
JS中的this关键字详解
this是Javascript语言的一个关键字它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用,下面分四种情况，详细讨论this的用法，感兴趣的朋友可以了解下this是Javascript语言的一个关键字。它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。比如，function test(){ this.x = 1;}随着函数使用场合的不同，this的值会发生变化。但是有一个总的原则，那就是this指的是调用函数的那个对象。一、下面分四种情况，详细..原创 2021-09-08 17:35:16 · 1177 阅读 · 0 评论 -
02-JS高级-数据_变量_内存
一、二、三、四、输出 13；理解：函数执行，首先a和obj都指向{name：’BOB‘，age：13}，但是函数内部执行的0bj = {age：15}又重新创建了一个对象，然后obj从原先的指向断开重新指向{age：15}，函数执行完以后obj被回收，所以打印出a.age为13输出：3；理解：原理同上，其实就是两个a刚开始都指向3，但在函数内部执行的a = a + 1 又重新创建一个对象，函数中的a冲原先指向3的地方断开指向的a+1，但是...原创 2021-09-08 15:02:41 · 97 阅读 · 0 评论 -
01-JS基本数据类型
1、分类：*基本（值）类型 * string ：任意字符串 * number ：任意数字 * boolean ：true / false *undefined ：undefined *null ：null* 对象（引用）类型 *object ：任意对象 *function ：一种特别的对象（特点：可以调用执行） *array ：一种特别的对象（数值下标，内...原创 2021-09-06 14:40:51 · 90 阅读 · 0 评论 -
简述forEach()、map()、every()、some()和filter()的用法
在Javascript中，如何处理数组中的每一项数据？有人可能会说，这还不简单，直接一个for循环遍历一下就好了。是的，确实，这是最常见的做法。但是，除此之外，ES5还提供了处理数组更加方便的方法，如题。接下来，我将通过几个简单的实例来具体讲解这几个方法。一、forEach()，用于遍历数组，无返回值这里先给出一个数组（以下例子通用）：然后我要做事情的就是，将数组中的每一项翻倍。可以看到，forEach()可以传入一个匿名函数作为参数，而该匿名函数有含有三个参数...原创 2021-08-31 16:51:44 · 235 阅读 · 0 评论 -
js两个数组 (数组对象) 比较，找到相同的-删除掉或者-保存起来
var ary = [1,2,3,4];var obj=[ { id:1, name:'luo1' }, { id:2, name:'luo2' }, { id:5, name:'luo5' }]obj里面的对象id只要在ary里面，就删除掉，比如最后输出obj=[{ id:5, name:'luo5' }]解答：cons...原创 2021-08-30 09:40:41 · 9379 阅读 · 0 评论 -
数组的indexof = -1
-1代表未匹配到元素 ，可以用来数组去重经常与javascript打交道的小伙伴一定对indexOf不会陌生吧！判断一个字符串是否包含在另一个字符串中的时候，使用indexOf非常有用。按照官方的对indexOf()的定义，它的作用是返回某个字符串在另一个字符串中首次出现的位置。我们来看看js indexOf()的使用方法。...原创 2021-08-27 14:49:23 · 5629 阅读 · 0 评论 -
Js中JSON.stringify()与JSON.parse()与eval()详解及使用案例
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。因为采用独立于语言的文本格式，也使用了类似于C语言家族的习惯，拥有了这些特性使使JSON称为理想的数据交换语言，作用是易于阅读和编写，同时也易于机器解析和生成（一般用于网络传输速率）(1)JSON.parse函数作用：将json字符串转换成json对象。语法：JSON.parse(text[,reviver]).参数：text 必须；一个有效的js...原创 2021-08-27 14:27:17 · 274 阅读 · 0 评论 -
js中forEach()和map()的区别和理解
转载：https://blog.youkuaiyun.com/qq_39583810/article/details/1086727501、在文章的开始先给大家介绍一下这两者的共同点，我们通常前者用的次数多一点，比较常见都是循环遍历数组中的每一项每一次执行匿名函数都支持三个参数，数组中的当前项item，当前项的索引index，原始数组input匿名函数中的this都是指window只能遍历数组2、关于forEach()敲黑板：没有返回值！！参数：value数组中的当前项，inde原创 2021-07-23 10:42:17 · 490 阅读 · 0 评论 -
js数组对象 判断两个属性值相同时另外某个属性值相加后，再进行 去重 （项目实战提取！！！）
一.定义number方法二.判断两个属性值相同时,另外某个属性值相加三.对proflist数组对象去重原创 2021-07-22 17:34:27 · 806 阅读 · 0 评论 -
js数组对象去重（4种方法）
问题：数组对象去重方法一：es5冒泡排序法，去重arr（较好用）var arr = [{name: 'a',id: 1}, {name: 'a',id: 2}, {name: 'b',id: 3}, {name: 'c',id: 4}, {name: 'c',id: 6}, {name: 'b',id: 6}, {name: 'd',id: 7}];function deWeight() { for (var i = 0; i < arr.length - 1; i++) .原创 2021-07-22 17:13:55 · 8881 阅读 · 0 评论 -
js数组对象（1个数组） 判断 | 两个属性值相同时，另外某个属性值相加
例如：答案：原创 2021-07-22 17:06:48 · 909 阅读 · 1 评论 -
e.preventDefault()与e.stopPropagation()的区别
转载：https://blog.youkuaiyun.com/xiaobing_hope/article/details/50674998原创 2021-07-22 16:56:09 · 218 阅读 · 0 评论