![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
💛💛JavaScript技术探索与实践💛💛
文章平均质量分 53
欢迎来到“JavaScript技术探索与实践”专栏!这里专注于分享JavaScript的最新技术动态、实战经验和深度解析。无论你是JavaScript的初学者还是资深开发者,都能在这里找到有价值的内容。从基础语法到高级特性,从前端开发到Node.js应用,我们将全面覆盖JavaScript技术的各个
万水千山走遍TML
流落在外的程序员
展开
-
canvas绘制表格
最近在为公司产品做技术预研,经理让用canvas做一个表格,于是就有了这篇博客。在这里为了方便实用我直接封装成组件了,当MQTT数据来了就出发绘制方法。我们的数据是后端通过MQTT推送过来的。具体MQTT的实现代码,可见博客。我在代码中也直接使用了。原创 2024-08-01 17:07:36 · 358 阅读 · 0 评论 -
数据精度丢失
在开发过程中,发现从后台返回的数据结构中的id字段在前端显示为不正确的值。经过排查,怀疑是JavaScript中Number类型精度丢失的问题。通过将id字段的类型从Number改为String进行测试,确认了问题的根源。尝试在前端获取数据后立即转换为String类型,但发现数据在JavaScript中接收时精度已经丢失,因此最佳解决方案是让后端将id字段的类型改为String。原创 2024-07-16 12:17:50 · 416 阅读 · 0 评论 -
前端与嵌入式开发通信之QWebChannel(Qt)
最近开发中需要用到和c++开发的操作台进行通信的的需求,就找到了这个技术,记录一下。原创 2024-07-10 11:23:54 · 263 阅读 · 0 评论 -
函数柯里化和反柯里化
柯里化和反柯里化都是非常有用的编程技巧,让我们可以写出更加灵活通用的函数。理解这两种技术的实现原理可以帮助我们更好地运用它们。在编码中,我们可以根据需要决定是将普通函数柯里化,还是将柯里化函数反柯里化。合理运用这两种技术可以大大提高我们的编程效率。原创 2023-08-02 15:26:49 · 142 阅读 · 0 评论 -
根据数据获取渐变背景色
根据数值返回对应颜色原创 2023-06-16 13:37:21 · 96 阅读 · 0 评论 -
html2canvas实现屏幕截图功能
html2canvas 实现屏幕截图,base64转为blob原创 2023-05-25 16:44:20 · 344 阅读 · 0 评论 -
原型原型链
js原型原型链原创 2023-02-10 09:56:40 · 78 阅读 · 0 评论 -
js语法基础
ji基础原创 2022-07-21 14:58:52 · 82 阅读 · 0 评论 -
js坐标转换
这是一个功能丰富的地理位置坐标转换工具集,它支持WGS-84、GCJ-02和BD-09等多种坐标系统之间的相互转换,同时提供了Web Mercator投影坐标与WGS-84坐标之间的转换功能。此外,该工具集还能精确计算地球上两点间的距离,并判断一个给定的点是否位于中国境内。原创 2022-07-14 09:07:29 · 622 阅读 · 0 评论 -
js中伪数组(类数组)
js中伪数组(类数组)伪数组js中伪数组(类数组)一、伪数组特性二、生成伪数组的方法三、将伪数组转为真正的数组一、伪数组特性具有length属性按索引方式存储数据不具有数组的方法, 比如push(),pop()等二、生成伪数组的方法在js中生成伪数组的方法比较多function的arguments对象document.getElementsByTagName和document.childNodes,返回NodeList对象的都是伪数组上传文件时选择的fi原创 2021-09-23 09:21:57 · 568 阅读 · 0 评论 -
获取url参数
获取url后面参数方法现在前端开发大部分都会用到框架去开发很少用到这种方法。最近在用mock模拟数据时需要用到url后的参数,就写了这个方法。export const getParams = url => { const keyValueArr = url.split('?')[1].split('&') let paramObj = {} keyValueArr.forEach(item => { const keyValue = ite原创 2021-05-15 10:05:40 · 139 阅读 · 0 评论 -
SVG类库
几个基于svg的类库所有现代浏览器都支持SVG文件类型,它很快就成为网站设计人员的首选。您可以设计漂亮的图标作为支持向量机,并缩放到任何大小,而不损失质量。考虑到视网膜显示器的发展,这是SVG格式的最大优点之一。如果你想动画或操纵你的svg,这将需要更多的工作。但是,如果您愿意卷起袖子,亲自动手编写一些代码,这些免费库提供了最好的工具。1. SVG.js我要推荐的第一个库是SVG.js。当然,这是完全免费和开源的,可以在任何类型的web项目中使用。当gzip压缩时,它非常轻量级,原创 2021-04-28 14:51:39 · 1906 阅读 · 0 评论 -
js实现拖拽
js实现拖拽实现方式mousedown、mousemove和mouseup 拖着目标元素在页面任意位置如果要设置物体拖拽,那么必须使用三个事件,并且这三个事件的使用顺序不能颠倒。onmousedown:鼠标按下事件onmousemove:鼠标移动事件onmouseup:鼠标抬起事件重点:1、一定要绝对定位,脱离文档流才可以移动。2、绑定拖拽的元素,移动和鼠标松开后是对document的绑定,因为移动的是整个div。3、点击:a= 获取当前鼠标坐标、b =div距浏览器距离、c =原创 2021-04-14 09:25:57 · 458 阅读 · 0 评论 -
js将下划线命名与驼峰式命名相互转换
js将下划线命名与驼峰式命名相互转换 ###下划线转驼峰式命名// 字符串的下划线格式转驼峰格式,eg:hello_world => helloWorldfunction underline2Hump(s) { return s.replace(/_(\w)/g, function (all, letter) { return letter.toUpperCase() })}// JSON对象的key值转换为驼峰式function jsonToHump原创 2021-04-12 15:33:24 · 1723 阅读 · 0 评论 -
精析WebSocket
概述WebSocket 是什么?WebSocket是一种网络通信协议。RFC6455定义了它的通信标准。WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。为什么需要 WebSocket了解计算机网络协议的人,应该都知道:HTTP 协议是一种无状态的、无连接的、单向的应用层协议。它采用了请求/响应模型。通信请求只能由客户端发起,服务端对请求...原创 2019-07-08 19:48:15 · 107 阅读 · 0 评论 -
事件监听的,添加事件监听,移除事件监听
事件监听的添加与移除事件监听的添加(兼容写法)//el:事件名 不带on type: true:事件捕获; false:事件冒泡 ;fn事件处理函数 function addEvent(el,type,fn){ if(el,addEventListener){ el.addEventListener(type,fn) }else{ el.attachEvent("o...原创 2019-07-22 20:56:26 · 760 阅读 · 0 评论 -
js常用排序
冒泡排序//两两比较,如果第一个值比第二个值大,交换位置,第一轮结束后,得到最大值//以此类推function bubbleSort(arr) { var temp; for(var i=0; i<arr.length; i++) { //最大的元素放最后,只需再循环i-1次 for(var j=0; j<arr.length-...原创 2019-07-13 10:57:02 · 131 阅读 · 0 评论 -
jQuery兄弟元素的那些事
jQuery兄弟元素的获取jQuery.prev(),返回上一个兄弟节点,不是所有的兄弟节点。jQuery.nextAll(),返回所有之后的兄弟节点。jQuery.next(),返回下一个兄弟节点,不是所有的兄弟节点。jQuery.prevAll(),返回所有之前的兄弟节点。jQuery.siblings(),返回兄弟姐妹节点,不分前后。...原创 2019-07-08 15:32:44 · 123 阅读 · 0 评论 -
浅谈set、 map结构
set结构 map结构set结构for of遍历;set.add()添加某个值返回set结构本身;set.size()返回set结构的长度;set.delete()删除某个值,返回布尔值,表示删除是否成功;set.has()返回布尔值表示该值是否为set成员;set.clear() 清除所有成员,没有返回值;set.keys() 返回键名的遍历器set.values()返回键值...原创 2019-07-11 10:46:36 · 188 阅读 · 0 评论 -
简析数组方法
ES5、Es6之数组方法1、ESpush()接受多个参数,并将这些参数放置于数组尾部,返回新数组的长度,原始数组发生改变。pop()不接收参数,从数组尾部删除一个元素,并返回这个删除的元素,原数组发生改变。unshift()接受多个参数并,将这些参数放置于数组头部,返回新数组的长度,原数组发生改变。shift()不接受参数,从数组的头部删除一个元素,并返回这个删除的元素,...原创 2019-07-01 18:04:56 · 135 阅读 · 1 评论 -
闭包
闭包当内部函数使用了外部函数的局部变量时, 产生的一个对象(包含了所有使用了的变量)作用: 在函数执行完后, 局部变量还会存在function outer(){//在一个函数外部能够访问到这个函数内部函数的变量 var num = 1; function inner(){ var n = 2; alert(n + num); } ...原创 2019-06-20 08:21:13 · 88 阅读 · 0 评论 -
Cookie的弊端
Cookie的弊端Cookie数量和长度的限制。每个domain最多只能有20条cookie,每个cookie长度不能超过4KB,否则会被截掉。安全性问题。如果cookie被人拦截了,那人就可以取得所有的session信息。即使加密也与事无补,因为拦截者并不需要知道cookie的意义,他只要原样转发cookie就可以达到目的了。有些状态不可能保存在客户端。例如,为了防止重复提交表单,我们需...原创 2019-06-20 08:15:43 · 177 阅读 · 0 评论 -
企业级axios请求封装
整理一个基于axios请求封装首先是request.js,这个文件是用来处理axios的配置、设置拦截器等等,它创建了一个实例,并将这个实例导出。代码如下,注释都写在里面啦import Vue from 'vue'import axios from 'axios'// 创建 axios 实例const service = axios.create({ baseURL: '/user'...原创 2020-04-04 11:09:56 · 569 阅读 · 0 评论 -
js字符串方法总结(持续更新。。。)
1. substring:不改变原数组,返回一个新数组只传一个参数,表示从此位置一直截取到结束var str = "substring" ;var newStr = str.substring(1);console.log(newStr); //ubstring传两个参数,第一个表示开始截取位置,第二个表示结束截取位置。var str = "substring";var newS...原创 2020-03-23 13:57:00 · 147 阅读 · 0 评论 -
js数组方法
文章目录JS数组方法一、创建数组1. 使用数组字面量表示法2. 使用 Array 构造函数3. Array.of 方法创建数组(es6 新增)4. Array.from 方法创建数组(es6 新增)5. 映射转换二、数组方法1. join()2. push()和 pop()4. sort()5. reverse()6. concat()7. slice()8. splice()9. indexOf()和 lastIndexOf()10. forEach()11. map()12. filter()14原创 2021-01-14 10:31:36 · 413 阅读 · 0 评论 -
防抖与节流
节流与防抖是JavaScript中优化高频事件处理的两种技术。防抖确保事件在停止触发一段时间后只执行一次,适用于搜索框输入、窗口调整等场景,减少不必要的计算。节流则是在固定时间间隔内只执行一次函数,适用于滚动加载、游戏射击等,控制执行频率避免性能问题。选择使用哪种技术取决于具体需求,防抖侧重于停止操作后的响应,节流侧重于控制执行次数。两者均通过减少不必要的函数执行来提升应用性能和用户体验。原创 2021-01-12 15:44:09 · 80 阅读 · 1 评论 -
js深拷贝
deepClone函数实现了对JavaScript值的深度克隆,支持基本数据类型、Date对象、数组及普通对象的克隆。通过递归方式处理复杂数据类型,确保克隆出的对象是深层次的独立副本。函数首先检查值的类型,针对不同类型执行相应的克隆逻辑。对于不支持的类型,将抛出错误。该函数是处理复杂数据结构时确保数据独立性的重要工具。原创 2021-01-12 15:35:32 · 70 阅读 · 1 评论