
JavaScript
YooHoeh
热爱可抵岁月漫长
展开
-
JS实现取任意类型的数组交集并集方法的思考
说到交并集避免不了判断类型是否相同,可能很多人都会想到ES6的Set类型,理所当然的认为可以用Set类型来达到取唯一。但其实没那么简单。下面参考网上的一些代码let a = new Set([1, 2, 3]);let b = new Set([3, 5, 2]); // 并集let unionSet = new Set([...a, ...b]);//[1,2,3,5]// ...原创 2019-11-09 18:32:08 · 294 阅读 · 0 评论 -
JS 可逆加密的一种实现
/* * 利用String对象的charCodeAt()方法和fromCharCode()方法对可用JSON.parse进行序列化的数据进行加密的数据加密解密 * Author: zhangji * Create: 2019.10.22 **/const Crypto = { //加密 encryption(data) { data = JSON.stringify(data...原创 2019-10-23 11:39:26 · 1513 阅读 · 0 评论 -
JS立即执行函数的几种写法
立即执行函数是在函数被声明或者定义后马上执行,其思路就是在函数体后面直接添加括号,如果需要传递参数则直接写在这个括号里面。(function(x){console.log(x)}(1))这个结构中不支持箭头函数(function(x){console.log(x)})(1)这种方式也支持箭头函数,即:((x)=>{console.log(x)})(1) !functi...原创 2019-04-08 13:50:32 · 2984 阅读 · 0 评论 -
JavaScript——浏览器的重绘与回流
文章目录一、浏览器渲染过程?1.1 dom树结构,cssom,renderTree1.2 cssom和dom树怎么匹配结合成renderTree ?二、什么是重绘?回流(重排)?三、哪些情况会发生重绘,回流?四、如何减少回流,重绘?4.1 修改html元素中对应的class名,利用class替换样式4.2. csstext(利用cssText属性合并所有改变,然后一次性写入)4.3 displa...转载 2019-04-18 10:43:44 · 222 阅读 · 0 评论 -
Ajax技术的工作原理
Ajax技术核心就是XMLHttpRequest对象。Ajax技术的工作原理:可以分成3步1.创建Ajax对象:var xhr = new XMLHttpRequest();2.xhr 发送请求:xhr.open('get','test.html','true');xhr.send();3.xhr获取响应:xhr.onreadystatechange = function(){...原创 2019-05-09 14:13:16 · 245 阅读 · 0 评论 -
JS数据结构与算法——二分查找
/** * 二分查找 * @param {Array} arr 待查找数组,数组需要已按照从小到大排序 * @param {Any} x 待查找项 * @return {Number} 如果找到返回位置下标,不存在返回`-1` */function bSearch(arr,x) { let left = 0, //查找左边界 right = arr.length-1,,...原创 2019-05-10 15:30:48 · 198 阅读 · 0 评论 -
关于使用'&&'进行判断的一些思考
接触项目代码的时候经常可以看到例如这样的代码: this.props.planeList && this.props.planeList.differentialConfig && this.props.planeList.differentialConfig.lowPriceRule && this.props.planeLi...原创 2019-06-05 14:20:26 · 431 阅读 · 0 评论 -
JS避免对象多层次获取时报错
有时候我们需要访问一个对象较深的层次,但是如果这个对象某个属性不存在的话就会报错,例如:var data = { a: { b: { c: 'ScriptOJ' } } }data.a.b.c // => scriptojdata.a.b.c.d // => 报错,代码停止执行console.log('ScriptOJ') // => 不会被执行可以封装一个 safe...原创 2019-07-13 17:25:43 · 2011 阅读 · 0 评论 -
将中文姓名转为拼音英文名的一种实现
需要将中文名转为英文名,这里需要考虑到姓氏以及名字多音字选择,这里记录一下我实现的一种思路。以下代码均使用JS来进行说明。处理流程首先需要判断名字长度以及名字规范//中文名格式验证verifyName: function(str) { let re = /[^\u4e00-\u9fa5]/; const isChinese = str => !re.test(str);...原创 2019-10-11 19:00:47 · 8766 阅读 · 0 评论 -
全功能轮播组件封装(详细注释)
在线演示:http://js.jirengu.com/ferojuvonu/2/edit?html,js,output<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=d...原创 2019-04-02 14:18:57 · 337 阅读 · 0 评论 -
原生JS制作简易Tabs组件
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equi...原创 2019-03-31 12:13:15 · 390 阅读 · 0 评论 -
fetch添加超时时间
fetch添加超时时间其实为fetch添加超时时间很简单,需要用到Promise.race()方法.Promise.race() 方法将多个Promise包装成一个新的Promise实例.var p = Promise.race([p1,p2,p3]);上面的代码中,只要p1,p2,p3中有一个实例先改变状态,p的状态就跟着改变,而那个率先改变的Promise实例返回值就传递给...转载 2018-05-28 13:39:37 · 5865 阅读 · 0 评论 -
多角度对比 ES5与ES6的区别
ES5与ES6的对比不同点整理1.Default Parameters(默认参数)es6之前,定义默认参数的方法是在一个方法内部定义var link = function (height, color, url) { var height = height || 50; var color = color || ‘red‘; var url = ...原创 2018-05-28 21:54:42 · 2058 阅读 · 0 评论 -
学不动了,ECMAScript2018都来了
原文:ECMAScript regular expressions are getting better!作者: Mathias Bynens: Google V8引擎开发者译者:Fundebug为了保证可读性,本文采用意译而非直译。另外,本文版权归原作者所有,翻译仅用于学习。1999年,ECMAScript 3添加了对正则表达式的支持。16年之后,ECMAScript 6(即...翻译 2018-08-30 18:29:52 · 2907 阅读 · 0 评论 -
Javascript控制台打印Object对象
Javascript控制台打印Object对象做项目的时候遇到一个问题,在调试代码时需要打印对象来查看具体数值,想了各种方法也没有实现,最后查资料知道了可以使用JSON.stringify()将obj转为字符串后打印,再此记录。 const marks = () => ( this.props.station ? this.props.station.m...原创 2018-09-20 19:50:06 · 22042 阅读 · 2 评论 -
axios简单理解
发起一个GET请求直接使用axios('/user')方法,axios()方法默认为GET方式axios(’/user/12345’);使用axios.get()方法,参数直接写以?key=value的形式,多个使用?key1=value1&amp;key2=value2axios.get('/user?key=value') .then(function (response...原创 2018-10-31 13:17:51 · 2544 阅读 · 0 评论 -
JS将日期转为距现在的时间长度
最近在弄一个回忆网站,其中有个一板块类似于情侣空间的纪念日。照着弄了个类似的,效果如下:在处理过程中需要把时间戳转为Date()对象,然后与本地时间相减获得时间差,通过运算转换成对应的年月日时长,最后转换成对应的字符串。这里我将这一系列操作封装成一个dateConver()函数。下面给出源码。HTML部分<!--因为项目为纯页面文件没有涉及到数据库,所以这里将时间写在标签里--...原创 2018-11-19 21:50:34 · 4409 阅读 · 1 评论 -
JS简单实现分页显示
完整代码源码可以在这里下载1.在 HTML文件建立列表目标节点和翻页器目标节点<body><!--页面控制器 --> <div id="nav"></div> <!--列表显示 --> <div class="root" id="target"><原创 2018-12-12 18:06:26 · 9017 阅读 · 2 评论 -
JS简单实现滚动自动加载新内容(懒加载)
加载源// 这里存后台发来的数据var galleryList = [ { src: &quot;./images/1.jpeg&quot;, desc: &quot;11111&quot; }, { src: &quot;./images/1.jpeg&quot;, desc: &quot;11111&quot;原创 2018-12-12 13:58:38 · 7997 阅读 · 1 评论 -
ESlint开发环境配置
ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具,它的目标是保证代码的一致性和避免错误,是JS开发过程中极佳工具,这篇文章将以WebStorm为例告诉你如何在本地配置ESlint环境。首先,确保你的Node.js版本 (>=4.x), npm版本 2+。这里有两种安装方式:全局安装(学习过程推荐):全局安装在自己的电脑上,以后别的项...原创 2018-05-18 09:38:13 · 5762 阅读 · 0 评论