分类：Javascript

2021
10-15

浅谈JavaScript中的parseInt()的妙用

起因写这篇博客的起因是今天在刷leetcode的每日一题，是一道字符串转换整数(atoi)的题，感兴趣的话可以点击题目名称去看一下具体描述。在我多次debug终于成功提交之后，去评论区看了一下大佬们的解题思路，看完之后不禁感叹javascript中原来parseInt()已经这么优秀了啊。这告诉我了一个道理，我们自认为再熟悉不过的api，可能我们并没有真正意义上的掌握。”我的解答/***@param{string}str*@return{number}*/varmyAtoi... 继续阅读 >
2021
10-15

JavaScript sleep睡眠函数的使用

目录1.sleep函数2.setTimeout3.Promise4.asyncawait5.1s后输出12s后输出23s后输出3参考文章：1.sleep函数JavaScript是单线程运行的，没有内置的sleep函数，现在模拟实现sleep延迟执行的效果。使用睡眠函数实现红绿灯代码，红灯2秒，黄灯1秒，绿灯3秒，循环改变颜色。2.setTimeout直接使用setTimeout实现sleep()的方法，兼容性最好，但是使用了回调函数的实现方式，代码的可读性和维护性不是很好。//setTimeoutletfun=(... 继续阅读 >
2021
10-13

JavaScript实现的七种排序算法总结（推荐！）

目录前言冒泡排序基础算法第二种写法是在基础算法的基础上改良而来的：选择排序基础算法二元选择排序-优化插入排序交换法插入排序移动法希尔排序堆排序快速排序归并排序总结前言所谓排序算法，即通过特定的算法因式将一组或多组数据按照既定模式进行重新排序。这种新序列遵循着一定的规则，体现出一定的规律，因此，经处理后的数据便于筛选和计算，大大提高了计算效率。对于排序，我们首先要求其具有一定的稳定性，即当两个相同的... 继续阅读 >
2021
10-12

JavaScript接入百度地图API的方法步骤

JavaScript接入百度地图API的方法步骤 目录一、百度地图API接入二、在HTML中使用百度地图API1、在html中引入百度地图js文件2、在网页中定义一个DIV用于显示地图3、在网页中显示地图4、添加可选控件5、定位功能6、添加地图标记7、给地图标记添加点击事件8、添加信息窗口9、路径规划10、正逆地址解析一、百度地图API接入1、搜索百度地图开发平台2、注册百度账号3、登陆并申请成为开发者4、在百度地图开发平台的首页选择控制台，在控制台中创建应用创建好应用以后就能在控... 继续阅读 >
2021
09-22

JavaScript中的50+个实用工具函数小结

JavaScript可以做很多出色的事情，本篇文章给大家整理50+个实用工具函数，可以帮助你提高工作效率并可以帮助调试代码1、isStatic:检测数据是不是除了symbol外的原始数据。functionisStatic(value){return(typeofvalue==='string'||typeofvalue==='number'||typeofvalue==='boolean'||typeofvalue==='undefined'||value===null)}2、isPrimitive：检测数据是... 继续阅读 >
2021
09-14

javascript input图片上传及预览,FileReader预览图片

FileReader是前端进行文件处理的一个重要的Api，特别是在对图片的处理上，如果你想知道图片的处理原理，你就永远不可能绕过它。<!DOCTYPEhtml><html><head><metacharset="utf-8"><title></title><styletype="text/css">.file-ipt{position:absolute;left:0;top:0;opacity:0;width:50px;height:25px;}//这里透明化了input框，然后绝对定位在按钮上了.btn{width:50px;height:25px;background-color:skyblue... 继续阅读 >
2021
09-07

浅谈JavaScript宏任务和微任务执行顺序

