
JS
文章平均质量分 76
根据WebGIS开发所需的前端知识,系统并深入地学习JS。
满分观察网友z
code is cheap,let's talk.
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
一行代码,干掉我 10 行!聊聊 filter(Boolean) 这个让我又爱又恨的小恶魔
好了,故事讲完了。现在让我们像个老手一样,总结一下它是什么?一个超级简洁的工具,用于快速地、一次性地从数组中移除所有“假值”false0""nullundefinedNaN什么时候用它?清理脏数据:当你在处理用户输入、API 返回等不确定的数据源,想快速去掉所有nullundefined""时,它是你的最佳拍档。条件性构建:在动态构建数组(比如 CSS 类名、URL 参数)时,配合&&短路求值,能写出非常优雅的代码。什么时候【千万别】用它?当0是一个有意义的、需要被保留的有效数据时!原创 2025-06-19 10:21:29 · 793 阅读 · 0 评论 -
JavaScript 神器 reduce():从入门到精通
嘿,各位前端同学!在我们的日常开发中,和数组打交道就像呼吸一样自然。我们用 遍历,用 转换,用 筛选。但当需求变得复杂,比如“计算购物车商品总价”、“统计投票结果”或者“将二维数组展平”时,你是否曾用一连串的 循环和临时变量把自己绕晕?别担心,今天我们要聊的,就是专门解决这类问题的“终极武器”——。很多人对 的第一印象是:强大,但有点绕。它就像一把瑞士军刀,功能繁多,初见时不知从何下手。但一旦你理解了它的核心思想,你就会爱上这种将复杂问题优雅地“浓缩”成一行代码的快感。这篇文章的目标,就是带你彻底原创 2025-06-13 09:49:35 · 807 阅读 · 0 评论 -
encodeURIComponent和decodeURIComponent
识别风险:任何时候,只要你想把一个可能包含特殊字符(&,?, /, #, 空格等)或中文的字符串放进URL,就要想起编码!选择武器:使用来对你的数据进行“伪装”,确保它在URL中安全传输。还原真相:在接收端,使用(或者更推荐的)来“卸妆”,获取原始数据。牢记区别:只在需要编码整个URL时才考虑,编码URL的部分时,请坚决使用。原创 2025-06-09 15:45:45 · 1205 阅读 · 0 评论 -
JS奇数求和:从朴素循环到数学之美
方法一(循环累加):直观易懂,适合理解基本编程逻辑,时间复杂度 O(n)。方法二(数学规律):高效简洁,利用数学特性,时间复杂度 O(1),适用于需要高性能的场景。在实际开发中,如果性能不是极致要求,方法一的可读性可能更高一些。但如果需要处理大量数据或者追求最高效率,方法二无疑是更好的选择。了解并掌握这两种不同的解决思路,可以帮助我们更好地选择合适的算法来解决问题。原创 2025-05-19 09:00:00 · 899 阅读 · 0 评论 -
那些让人挠头的 JavaScript 类型转换:一道看似简单的面试题
当使用加法运算符连接一个数字和一个对象(这里是数组[0])时,JavaScript 会进行隐式类型转换。如果其中一个操作数是对象,则会将其转换为原始值。对于数组,会先尝试valueOf(),再尝试toString()。[0]的toString()方法返回字符串"0"。所以,加法表达式变成了1 + "0"。当一个数字和一个字符串相加时,数字会被转换为字符串,然后进行字符串拼接。1转换为字符串是"1"。"1" + "0"的结果是字符串"10"。原创 2025-05-19 09:00:00 · 719 阅读 · 0 评论 -
字符串字符计数:经典循环与 Reduce 的魔法
在 JavaScript 中,统计字符串中每个字符的出现次数可以通过多种方法实现。本文介绍了两种常见的方法:传统的 for 循环和函数式编程中的 reduce 方法。for 循环通过遍历字符串,使用对象存储字符计数,逻辑清晰,适合初学者。reduce 方法则通过将字符串转换为数组,利用累加器对象逐步统计字符次数,代码更简洁且具有函数式风格。优化后的 reduce 写法进一步简化了代码,但可读性有所降低。选择哪种方法取决于开发者对代码可读性和简洁性的偏好,reduce 方法在处理累加操作时更具表达力。原创 2025-05-18 09:00:00 · 1209 阅读 · 0 评论 -
JS迭代的魔力:让普通对象也拥有数组般的解构能力
通过为添加属性,我们让普通对象具备了迭代能力,从而可以使用数组的解构赋值语法来提取属性值。这展示了迭代器在 JavaScript 中的强大作用和灵活性。虽然这种直接修改原型的方式需要谨慎使用,但理解其背后的原理对于深入掌握 JavaScript 的迭代机制至关重要。原创 2025-05-18 09:00:00 · 668 阅读 · 0 评论 -
element-ui下拉输入框+resetFields无法回显
实际场景用方法二会比较好点,如果有100个下拉框,给初始值的话,那你就要给100个内容进行初始化,很浪费时间。在vue3中也存在这样的情况,不知道这是不是resetFields遗留下来的bug,还需要看一下resetFields的源码。具体的原理还需要大家在评论区进行补充,附上vue3试验的代码。原创 2025-01-08 11:11:48 · 615 阅读 · 0 评论 -
JS处理下划线
这道题比较绕的是根据当前字符是双引号还是下划线,以及是否处于引号内,来决定是否分割当前段落。我们可以使用inQuotes的状态,当遇到双引号时,它会进行切换,根据状态进行筛选内容。原创 2024-10-25 14:07:17 · 651 阅读 · 0 评论 -
JS螺旋矩阵II
该题目是通过模拟螺旋填充的过程,生成一个 n x n 的螺旋矩阵。首先初始化变量和二维零矩阵,然后按照从左到右、从上到下、从右到左、从下到上的顺序填充矩阵,最后处理矩阵大小为奇数时的特殊情况,返回生成的螺旋矩阵。这道面试题算是高频出现的题目之一,它并不要求掌握复杂的算法,而是侧重于模拟某个过程,但非常考验我们对代码的驾驭和把握能力。原创 2024-10-25 13:48:00 · 388 阅读 · 0 评论 -
JS计算宝宝的年龄
这个题目还算是比较简单的,需要考虑的月份差,如果是需要精确到日,那就需要更复杂的逻辑进行处理,jym靠你们了😘😘。原创 2024-10-24 17:23:20 · 494 阅读 · 0 评论 -
JS长度最小的子数组
窗口内是什么?sum≥target的长度最小的 连续 子数组。如何移动窗口的起始位置?当sum≥target时,就要移动如何移动窗口的结束位置?for循环遍历的索引滑动窗口的精妙之处在于根据当前子序列和大小的情况,不断调节子序列的起始位置。从而将O(n^2)暴力解法降为O(n)。代码随想录。原创 2024-10-24 16:54:27 · 797 阅读 · 0 评论 -
JS有序数组的平方
这题要求将给定非递减顺序数组的每个数字平方后,再按非递减顺序排序。一开始我们会想到采用暴力解法先平方后排序,但更优解为使用双指针法,从数组两端向中间遍历,比较平方值后逆序放入新数组,时间复杂度为O(n),空间复杂度为O(1)。代码随想录。原创 2024-10-23 23:04:24 · 681 阅读 · 0 评论 -
JS移除元素
双指针相对暴力解决法来说,时间复杂度更低,实际应用中,通常会选择时间复杂度更低的方法(如方法二或方法三)以提高性能。代码随想录力扣题目链接。原创 2024-10-23 19:52:46 · 915 阅读 · 0 评论 -
JS两数之和
本题其实有四个重点,把这四点想清楚了,本题才算是彻底理解了。为什么会想到用哈希表哈希表为什么用map本题map是用来存什么的map中的key和value用来存什么的为什么会想到用哈希表当我们需要查询一个元素是否出现过,或者一个元素是否在集合里的时候,就要第一时间想到哈希法。哈希表为什么用map在JavaScript中,Map是一种内建的哈希表实现,它允许我们使用任何类型的键(key),不仅仅是字符串。在这个问题中,我们使用数字作为键,这是Map非常适合的场景。此外,Map。原创 2024-10-22 18:43:24 · 1005 阅读 · 0 评论 -
JS二分查找
二分法的核心在于通过不断地将搜索区间一分为二,来逐步缩小搜索范围,直至找到目标值或确定目标值不存在。而在这个过程中,搜索区间的定义(是左闭右闭、左闭右开,还是其他)以及相应的边界处理方式是至关重要的。代码随想录。原创 2024-10-22 18:41:06 · 909 阅读 · 0 评论 -
JS数组去重
JS数组去重原创 2024-10-20 15:12:29 · 644 阅读 · 0 评论 -
JS闭包的特性和应用场景
当通过调用一个外部函数返回的一个内部函数后,即使外部函数执行已经结束了,但是内部函数引用了外部函数中的变量也依旧需要被保存在内存中,我们把这些变量的集合叫做闭包。我们定义行为,然后把它关联到某个用户事件上(点击或者按键)。我们的代码通常会作为一个回调(事件触发时调用的函数)绑定到事件上。原生的setTimeout传递的第一个函数不能带参数,通过闭包可以实现传参效果。用闭包定义能访问私有函数和私有变量的公有函数。原创 2024-10-20 15:10:36 · 589 阅读 · 0 评论 -
flex实现骰(tou)子点数
文章目录效果演示分析思路代码实现效果演示分析思路5点需要使用margin进行移动点数。而6点的话,使用align-content: space-between;和 justify-content: space-between;就能实现,不过需要注意的是主轴为侧轴,dot的第二个要给padding才能实现每一列3个点。代码实现<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-原创 2024-08-30 00:09:11 · 742 阅读 · 0 评论 -
js计算器实现
给每个按钮添加点击事件,使用。原创 2024-04-06 11:32:23 · 816 阅读 · 0 评论 -
js的qq换肤效果
/ //使用this(this:谁调用我,我代表谁.this就代表点击的那个图片)// //设置body的背景为点击的图片。使用 forEach 进行循环,可以省略 i。// //添加点击事件。使用 for 进行循环。原创 2024-04-05 08:38:33 · 870 阅读 · 0 评论 -
js猜拳游戏
将点击事件进行动态绑定。将点击事件进行行内绑定。原创 2024-04-04 09:21:40 · 1612 阅读 · 0 评论 -
js手持小风扇
【代码】js手持小风扇。原创 2024-04-03 07:51:14 · 1120 阅读 · 0 评论 -
JS的DOM事件
js 对象:本质是一个对象(类的实例),不能在网络上传输(后台经常将对象转成 js 字符串,通过网络发给前台)。json 字符串:本质上是一个字符串,可以用于网络传输(从后台接收到的数据大部分都是 json)。是 JavaScript 内置的专门用于 DOM 的对象,该对象包含了若干的属性和方法,**match()**方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。使用字符串的 match 方法判断图片的 src 属性值,进行切换。方法来判断图片的 src 属性值,进行切换。原创 2024-04-02 13:28:46 · 1295 阅读 · 0 评论 -
js计算出生天数
使用一元运算符+转成毫秒值,再相减。转成毫秒值,再相减。原创 2024-04-01 08:57:46 · 454 阅读 · 0 评论 -
js分发扑克牌
底牌最后三张扑克牌。原创 2024-03-31 08:58:38 · 368 阅读 · 0 评论 -
js的Number对象和全局对象
把数字转换为字符串,结果的小数点后有指定位数的数字。对象,在 nodejs 中代表 global 对象。使用 Function 构造函数创建一个无参的函数。使用 Function 构造函数创建一个带参的函数。它的属性和方法都不需要加上对象名(window)。页面中最大对象(顶级对象),在浏览器的环境中代表。Number 对象是原始数值的包装对象。检测指定参数是否为整数。指示某个值是不是数字值。函数本质是对象类型,由。原创 2024-03-30 11:52:04 · 832 阅读 · 0 评论 -
js的String对象
正则表达式用于对字符串模式匹配及检索替换,是对字符串执行模式匹配的强大工具。用于处理文本(字符串)的对象。这个插件,用来生成正则表达式。写一个方法校验 qq 号。原创 2024-03-30 11:50:54 · 631 阅读 · 0 评论 -
js的Date对象
使用带参构造(传数字类型的参数),创建出来的就是指定的时间对象(月份是从 0 开始计算的)。使用带参构造(传字符串类型的参数),创建出来的也是指定的时间对象。使用无参构造,创建出来的就是当前的时间对象。只想或当前的时间对象,使用方式一即可。想要获取指定时间对象,使用方式三即可。Date 对象用于处理日期与时间。原创 2024-03-29 12:25:43 · 525 阅读 · 0 评论 -
js的对象
对具有相同属性和行为的事物的统称。这里创建一个最简单的类(只有类名,没有属性和方法)。原创 2024-03-28 22:44:30 · 1173 阅读 · 2 评论 -
js的数组
定义数组,数据中可以存放真正的数据,如小白、小黑、小胖等这些都是数组中的数据,我们这些数据称为数组单元,数组单元之间使用英文逗号分隔。获取用户的输入的数据,求这个数据在数组中第一次出现的索引,如果不存在,得到的结果为-1。属性,它的含义是获取数组的长度,数组属于对象类型。向数组的末尾添加一个或更多元素,并返回新的长度。向数组的开头添加一个或更多元素,并返回新的长度。数组的数组,二维数组里面的元素都是一维数组。连接两个数组 (不改变原数组的内容)。从尾巴删除一个元素并返回删除的元素。从数组中添加或删除元素。原创 2024-03-28 22:31:31 · 1082 阅读 · 0 评论 -
js选择语句
case 穿透会从满足条件的那个语句开始,依次执行,即使后面的 case 不满足条件,也会执行,直到出现 break 才会跳出 switch 语句。输入一个月份,判断月份属于哪个季节: 12,1,2 冬季 3,4,5 春季 6,7,8 夏季 9,10,11 秋季。从上往下,依次判断每一个条件,如果满足,就会执行对应的语句体,剩下的即使满足也不会执行。中的条件,符合条件,就执行下面的代码块,每个代码块用。如果你的工作年限小于 1 年,你的年假是 5 天。,就执行大括号的代码块,如果为。原创 2024-03-27 08:29:50 · 1329 阅读 · 0 评论 -
js流程控制
流程控制就是来控制代码按照一定结构顺序来执行。是最简单的,从上往下,依次执行的。原创 2024-03-27 08:29:00 · 362 阅读 · 0 评论 -
js运算符
如果左边表达式不成立(已经确定了整个表达式是 false),右边就没有必要执行,就发生了短路,可以提高效率。如果左边表达式成立(已经确定了整个表达式是 true),右边就没有必要执行,就发生了短路,可以提高效率。与:&&当且仅当两边都为 true 才返回 true,同真为真,一假为假。或:||一边为 true,返回 true,一真为真,同假为假。js 小数在某些情况下,显示的是一个无限接近的数。弹框录入一个 3 位数,求每一位上的数相加的和。取反,真变假,假变真。++在后,先运算再自增。原创 2024-03-26 13:09:29 · 1054 阅读 · 0 评论 -
js概念及入门
但在操作页面上的元素和操作浏览器方面各有各自独特的方法,因而 BOM 和 DOM 的实现各个厂商是不一样的。JavaScript,JScript 等脚本语言都是基于 ECMAScript 标准实现的,因此在。JavaScript 由 ECMAScript,DOM 和 BOM 三者组成的。一般将 JavaScript 代码写在独立的以 .js 结尾的文件中,然后通过。一种运行在客户端的脚本语言(也可以运行在服务端,比如 nodejs)。输入任意内容会以弹窗形式出现在浏览器中,一般提示用户输入一些内容。原创 2024-03-25 08:48:47 · 769 阅读 · 0 评论