JavaScript
文章平均质量分 58
js集
江一铭
江一铭,字咏之,号逍遥居士。读书人,爱文学,软件工程理工男,IP浙江在职,从业五年。主攻前端方向技术研发,副攻Unity 3D、IOS客户端、Python人工智能等。2021年被评为华为云享专家,阿里云专家博主,前端领域优质创作者等。
展开
-
js生成年月+字母+五位数的编码,实现字母递增与五位数序号递增
这块儿的逻辑有问题,只能算到B。C就不行了。也就是说AB两个字母都可以算满,99999x2 大概20w的数据,嗯,短时间内肯定是发现不了,本来想用取余算的。算了,早就不想干了,20w的数据,不得添加好几年??我早就走了,给后人留个坑吧,奈斯!!拜拜!!原创 2022-09-02 18:13:12 · 3202 阅读 · 2 评论 -
一天一个javascript小技巧【可选链操作符】
可选链操作符 ( ?. ) 允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空 (nullish ) (null 或者 undefined) 的情况下不会引起错误,该表达式短路返回值是 undefined。与函数调用一起使用时,如果给定的函数不存在,则返回 undefined。...原创 2022-07-04 15:04:40 · 1061 阅读 · 0 评论 -
javascript随机生成用户名的方法
node编程中最重要的思想就是模块化,import 和 require 都是被模块化所使用。在 ES6 当中,用 export 导出接口,用 import 引入模块。但是在 node 模块中,使用module.exports导出接口,使用 require 引入模块。...原创 2022-06-17 09:21:37 · 5429 阅读 · 0 评论 -
vue项目使用qrcode插件生成二维码
下载导入使用清除或者你还可以这么写原创 2022-06-09 19:19:02 · 1920 阅读 · 0 评论 -
前端Vue监听路由变化, 点击页面内按钮跳转菜单更改导航菜单选中状态
实际项目开发中有时候需要根据路由的变化去实进行一些操作,在此,我总结了三种方法。1、watch监听// 监听,当路由发生变化的时候执行watch:{ $route(to,from){ console.log(to.path); }},或者// 监听,当路由发生变化的时候执行watch: { $route: { handler: function(val, oldVal){ console.log(val); }, // 深度观察监听.原创 2022-05-09 12:29:58 · 4510 阅读 · 2 评论 -
前端【vue】实现文档在线预览功能,在线预览pdf、word、xls、ppt等office文件
前端江太公前端实现文档在线预览功能最直接的就是使用XDOC 文档云服务XDOC可以实现预览以DataURI表示的DOC文档,此外XDOC还可以实现文本、带参数文本、html文本、json文本、公文等在线预览,具体实现方法请看官方文档下面这种方式可以实现快速预览word但是对文件使用的编辑器可能会有一些限制XDOC文档预览服务接口简单,只需要传入文档地址XDOC文档预览云服务:https://view.xdocin.com/.看看XDOC如何做Word文档预览: https://view..原创 2022-03-22 10:37:42 · 12936 阅读 · 15 评论 -
前端VUE【实战】—— mixin混入用法总结
个人博客:前端江太公前言混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。一、组件和混入的区别单纯组件引用: 父组件 + 子组件 >>> 父组件 + 子组件mixins: 父组件 + 子组件 >>> new父组件二、混入 (mixin)的作用多个组件可以共享数据和方法,在使用mixin的组件中引入后,mixin.原创 2022-03-18 18:21:42 · 2390 阅读 · 0 评论 -
Vue项目:js模拟点击a标签下载文件并重命名,URL文件地址下载方法、请求接口下载文件方法总结。
URL文件地址下载方法一、正常情况下,我们都如此下载文件并修改文件名,在a标签上面添加download属性 //文件下载 downFile() { if ('download' in document.createElement('a')) { // 非IE下载 const elink = document.createElement('a') elink.href = imgView + 'group1/M00/00/88/FG原创 2022-02-18 11:59:33 · 6356 阅读 · 1 评论 -
javascript函数防抖节流,适用于搜索多次触发请求等场景。
使用节流防抖函数(性能优化) 那么在 vue 中怎么使用呢: 在公共方法中(如 untils.js 中),加入函数防抖和节流方法 // 防抖export function _debounce(fn, delay) { var delay = delay || 200; var timer; return function () { var th = this; var args = arg...原创 2022-01-26 15:55:14 · 1207 阅读 · 0 评论 -
JavaScript中基本数据类型和引用数据类型的区别
JavaScript中基本数据类型和引用数据类型的区别 1、基本数据类型和引用数据类型 ECMAScript包括两个不同类型的值:基本数据类型和引用数据类型。 基本数据类型指的是简单的数据段,引用数据类型指的是有多个值构成的对象。 当我们把变量赋值给一个变量时,解析器首先要确认的就是这个值是基本类型值还是引用类型值。2、常见的基本数据类型: Number、String 、Boolean、Null和Undefined。基本数据类型是按值访问的,因为可以直接操作保存在变...原创 2022-01-12 15:41:12 · 1423 阅读 · 0 评论 -
前端des加密信息
idnumberDes.js 加解密封装需要先安装 CryptoJS npm i crypto-jsimport CryptoJS from "crypto-js";// des加密,isHex表示结果是否有密文,输出hex,否则输出base64// key为加密的秘钥。message 为需要加密的信息let encryptByDES = function (message, key, isHex = true) { var keyHex = CryptoJS.enc.Utf8.par原创 2021-12-24 10:43:53 · 1884 阅读 · 0 评论 -
crypto-js aes 加解密
前端 crypto-js aes 加解密背景前段时间公司做项目,该项目涉及到的敏感数据比较多,经过的一波讨论之后,决定前后端进行接口加密处理,采用的是 AES + BASE64 算法加密~网上关于 AES 对称加密的算法介绍挺多的,对这一块还不是特别理解的小伙伴可自行百度,这里我推荐一篇AES加密算法的详细介绍与实现,讲的还是蛮详细的~具体实现其实搞懂了是怎么一回事,做起来还是挺简单的,因为库都是现成的,我们只需要会用就好啦,这里我在推荐一篇理解AES加密解密的使用方法,加深大家对 AES 算法的原创 2021-12-21 17:20:02 · 1648 阅读 · 0 评论 -
圣诞将至:js加html5教你写出动态旋转圣诞树。
js与H5 canvas实现动态旋转圣诞树效果图:源代码 <canvas id="c" height="356" width="446"> <script> var collapsed = true; function toggle() { var fs = top.document.getElementsByTagName('frameset')[0]; var f = fs.getElementsByTagName('frame');原创 2021-12-20 11:14:42 · 1806 阅读 · 0 评论 -
ES6之Object.assign()用法,Object.assign()到底是浅拷贝还是深拷贝?
基本用法Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。const target = { a: 1 };const source1 = { b: 2 };const source2 = { c: 3 };Object.assign(target, source1, source2);target // {a:1, b:2, c:3}Object.assign方法的第一个参数是目标对象,后面的参数都是源对象。注意,如果目原创 2021-12-10 16:20:52 · 2414 阅读 · 0 评论 -
js代码简化if判断,三元运算符与return
有三元运算符可以很好的代替if else简单语句但是在使用的时候发现 与 return使用的时候 需要用这种形式错误形式: val ? return 1 ? return 0;正确形式: return val ? 1 : 0;示例:vue searchQuery() { if (this.applyReason == undefined) { this.$message.warning('请选择查询类型') return }原创 2021-12-03 11:11:33 · 2164 阅读 · 3 评论 -
js 数组里面去重对象的方法
js数组中对象去重的方法今天在进行百度地图开发时,遇到多个重复的点位,需要将重复的点位进行过滤,正常的数组我们通常都能找到方法进行解决,但对对象数组进行去重处理,有点蒙圈,下面我们就进一步研究 var points = [{ lat: 22.687, lng: 114.014 }, { lat: 22.687, lng: 112.004原创 2021-12-02 10:33:30 · 1345 阅读 · 1 评论 -
JS常见加密混淆方式
目录前端js常见混淆加密保护方式eval方法等字符串参数emscriptenWebAssemblyjs混淆实现JSFuckAAEncodeJJEncode代码压缩变量名混淆字符串混淆自我保护,比如卡死浏览器控制流平坦化僵尸代码注入对象键名替换禁用控制台输出调试保护,比如无限Debug,定时Debug域名锁定前端js常见混淆加密保护方式代码压缩:去除空格、换行等代码加密:eval、emscripten、WebAssembly等代码混淆:变量混淆、常量混淆、控制流扁平化、调试保护等eval方法等字.原创 2021-11-30 16:39:21 · 8499 阅读 · 2 评论 -
小程序使用Base64加密key(秘钥)和iv(偏移量)在进行aes加密,AES加密技术简介与应用。
AES简介AES最一种常见的对称加密算法,对称加密算法也就是加密和解密用相同的密钥。具体的加密流程如下图:明文P 没有经过加密的数据。 密钥K 用来加密明文的密码,在对称加密算法中,加密与解密的密钥是相同的。密钥为接收方与发送方协商产生,但不可以直接在网络上传输,否则会导致密钥泄漏,通常是通过非对称加密算法加密密钥,然后再通过网络传输给对方,或者直接面对面商量密钥。密钥是绝对不可以泄漏的,否则会被攻击者还原密文,窃取机密数据。 AES加密函数 设AES加密函数为E,则 C = E(原创 2021-11-30 13:41:23 · 5686 阅读 · 0 评论 -
JS异步执行,Promise用法
PromisePromise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理且更强大。它最早由社区提出并实现,ES6将其写进了语言标准,统一了用法,并原生提供了Promise对象。特点对象的状态不受外界影响 (3种状态)Pending状态(进行中)Fulfilled状态(已成功)Rejected状态(已失败)一旦状态改变就不会再变 (两种状态改变:成功或失败)Pending -> FulfilledPending -> Rejected原创 2021-11-24 18:12:33 · 1304 阅读 · 0 评论 -
H5与原生混合开发总结
一、引言本文主要针对H5与原生混合开发中的交互问题进行讨论,当然,这仅仅是鄙人的见解,求同存异。本文主要针对以下问题进行总结:如何实现JS与Andriod的交互?针对WebView启动慢问题,如何优化?如果存在多个H5模块包,如何实现模块包的完全更新与部分更新?针对以上问题的,如何建立一个公用的工具集(框架?)?遇到的问题及解决办法。OK, 开始吧!二、交互关于如何实现JS与Android交互,其实看官方的 Building web apps in WebView 这篇文章就够了,如原创 2021-11-23 16:07:05 · 1315 阅读 · 0 评论 -
JavaScript 奇怪又实用的姿势又增加了六个
今天给大家带来一些JavaScript的冷知识,可能你有所耳闻,但也有可能会让你大吃一惊。废话不多说,一起来看看吧!一、解构小技巧平常我们需要用到一个嵌套多层的对象中某些属性,会将其解构出来使用let obj = { part1: { name: '零一', age: 23 }}// 解构const { part1: { name, age } } = obj// 使用console.log(name, age) // 零一 23这种情况下,你把 name 和 age原创 2021-11-15 10:08:26 · 2125 阅读 · 4 评论 -
js校验数组是否为空
校验数组是否为空 <script> const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0; console.log(isNotEmpty([1, 2, 3])); // Result: true console.log(isNotEmpty([])); // Result: false </script>...原创 2021-11-12 17:32:37 · 1181 阅读 · 0 评论 -
js翻转字符串
翻转字符串 <script> // reversevar name = "My city is WH"; var resultStr = name.split('').reverse().join(''); console.log(resultStr); // HW si ytic yM // charAtvar name = "My city is WuHan"; var nameArr原创 2021-11-12 17:31:21 · 1330 阅读 · 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&原创 2021-11-12 17:27:25 · 827 阅读 · 0 评论 -
js求数字的平均值
求数字的平均值 <script> const average = (...args) => args.reduce((a, b) => a + b) / args.length; console.log(average(1, 2, 3, 4));; // Result: 2.5 </script>原创 2021-11-12 17:18:46 · 1440 阅读 · 0 评论 -
js校验数字是奇数还是偶数
校验数字是奇数还是偶数 <script> const isEven = num => num % 2 === 0; console.log(isEven(2)); // Result: True console.log(isEven(3)); // Result: false </script>原创 2021-11-12 17:17:27 · 1354 阅读 · 0 评论 -
js从 URL 获取查询参数
从 URL 获取查询参数 <script> function getParameterByName(name, url) { if (!url) url = window.location.href; name = name.replace(/[\[\]]/g, "\\$&"); var regex = new RegExp("[?&]" + name + "(=([^&#]*原创 2021-11-12 17:16:21 · 1231 阅读 · 0 评论 -
js数组去重
数组去重 <script> const removeDuplicates = (arr) => [...new Set(arr)]; // Result: [ 1, 2, 3, 4, 5, 6 ] console.log(removeDuplicates([1, 2, 3, 3, 4, 4, 5, 5, 6, 6, 6, 6, 5, 4, 3, 1, 6])); </script>原创 2021-11-12 17:13:06 · 1261 阅读 · 0 评论 -
js生成随机十六进制颜色
生成随机十六进制颜色 <script> function randomHexColor() { //随机生成十六进制颜色 var hex = Math.floor(Math.random() * 16777216).toString(16); //生成ffffff以内16进制数 while (hex.length < 6) { //wh原创 2021-11-12 17:10:47 · 1358 阅读 · 0 评论 -
js计算2个日期之间相差多少天
计算2个日期之间相差多少天 <script> function getDays(strDateStart, strDateEnd) { var strSeparator = "-"; //日期分隔符 var oDate1; var oDate2; var iDays; oDate1 = strDateStart.split(strSeparator);原创 2021-11-12 17:04:56 · 4251 阅读 · 3 评论 -
js英文字符串首字母大写
英文字符串首字母大写 <script> /** * 方法一:js字符串切割 * @param {*} str */ function firstToUpper1(str) { return str.trim().toLowerCase().replace(str[0], str[0].toUpperCase()); } /** * 方法二:js正则 * @param {*} str */原创 2021-11-12 17:03:51 · 851 阅读 · 0 评论 -
js检查日期是否合法
检查日期是否合法 <script> function CheckDateTime(str) { var reg = /^(\d+)-(\d{1,2})-(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})$/; var r = str.match(reg); if (r == null) return false; r[2] = r[2] - 1; var d = new D原创 2021-11-12 17:01:58 · 1513 阅读 · 0 评论 -
js禁止右键菜单代码、禁止复制粘贴代码
禁止右键菜单代码、禁止复制粘贴代码 <script type="text/javascript"> //屏蔽右键菜单 document.oncontextmenu = function (event) { if (window.event) { event = window.event; } try { v原创 2021-11-12 17:00:19 · 1161 阅读 · 0 评论 -
js颜色RGB转十六进制
颜色RGB转十六进制 <script> function colorRGBtoHex(color) { var rgb = color.split(','); var r = parseInt(rgb[0].split('(')[1]); var g = parseInt(rgb[1]); var b = parseInt(rgb[2].split(')')[0]);原创 2021-11-12 16:58:09 · 2064 阅读 · 0 评论 -
js获取浏览器版本
获取浏览器版本 <script> function getBrowser() { var UserAgent = navigator.userAgent.toLowerCase(); var browserInfo = {}; var browserArray = { IE: window.ActiveXObject || "ActiveXObject" in wind原创 2021-11-12 16:56:33 · 6181 阅读 · 0 评论 -
34种JavaScript简写优化技术,赶紧收藏起来吧
1.如果有多个条件我们可以在数组中存储多个值,并且可以使用数组 include 方法。//Longhandif (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') { //logic}//Shorthandif (['abc', 'def', 'ghi', 'jkl'].includes(x)) { //logic}2.如果为真…否则简写这对于我们有 if-else 条件,里面不包含更大的逻辑时,是一个较大的捷径。我们可以简单原创 2021-11-12 09:19:16 · 2173 阅读 · 0 评论 -
15个手写JS,巩固你的JS基础(面试高频)
作为前端开发,JS是重中之重,最近结束了面试的高峰期,基本上offer也定下来了就等开奖,趁着这个时间总结下32个手写JS问题,这些都是高频面试题,希望对你能有所帮助。 关于源码都紧遵规范,都可跑通MDN示例,其余的大多会涉及一些关于JS的应用题和本人面试过程 01.数组扁平化 数组扁平化是指将一个多维数组变为一个一维数组const arr = [1, [2, [3, [4, 5]]], 6]; // => [1, 2, 3, 4, 5, 6]方法一:使用flat()const res1 = arr.转载 2021-11-09 19:27:19 · 1167 阅读 · 0 评论 -
20个杀手级 JavaScript 单行代码
今天整理了一些实用的 JavaScript 单行代码,非常好用~~01、获取浏览器Cookie的值通过document.cookie 来查找cookie值const cookie = name => `; ${document.cookie}`.split(`; ${name}=`).pop().split(';').shift();cookie('_ga');// Result: "GA1.2.1929736587.1601974046"02、颜色RGB转十六进制const rgbToHex原创 2021-11-09 19:23:01 · 948 阅读 · 0 评论 -
ECMAScript 2016(ES7) 的新特性总结
快速通道:ES6、ES7、ES8、ES9、ES10、ES11、ES12、ES13新特性大全老样子,先纵览下 ES2016 的新功能,ES2016添加了两个小的特性来说明标准化过程:数组includes()方法,用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回true,否则返回false。a ** b指数运算符,它与 Math.pow(a, b)相同。Array.prototype.includes()includes() 函数用来判断一个数组是否包含一个指定的值,如果包含则返回 true,否.原创 2021-11-09 19:06:00 · 1216 阅读 · 0 评论 -
ECMAScript 2017(ES8) 的新特性总结
快速通道:ES6、ES7、ES8、ES9、ES10、ES11、ES12、ES13新特性大全老样子,先纵览下 ES2018 的新功能:async/await: 异步终极解决方案Object.values()Object.entries()String padding:String.prototype.padStart、String.prototype.padEnd函数参数列表结尾允许逗号Object.getOwnPropertyDescriptors(): 获取一个对象的所有自身属性的描述符,如果没有任何自.原创 2021-11-09 19:04:23 · 1170 阅读 · 0 评论