浅谈JavaScript宏任务和微任务执行顺序 目录一、JavaScript单线程1.同步任务（synchronous） 2.异步任务（asynchronous）二、任务队列(taskqueue)1.执行栈扩展一下setTimeout的理解一、JavaScript单线程JavaScript是单线程指的是同一时间只能干一件事情，只有前面的事情执行完，才能执行后面的事情。导致遇到耗时的任务时后面的代码无法执行。在此之前啊我们必须了解同步和异步 1.同步任务（synchronous） console.log(123);console.log(456... 继续阅读 >
2021
08-31

Javascript结合Vue实现对任意迷宫图片的自动寻路

Javascript结合Vue实现对任意迷宫图片的自动寻路 目录前言二维数组，一本道映射基础界面广度优先，地毯式搜索地图编辑优化寻路算法对图片进行寻路自定义起始点，以及随时变更路线处理彩色图片性能优化前言可以直接体验最终效果：https://maze-vite.vercel.app/寻路前：寻路后，自动在图片上生成红色路径，蓝色是探索过的区域：这里我故意用手机斜着角度拍，就是为了展示程序完全可以处理手机从现实拍摄的迷宫图片。整个程序我准备用Vue3+Vite来写，但其实用不用Vue都一样，... 继续阅读 >
2021
08-23

详解JavaScript面向对象实战之封装拖拽对象

目录概述1、如何让一个DOM元素动起来2、如何获取当前浏览器支持的transform兼容写法3、如何获取元素的初始位置5、我们需要用到哪些事件？6、拖拽的原理7、我又来推荐思维导图辅助写代码了8、代码实现part1、准备工作part2、功能函数part3、声明三个事件的回调函数9、封装拖拽对象概述为了能够帮助大家了解更多的方式与进行对比，我会使用三种不同的方式来实现拖拽。不封装对象直接实现；利用原生JavaScript封装拖拽对象；... 继续阅读 >
2021
08-23

详解JavaScript堆栈与拷贝

目录一.堆栈的定义二.JS堆栈研究1、栈（stack）和堆（heap）2、基本类型和引用类型3、传值与传址三.拷贝1.浅拷贝2.深度拷贝一.堆栈的定义1.栈是一种特殊的线性表。其特殊性在于限定插入和删除数据元素的操作只能在线性表的一端进行。结论：后进先出（LastInFirstOut），简称为LIFO线性表。栈的应用有：数制转换，语法词法分析，表达式求值等2.队列(Queue)也是一种运算受限的线性表，它的运算限制与栈不同，是两头都有限制，插入... 继续阅读 >
2021
08-06

详解javascript中的Strict模式

目录简介使用Strictmodestrictmode的新特性强制抛出异常简化变量的使用简化arguments让javascript变得更加安全保留关键字和function的位置总结简介在ES5中，引入了strict模式，我们可以称之为严格模式。相应的sloppymode就可以被称为非严格模式。严格模式并不是非严格模式的一个子集，相反的严格模式在语义上和非严格模式都发生了一定的变化，所以我们在使用过程中，一定要经过严格的测试。以保证在严格模式下程序的执行和非严... 继续阅读 >
2021
07-22

javascript实现数组最大值和最小值的6种方法

给定一个数组[1,8,5,4,3,9,2],编写一个算法，得到数组的最大值9，和最小值1。1、通过prototype属性扩展min()函数和max()函数算法1的思路是在自定义min()和max()函数中，通过循环由第一个值依次与后面的值作比较，动态更新最大值和最小值，从而找到结果。//最小值Array.prototype.min=function(){letmin=this[0];letlen=this.length;for(leti=1;i<len;i+... 继续阅读 >
2021
07-22

JavaScript offset实现鼠标坐标获取和窗口内模块拖动

JavaScript offset实现鼠标坐标获取和窗口内模块拖动 offsetoffset即偏移量，使用offset系列相关属性可以动态的获取该元素的位置（偏移）、大小等，如：元素距离带有定位父元素的位置获取元素自身的大小（宽度高度）注：返回的数值不带单位offset系列常用的属性包括：   element.offsetParent   返回作为该元素带有定位的父级元素，如果父级元素没有定位，则返回body   注意，parentNode和offsetParent还是有本质上的区别... 继续阅读 >
2021
07-17

详解JavaScript Alert函数执行顺序问题

目录问题分析解决替换Alert()函数setTimeOut函数小结问题前几天使用JavaScript写HTML页面时遇到了一个奇怪的问题：我想实现的功能是通过confirm()弹窗让用户选择不同的需求，每次选择后都将选择结果暂时输出到页面上，最后一次选择结束后再一次性将选项传到后端处理。代码类似于：varstep1=confirm("execstep1?");$('#result').html($('#result').html()+"\n"+step1);varstep2=confirm("execstep2?")... 继续阅读 >
2021
07-08

JavaScript 中如何实现大文件并行下载

目录一、HTTP范围请求1.1Range语法二、如何实现大文件下载2.1定义辅助函数2.2大文件下载使用示例三、总结相信有些小伙伴已经了解大文件上传的解决方案，在上传大文件时，为了提高上传的效率，我们一般会使用Blob.slice方法对大文件按照指定的大小进行切割，然后在开启多线程进行分块上传，等所有分块都成功上传后，再通知服务端进行分块合并。那么对大文件下载来说，我们能否采用类似的思想呢？在服务端支持Range请求首部... 继续阅读 >
2021
07-08

JavaScript 中如何实现并发控制

目录一、并发控制简介1.1阶段一1.2阶段二1.3阶段三二、并发控制的实现2.1asyncPool的使用2.2asyncPoolES7实现2.3asyncPoolES6实现三、阿宝哥有话说3.1手写Promise.all3.2手写Promise.race四、参考资源一、并发控制简介假设有6个待办任务要执行，而我们希望限制同时执行的任务个数，即最多只有2个任务能同时执行。当正在执行任务列表中的任何1个任务完成后，程序会自动从待办任务列表中获取新的待办任务并... 继续阅读 >