JavaScript
文章平均质量分 73
诸葛韩信
飞翔在低空的缺氧人士。
展开
-
uni-app简单的教程(一)
个人简单写明的uni-app入门教程原创 2023-03-09 17:24:39 · 360 阅读 · 1 评论 -
rollup.js 一个简单实用的打包工具
最近在看vue3相关的知识的时候,发现了一个新的打包工具,至少于我而言是新鲜的。它就是rollup.js。一说到JS打包、合并、压缩、模块处理等都会想到webpack,这是王者,当然入门的难度偏高。而vue3中搭配的vite运行速度确实非常快,里边有很多的rollup.js相关的回调函数。而我们今天就来简单的看看rollup.js打包神器。官网地址为Rollup | Rollup原创 2023-02-23 15:12:46 · 1270 阅读 · 0 评论 -
JS—节流与防抖
JS的防抖其实可以理解成为防止抖动,也就是在操作时限内,只做最后一次处理,不让程序过多“抖动”;而节流就是相当于节省能源,可以理解成每隔一段时间执行一次程序,依次做到“节流”。转载 2023-02-15 11:18:16 · 617 阅读 · 0 评论 -
后台文件流xlsx文件,进行下载
现在的需求很简单,就是后端把excel文档通过接口方式,在前端进行接收,是一个文档流,并且文档content是加密过的。原创 2023-02-09 15:24:11 · 465 阅读 · 0 评论 -
JavaScript算法——桶排序
一、桶排序的原理桶排序是计数排序的升级版。它利用了函数的映射关系,高效与否的关键就在于这个映射函数的确定。思路大致是,设置一个定量的数组当作空桶;遍历输入数据,并且把数据一个一个放到对应的桶里去;对每个不是空的桶进行排序;从不是空的桶里把排好序的数据拼接起来。二、静态示意图元素分布在桶中:然后,元素在每个桶中排序:其实,很明显,这是计数排序的优化版,当然也可以说成是升级版。主要是分好桶。三、代码实现function bucketSort(arr, bucketSize) {原创 2022-05-07 16:43:08 · 1039 阅读 · 1 评论 -
JavaScript算法——计数排序
一、原理逻辑:1. 准备一个新的数组=> 遍历原始数组, 把原始数字当做新数组的索引向新数组内填充数据=> 新数组的数据按照计数排列2. 遍历新数组=> 把索引在当做数据放进原始数组内=> 前提: 把原始数组清空二、注意点计数排序的核心在于将输入的数据值转化为键存储在额外开辟的数组空间中。作为一种线性时间复杂度的排序,计数排序要求输入的数据必须是有确定范围的整数。就是遍历数组记录数组下的元素出现过多次,然后把这个元素找个位置先安置下来,简单点说就是以原数组每个元原创 2022-05-06 17:14:51 · 534 阅读 · 0 评论 -
JavaScript算法——堆排序
一、知识准备**首先是堆的概念。**这里的堆其实可以简单的理解成金字塔形的形象体。我们用二叉树来构造,但是我们这个二叉树是完全体,也就是树的扩展是要有顺序排列的。堆是一个完全二叉树。完全二叉树: 二叉树除开最后一层,其他层结点数都达到最大,最后一层的所有结点都集中在左边(左边结点排列满的情况下,右边才能缺失结点)。大顶堆:根结点为最大值,每个结点的值大于或等于其孩子结点的值。小顶堆:根结点为最小值,每个结点的值小于或等于其孩子结点的值。堆的存储: 堆由数组来实现,相当于对二叉树做层序遍历。原创 2022-04-28 17:38:13 · 2064 阅读 · 0 评论 -
JavaScript算法——插入排序
一、概念**插入排序(Insertion-Sort)**的算法描述是一种简单直观的排序算法。它的工作原理是通过构建有序序列,对于未排序数据,在已排序序列中从后向前扫描,找到相应位置并插入。这里需要注意的就是,插入排序是在原来数组上进行对比排序。要借鉴的话,这个如同现实生活中打扑克或者打麻将的时候,把牌排列好,把一手牌给分好我们常用的就是拿出没有排序的部分的牌移动到排好序的牌中,位置定好,让它插入。二、算法描述一般来说,插入排序都采用 in-place 在数组上实现:从第一个元素开始,该元素可以认原创 2022-04-24 19:57:42 · 1828 阅读 · 0 评论 -
JavaScript算法——冒泡排序
一、概念冒泡排序(Bubble Sort)也叫气泡排序、泡沫排序,是一种比较简单的排序算法。它通过遍历数组,比较相邻的两个元素,如果前一个元素比后一个元素大,则交换它们的位置,这样第一次遍历后数组的最大元素就排在了数组的末尾。采用相同的方法再次遍历,直至整个数组都有序为止。这个算法的名字由来是因为越小的元素会经由交换慢慢“浮”到数列的顶端;这样,大的数就移动到了后端。二、算法描述比较相邻的元素。如果第一个比第二个大,就交换它们两个;对每一对相邻元素作同样的工作,从开始第一对到结尾的最后一对,这原创 2022-04-20 10:32:45 · 2250 阅读 · 0 评论 -
JavaScript算法——快速排序
一、概念快速排序算法由 C. A. R. Hoare 在 1960 年提出。它的时间复杂度也是 O(nlogn),但它在时间复杂度为 O(nlogn) 级的几种排序算法中,大多数情况下效率更高,所以快速排序的应用非常广泛。注意: 快速排序不一定是最快的排序方法,这取决于需要排序的数据结构、数据量。不过,大多数情况下,面试官和工作场所用它的概率也是相对较高的,所以我们应该花时间把它学透彻。二、工作原理首先设定一个分界值,通过该分界值将数组分成左右两部分。将大于或等于分界值的数据集中到数组右边原创 2022-04-19 17:26:14 · 6529 阅读 · 0 评论 -
nvm中, vue不是内部或外部命令
最近更换了一个npm的管理器,nvm。安装好了nvm之后,感觉世界都是光明的,可以很随意的更换自己的nodejs的版本,可谓之随心所欲了哇。但是,我居然发现想要重新搞一个vue2的项目玩一下都被可恨的系统提示“vue不是内部或外部命令”。首先,重新安装了一下vuenpm install vue然后再次在命令行输入vue -v还是报了一个“vue不是内部或外部命令”。现在看来,这很明显就是vue的环境变量不对劲导致的问题了。网络上大把的文章都在揭露这个问题,但是没有几个人能够把这个原创 2021-11-24 17:19:21 · 2589 阅读 · 5 评论 -
Teleport——Vue3项目中的传入,传送门
为什么会有Teleport的出现?那是因为写组件有的时候真的很繁琐,而且一个项目有可能有很多tankuang原创 2021-06-18 18:00:50 · 539 阅读 · 0 评论 -
vue的单文件组件
最近翻阅了一下vue。发觉有一个单文件组件之前基本忽视掉了。vue.js中的单文件组件允许在一个文件中定义一个组件的所有内容。也就是说,一个页面或者是一个组件,我们想将他们捆绑在一起,那么vue的这个单文件组件可以做到。正如vue的官网说的,“在很多 Vue 项目中,我们使用 app.component 来定义全局组件,紧接着用 app.mount(’#app’) 在每个页面内指定一个容器元素。”这里的组件,都是相对简单的,而面对一个比较复杂的项目,这种方式就行不通。原因如下:全局定义 (Global原创 2021-06-17 21:24:55 · 1426 阅读 · 8 评论 -
Git常用指令
git config配置 Git 的相关参数。Git 一共有3个配置文件:1. 仓库级的配置文件:在仓库的 .git/.gitconfig,该配置文件只对所在的仓库有效。2. 全局配置文件:Mac 系统在 ~/.gitconfig,Windows 系统在 C:\Users\<用户名>\.gitconfig。3. 系统级的配置文件:在 Git 的安装目录下(Mac 系统下安装目录在 /usr/local/git)的 etc 文件夹中的 gitconfig。作者:笑叶林链接:转载 2021-06-15 18:44:36 · 87 阅读 · 0 评论 -
关于toFixed的精度问题
解决方式一,直接上代码Number.prototype.toFixed = function (s) { var that = this, changenum, index; changenum = (parseInt(that * Math.pow(10, s) + 0.5) / Math.pow(10, s)).toString(); index = changenum.indexOf("."); if (index < 0 &am原创 2021-04-21 17:15:45 · 306 阅读 · 0 评论 -
vue项目中,不修改之前的文件引入ts
前言我们项目中,可能回想着将typescript引入进来,但是又苦于项目过于繁杂,不能够简单的全部文件都修改成ts文件,那么这个时候能不能在新加入的vue文件引入ts相关的语法,而不需要修改其它的文件呢?答案是肯定的。以下是vue-cli3的修改操作。安装依赖首先必须要安装typescript 和 相应的loader 转换器 ts-loader,我们把它们先下载安装到当前项目:npm install typescript ts-loader --save-dev接着我们需要在vue项目中不仅仅原创 2021-03-11 17:40:15 · 1477 阅读 · 1 评论 -
JavaScript的栈和堆的全面阐述
前言讲到栈和堆,我们一般来说都要理解数据结构比较容易明白。而,JavaScript中的栈和堆在数据类型中可以展现得比较透彻。JavaScript中的变量分为基本类型和引用类型。基本类型就是保存在栈内存中的简单数据段,而引用类型指的是那些保存在堆内存中的对象。栈栈会自动分配内存空间,会自动释放,存放基本类型,简单的数据段,占据固定大小的空间。说白了,栈就是供数据存放的空间,数据存放后,就占据了一定的空间。基本类型:String,Number,Boolean,Null,Undefined,还有e原创 2020-09-23 16:30:50 · 174 阅读 · 0 评论 -
typescript入门要点
typescript自从诞生以来,都是前端框架的热点,包括但不限于angular、vue3等热门框架都用ts作为代码的底层统一化处理方案。我个人觉得主要是它是代码可读性和可维护性的优点,让开发者喜爱,其实从长远来看,这个是它的利器,我们当然也得知道,它的开发成本是比较高的,而且它跟一些库结合有点瑕疵,主要的是程序员都是很忙的,学习成本这么高的typescript到底值不值得投入生产,确实需要评估。一、安装 TypeScriptnpm install -g typescript全局安装typescri原创 2020-08-03 18:23:49 · 223 阅读 · 0 评论 -
JavaScript5种对象的命名属性创建(含测试源码)
本博文源于js基础,主要探讨对象的五种创建方式。分别是:花括号创建、使用点操作符创建、Object的create方法、Object的create方法、Object的defineProperty、defineProperties方法还有通过prototype属性创建。使用花括号创建这种方式可类比成java的创建方式。看一个例子就能加深影响:<script> var obj = { v;1.0, getV:function() { return this.v; },转载 2020-07-01 23:51:57 · 257 阅读 · 0 评论 -
Nprogress——页面加载的虚假进度条
Nprogress是一个比较简单的页面加载用进度条(其实也可以用作接口加载进度,或者其它处理加载进度样式)。简单而代码又少。实用度比较高。**1、Nprogress的原理**Nprogress的原理非常简单,就是页面启动的时候,构建一个方法,创建一个div,然后这个div靠近最底部,用fixed定位住,至于样式就是按照自个或者默认走了。相信很多小伙伴都知道,一个页面或者一个接口的进度计算是非常复杂的,即便能够计算出来,那么消耗的性能终究是非常大的,这个时候虚假的进度条的作用就显示它的强大了。一开始进入原创 2020-06-16 17:30:10 · 39606 阅读 · 1 评论 -
浅谈 JS 对象添加 getter与 setter 的5种方法以及如何让对象属性不可配置或枚举
定义 getter 与 setter1.通过对象初始化器定义2.使用 Object.create 方法3.使用 Object.defineProperty 方法4.使用 Object.defineProperties 方法5.使用 Object.prototype.defineGetter 以及 Object.prototype.defineSetter 方法什么是属性描述符创建属性不可配置不可枚举的对象Enumerable 特性Configurable 特新提高..转载 2020-05-21 21:38:55 · 696 阅读 · 0 评论 -
mint-ui Loadmore组件报错解决方式
vue 移动端的项目用了mint-ui;在滑动的时候,它居然有的时候报错,虽然不影响页面的展示和功能的正常显示,但是,就是看着报错就是不爽啊!报错内容:Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.解决方式一:直接在滚动的大块标签上进行样式的控制,touch-actio原创 2020-05-14 16:27:59 · 326 阅读 · 0 评论 -
web网站的安全测试
公司的网站开始有了更多的人点击。所以,老板最近找了一家安全渗透的公司帮忙找找茬。他们测试的点,主要集合如下:最后在我的激励端系统中被发现了一个低危漏洞。点击挟持,这个问题说大肯定不大的,说小,还有可能不太小,万一我们的系统非常多人使用,有一些黑客要误导用户获取用户信息,那么就是赤果果的欺骗了。解决的方式非常简单,就是“修改web服务器配置,添加X-frame-options响应头。”...原创 2020-04-21 17:33:39 · 284 阅读 · 0 评论 -
Eslint和Prettier在vscode编辑器的应用
最近有空,整理代码。发觉之前做业务的时候,代码都没有规范化。导致有很多不需要的变量在占据着内存空间、命名有的时候也没有按照大小驼峰的方式、vue文件的html也是格式各种各样等等一些规范的问题就找了出来。其实做规范是比较简单的。在vscode中,尤其简单。步骤如下(以下是windows的vscode操作):一:eslint的安装1、路程:查看 =》 扩展 =》搜索栏中搜eslint =》点...原创 2020-04-20 18:46:12 · 337 阅读 · 0 评论 -
@import inserts duplicates 在webpack打包的vue项目 css文件重复了
最近,在整理多页面项目的时候,发觉在项目打包之后,css文件中最常引用的common.css文件居然重复出现了!!!dist文件就过大了,css文件居然达到了2mb多,这就让人很烦恼了啊。到底是什么问题导致它这么庞大呢?是因为import多次,然后它重复了吗?还是说css文件标签上style套用了scope?还是说,自己项目中引用的顺序有问题呢?比如说报错chunk chunk-12...原创 2020-04-02 18:56:25 · 1849 阅读 · 0 评论 -
前端面试需要了解熟悉的技术术语
前端已经是一门开始走向强势的it行业,越来越多的专业术语齐平其它后端语言。如果想要面试高级前端,那么需要很高的专业能力,一些技术术语就不可能不熟悉了。一、前端工程化1、前端工程化的概念:是根据软件工程,将前端统一标准化;将前端开发的规范、流程、技术、工具、经验等形成规范并建立成一种标准的体系。2、前端工程化的特点:前端工程化有四个特点:模块化、组件化、自动化、规范化。1)模块化...原创 2020-03-24 15:43:49 · 701 阅读 · 0 评论 -
什么是B/S开发技术?
首先来说b/s和c/s两种软件体系结构。b/s 是browser/server指浏览器和服务器端,在客户机端不用装专门的软件,只要一个浏览器即可.而c/s是client/server指客户机和服务器,在客户机端必须装客户端软件后,才能访问服务器如sql server 2000软件体系结构定义了软件的局部和总体计算部件的构成,以及这些部件之间的相互作用 关系。部件包括诸如服务器、客户、数...转载 2020-03-24 14:37:47 · 4853 阅读 · 0 评论 -
webpck 中添加环境变量
如何在webpack构建的项目中添加环境的变量?需求是这样的,需要在项目打包之后文件的引入添加绝对的路径,而不是相对的路径。比如,打包完成的文件,可能是用来测试用的,测试的地址是aaa.yourcompany.com,而正式环境的地址是bbb.yourcompany.com,这个时候我们往往是用npm run build 来构建项目。那么,因为webpack中没有window环境,就不可能...原创 2019-10-29 17:36:08 · 330 阅读 · 0 评论 -
js防抖和节流
在进行窗口的resize、scroll,输入框内容校验等操作时,如果事件处理函数调用的频率无限制,会加重浏览器的负担,导致用户体验非常糟糕。此时我们可以采用debounce(防抖)和throttle(节流)的方式来减少调用频率,同时又不影响实际效果。函数防抖函数防抖(debounce):当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定的时间到来之前,...转载 2019-10-25 12:23:23 · 125 阅读 · 0 评论 -
最火移动端跨平台方案盘点:React Native、weex、Flutter
1、前言跨平台一直是老生常谈的话题,cordova、ionic、react-native、weex、kotlin-native、flutter等跨平台框架的百花齐放,颇有一股推倒原生开发者的势头。为什么我们需要跨平台开发? 本质上,跨平台开发是为了增加代码复用,减少开发者对多个平台差异适配的工作量,降低开发成本,提高业务专注的同时,提供比web更好的体验。嗯~通俗了说就是:省钱、偷懒。...转载 2019-10-22 18:48:50 · 275 阅读 · 0 评论 -
关于Vue.use()详解
问题相信很多人在用Vue使用别人的组件时,会用到 Vue.use() 。例如:Vue.use(VueRouter)、Vue.use(MintUI)。但是用 axios时,就不需要用 Vue.use(axios),就能直接使用。那这是为什么呐?答案因为 axios 没有 install。什么意思呢?接下来我们自定义一个需要 Vue.use() 的组件,也就是有 install 的组件,...转载 2019-05-24 10:50:48 · 253 阅读 · 0 评论 -
项目中,微信利用jweixin进行图片上传
首先,需求是这样的,要在微信端直接调用相册或者是照相机,如果是照相机的话那就利用file里边的capture="camera"属性即可。如果是要直接定位到相册,那么就得用app里边调用硬件里边的相册了。还好有微信的接口可以用。微信为开发者提供了一套非常完备的接口:上图是微信开发js-sdk文档中的部分接口,其中就有专门的图像接口,而且功能十分完备有拍照、从相册选择图片,原创 2017-12-12 22:01:05 · 4309 阅读 · 0 评论 -
Vue的混入mixins
官方的定义如下:混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。其实,这已经很好理解了,就是用来扩展vue本身构建好的对象的,在vue这个大对象中,进行一个整合,一个对组件选项的组合。下边是官网给出的例子:// 定义一个混入对象var m...原创 2019-08-09 17:26:17 · 158 阅读 · 0 评论 -
在线编辑代码的网站
1、http://js.jsrun.net/FqbKp/edit2、http://www.jq22.com/daima3、https://jsfiddle.net/chrisvfritz/50wL7mdz/4、https://tool.lu/js/5、https://playcode.io/6、https://js.do/7、https://jsbin.com/?html,...原创 2019-07-17 21:01:27 · 928 阅读 · 0 评论 -
Array.prototype.slice.call()方法详解
在很多时候经常看到Array.prototype.slice.call()方法,比如Array.prototype.slice.call(arguments),下面讲一下其原理:1、基本讲解1.在JS里Array是一个类 slice是此类里的一个方法 ,那么使用此方法应该Array.prototype.slice这么去用slice从字面上的意思很容易理解就是截取(当然你不是英肓的话) 这方法...转载 2019-03-08 22:42:41 · 416 阅读 · 0 评论 -
必须要理解掌握的贝塞尔曲线(转载)
在Android开发和面试中(尤其是一些中高级岗位面试),面试官可能会问你自定义控件的详细内容,我们知道自定义控件这一块涉及到的内容很多,回答的越多越深入,那么面试的印象会更好。自定义控件涉及的内容比如测量和绘制、事件分发的处理、动画效果的渲染与实现,当然还有不得不提的贝赛尔曲线(实际上一些面试官自己都不是很理解二阶贝塞尔、三阶贝塞尔曲线等概念)。一些朋友看到以歪果仁大佬名字定义的一些计算公式、...转载 2019-03-08 22:38:02 · 325 阅读 · 0 评论 -
JS关于对象的安全性之扩展,密封,冻结
有时候我们写了一个js库,里面有一些核心对象,我们希望在开发过程中这个核心对象不被修改,这时候就要防止该对象被篡改。Object上有三个方法可以使用可以使用Object.isExtensible(obj)来查看某个对象是否是可扩展的,返回是一个布尔值。2.Object.seal(obj);密封的对象是不可扩展的,在此基础上,他也不能删除属性,但是可以修改属性这时候可以看到虽然给ba...转载 2019-02-13 16:51:28 · 212 阅读 · 0 评论 -
跨域的chrome解决方式
跨域,是前端人员经常都会遇见的。但是,如果缺少了后端人员的配合,以及你对Nginx一窍不通,又不能够用jsonp来操作后端人员的json数据,这个时候你就头痛了。放心,本文试着用两者在浏览器端暴力跨界,允许你在chrome上跨域的方式(别跟我说想要在ie上跨域,在我眼中ie就是半成品,开发环境可以先抛弃ie这个另类,先快速开发大致的功能,然后再去兼容吧!)。方式一:chrome的设置...原创 2018-06-25 16:34:27 · 4291 阅读 · 1 评论 -
es6的异步编程之Promise
现在在前端,JavaScript已经变得越来越规范化和标准化了。比如说之前比较混乱的定义变量的方式已经有了const和let两者官方比较推荐的方式;以及处理完函数以后回调的方式也有了Promise以及async等方法。大家在当前比较推荐的mvvm框架(比如说vue)中还是比较喜欢用Promise,确实它比较简单实用。 大家都知道,promise有三个状态:pending(进行中)、...原创 2018-06-25 15:39:26 · 213 阅读 · 0 评论 -
vue router结合文档以及个人理解
vue-router 基本使用 路由,其实就是指向的意思,当我点击页面上的home按钮时,页面中就要显示home的内容,如果点击页面上的about 按钮,页面中就要显示about 的内容。Home按钮 => home 内容, about按钮 => about 内容,也可以说是一种映射. 所以在页面上有两个部分,一个是点击部分,一个是点击之后,显示内容的部分。 点击之后,怎么做到正确的对应,转载 2018-01-18 19:24:41 · 1954 阅读 · 1 评论