JavaScript
文章平均质量分 55
Jouryjc
Slowly, more quickly.
展开
-
jscodeshift 那点秘密
在 重构利器 jscodeshift 的末尾,留下了几个问题:怎么做到同时满足 JavaScript 和 TypeScript 的解析?jscodeshift 是如何实现链式调用的?registerMethods 怎么实现,怎么使用?测试工具 testUtils 做了哪些封装?上一篇文章中我们举了一个 ????:export const sum = (a, b) => { console.log('计算下面两个数的和:', a, b); return a + b;};ex原创 2021-08-01 14:59:36 · 453 阅读 · 0 评论 -
javascript中的标签语句label:statement
label:statement语法如上所示,用标签label去定义一个操作。var temp=0; start: for(var i=0; i<5; i++) { for(var m=0; m<5; m++) { if(m==1) { break start; } temp++;原创 2017-05-17 20:55:00 · 2903 阅读 · 0 评论 -
你不知道的&&和||
开发中,编写有一定逼格的代码是每个程序猿都追求的。经常用来判断的符号&&和||,也经常用来定义变量哦,你知道吗?逻辑与(&&): 在有一个操作数不是布尔值的情况下,就不一定返回布尔值。比如以下情况:1、第一个操作数是对象,返回第二个数;var myinfo = {'age':25};console.log(myinfo && 2); //输出2原创 2017-05-17 20:44:53 · 761 阅读 · 0 评论 -
javascript惰性函数
惰性函数有些地方也叫作自定义函数。做法是创建一个新函数并且将其分配保存了另外函数的同一个变量,那么就以一个新函数覆盖了就函数。在某种程度上,回收了旧函数指针以指向一个新函数。而这一切发生在就函数体的内部。在这种情况下,该函数以一个新的实现覆盖并重新定义了自身。var scareMe = function(){ alert("foo"); scareMe = function(){原创 2017-05-23 14:26:32 · 641 阅读 · 0 评论 -
取消鼠标右键默认事件contextmenu
想要web页面充分展示自身特色,修改浏览器默认的右键事件必不可少。右键单击网页,总是弹出另存为、审查元素、查看网页源代码等等之类的菜单。就我看来这是挺影响体验的。像右键这么重要的位置,必须充分利用。调整页面链接之类等等的需求都是可以的。如何实现这个需求?利用浏览器contextmenu事件。支持contextmenu事件的浏览器有IE、Firefox、Safari、Chrome和Opera11+。下原创 2017-04-01 13:15:03 · 6737 阅读 · 0 评论 -
取消鼠标右键默认事件contextmenu
想要web页面充分展示自身特色,修改浏览器默认的右键事件必不可少。右键单击网页,总是弹出另存为、审查元素、查看网页源代码等等之类的菜单。就我看来这是挺影响体验的。像右键这么重要的位置,必须充分利用。调整页面链接之类等等的需求都是可以的。如何实现这个需求?利用浏览器contextmenu事件。支持contextmenu事件的浏览器有IE、Firefox、Safari、Chrome和Opera11+。下原创 2017-04-01 13:14:57 · 2482 阅读 · 0 评论 -
跨兼容浏览器的事件处理程序
从事前端开发工作的童鞋们,肯定会遇到浏览器事件处理兼容问题。从DOM0级事件处理程序到DOM2级事件处理程序。以及IE这个永恒的话题。下面是兼容所有浏览器的时间处理程序,包含添加、删除、阻止冒泡、取消默认行为、获取事件对象event、获取事件目标方面,直接上码:(function(){ var EventUitl = { addHandler : function(eleme原创 2017-03-31 11:41:27 · 501 阅读 · 0 评论 -
简单说一说数据结构——集合
迄今为止,我们已经学习了数组(列表)、栈、队列和链表(及其变种)等顺序数据结构。这一节我们讲讲集合。集合的定义是由一组无序且唯一(即不能重复)的项组成的。不包含任何元素的集合就叫做空集。上高中那会,我们都接触过集合,其中一些概念比如交集、并集、差集等等。ECMAScript6也实现了集合这种数据结构——Set类。而我们用ECMAScript5来实现。也可以为看Set时做铺垫。首先,集合Set类的骨架原创 2017-03-23 16:37:30 · 8198 阅读 · 0 评论 -
js对象浅拷贝和深拷贝详解
分析浅拷贝和深拷贝。转载 2017-03-07 16:29:26 · 287 阅读 · 0 评论 -
Javascript实现二叉搜索树
class Node { //节点结构 constructor(data, left, right) { this.data = data; this.left = left; this.right = right; }}class BinarySearchTree {原创 2017-05-28 11:23:05 · 436 阅读 · 0 评论 -
用eval不如用Function
忘记在哪本书中看到过这样一句话,eval()是一个魔鬼。平时在处理用Ajax请求的JSON数据时,有些人会用eval。这中间存在安全隐患。还有的是,在使用定时函数,setInterval()、setTimeout()时,有些写法也会导致类似eval()的隐患。例如:setTimeout("myFunc()" , 1000);setTimeout("myFunc(1,2,3)" , 1000);ne原创 2017-05-20 11:31:56 · 2484 阅读 · 0 评论 -
Javascript判断数组的方法
用typeof判断数组会返回object,因为数组也是对象。用instanceof Array判断数组在大部分浏览器是没问题的,但是在某些IE浏览器并不能得到正确的结果。一般使用以下两种方法:一是用ES5的Array.isArray()二是如果不支持isArray(),用Object.prototype.toString().call():综合一下:if(typeof Array.isArray =原创 2017-05-20 13:48:41 · 507 阅读 · 0 评论 -
10 种最常见的 Javascript 错误
为了回馈我们的开发者社区,我们查看了数千个项目的数据库,发现了 JavaScript 中频度最高的 10 种错误。我们会告诉你什么原因导致了这些错误,以及如何防止这些错误发生。如果你能够避免落入这些 “陷阱”,你将会成为一个更好的开发者。数据才是王道,我们收集并分析了出现频次排前 10 的 JavaScript 错误。 Rollbar 会收集每个项目的所有错误,并总结每个错误发生的次数。我们通转载 2018-02-07 10:01:39 · 1382 阅读 · 0 评论 -
聊一聊浏览器的内容
今天翻读平时工作做的便签时,注意到了一张浏览器内核相关的记录,尽毫无印象,于是写下这篇文章: 浏览器组成浏览器简单的说由两部分组成:shell + 内核。Shell的含义,简单地说,就是提供给用户操作,以便调用内核去实现各种功能的窗口,例如菜单栏、工具栏等等。内核才是浏览器的核心和最重要的。内核是基于标记语言显示内容的程序或模块,所以一般也称内核为“渲染引擎”(Rendering E...原创 2018-02-11 11:57:59 · 627 阅读 · 0 评论 -
微信JS-SDK中getLocalImgData的坑
经常开发微信web需求的童鞋对微信jssdk肯定不会陌生。但是里面的坑未必都踩过,特此分享这篇填坑教程,与大家共勉。微信获取本地图片接口:wx.getLocalImgData({ localId: '', // 图片的localID success: function (res) { var localData = res.localData; // l原创 2017-10-19 21:06:37 · 23177 阅读 · 10 评论 -
解决type=file中获取不到value值
做前端开发的童鞋肯定会遇到这样的需求,获取表单里面全部input的值。但是也不难发现这样的bug,给type=“file”的input标签赋值value,然后再通过js去获取value的时候,发现根本拿不到想要的那个值,拿到的是空字符串。通过zepto或者jquery的源码也可以看出来,form表单的参数序列化方法serialize$.fn.serializeArray = function() {原创 2017-09-16 10:44:53 · 16701 阅读 · 1 评论 -
javascript常用类型数值比较图
收藏,做桌面,巩固基础了。转载 2017-08-14 15:44:31 · 522 阅读 · 0 评论 -
网站页面性能优化的34条黄金守则
雅虎团队经验:网站页面性能优化的34条黄金守则 1、尽量减少HTTP请求次数 终端用户响应的时间中,有80%用于下载各项内容。这部分时间包括下载页面中的图像、样式表、脚本、Flash等。通过减少页面中的元素可以减少HTTP请求的次数。这是提高网页速度的关键步骤。 减少页面组件的方法其实就是简化页面设计。那么有没有一种方法既能保持页面内容的丰富性又能达到加快响应时间的目的转载 2017-08-14 15:42:33 · 559 阅读 · 0 评论 -
-webkit-touch-callout禁止长按菜单
微信浏览器如果js中的点击事件,长按会弹出一个javascript提示的菜单栏,有打开和取消两个选项。IOS要取消这一个默认事件,可以在父元素使用-webkit-touch-callout:none;来禁止掉这个菜单弹出。该CSS样式有两个可以取的值:default:此值表示显示默认的callout none:此值表示禁用callout`安卓不支持这个css样式,安卓就直接使用HTML5提出的co原创 2017-07-26 10:25:21 · 6679 阅读 · 0 评论 -
localStorage存储代替GET方式
做久了前端开发就会知道,有时候需要把页面A的数据传到页面B上,用URL参数的形式会显得累赘。而且浏览器和服务器对于URL的长度也有所限制。浏览器1、IEIE浏览器(Microsoft Internet Explorer) 对url长度限制是2083(2K+53),超过这个限制,则自动截断(若是form提交则提交按钮不起作用)。2、firefoxfirefox(火狐浏览器)的url长度限制为 65 5原创 2017-07-10 14:21:36 · 1368 阅读 · 0 评论 -
$(...).live is not a function
jquery中的live()方法在jquery1.9及以上的版本中已被废弃了,如果使用,会抛出TypeError: $(…).live is not a function错误。解决方法:之前的用法:.live(events, function) 新方法:.on(eventType, selector, function)若selector不需要,可传入null例子1:之前:$('#mainmenu原创 2017-03-10 15:18:06 · 1005 阅读 · 0 评论 -
简单说一说排序算法
作为一名合格的程序员,还是要懂一些排序算法。学习这个话题,通常都会先学冒泡排序,因为它在所有的排序算法中是最简单也是最**的。当然,简单是不会有好结果的。它的性能也是最差的。冒泡排序通过比较任何两个相邻的项,如果第一个比第二个打,则交换它们。元素项向上移动至正确的顺序,就好像气泡从水中往上冒一样。冒泡因此得名。具体实现代码:function bubbleSort(array){ var原创 2017-03-05 20:17:04 · 732 阅读 · 0 评论 -
带你跳出H5输入框input的坑
移动网页开发中input触发的手机键盘压榨页面布局的解决办法。原创 2016-09-06 18:31:07 · 22484 阅读 · 2 评论 -
canvas动画函数requestAnimationFrame
canvas原生动画函数requestAnimationFrame原创 2016-08-26 14:48:38 · 9436 阅读 · 1 评论 -
对于console,你真的了解它吗?
对于经常使用的console,你是否只会一个console.log呢?转载 2016-09-05 15:01:56 · 1187 阅读 · 0 评论 -
H5系列之“神测试,这些你看过的《还珠格格》”
给大家分享一个H5小游戏,趣味性十足的问答。够胆就来挑战吧!建议使用手机打开游戏链接原创 2016-09-05 12:40:32 · 814 阅读 · 0 评论 -
canvas分享之三角函数(2)
在上一节我们介绍了canvas动画中有关三角函数的内容,以及一个跟随鼠标旋转的箭头动画。那么,在这一节呢!介绍的内容比较多,包括:波形运动圆周运动两点间的距离一.波形运动sin函数的波形想必骚年们不会感到陌生,如果只是考虑一个周期以内的函数波形,如下图所示:如果我们想要取到sin函数在[0, 2π]之间的值,非连续的情况下,可以这样估转载 2016-08-25 18:49:26 · 580 阅读 · 0 评论 -
排序算法之插入排序
学过的东西总是容易忘记阿,想要再重头建起来也不是那么容易的一件事。温故而知新,嘿嘿!今天就把插入排序算法理清。顾名思义,插入,那首先得要有一个能够插的对象——这就是已经排好了序的一个序列。生活中这种事很常见,比如斗地主,如果是一张牌一张牌地拿在手上的话,普通人的大小王永远是放在两端(这取决于每个人的排序习惯)。如上图所示,这时候你拿起了一张7,左手上的牌是排好序的,现在原创 2016-09-12 19:44:17 · 955 阅读 · 0 评论 -
canvas动画效果之星球守护
代码文件如题,我取了个比较炫酷的名字——星球守护。其实呢,也就是一个简单的射击小游戏。作者并不是我,具体的效果可以去这里体验。我对代码做了部分修改与注释,并且添加了爆炸音效,和游戏结束音效。ok!接下来我们就来一步一步的介绍这个游戏完成过程。1.文件结构及静态资源介绍文件结构简单到令人发指--css //c转载 2016-08-31 18:27:35 · 3591 阅读 · 0 评论 -
canvas分享之用户交互
用户交互也许是我们学习canvas动画中首先需要掌握的部分。毕竟,如果没有交互或者向动画中做一些动态的输入,那么这跟看电影有什么区别呢?用户交互基于事件,一般来说包括:鼠标事件,触摸事件和键盘事件。1. 事件和事件执行在理解事件之前,你需要明白什么是listener和handler。listener(即监听器)决定当一个事件发生时是否做出反应。handler(即执行者)是一个函转载 2016-08-29 23:17:37 · 695 阅读 · 0 评论 -
排序算法之冒泡排序
排序算法之冒泡排序原创 2016-09-07 18:33:03 · 976 阅读 · 0 评论 -
React 各种组件关系通信
前言今天群里面有很多都在问关于 React 组件之间是如何通信的问题,之前自己写的时候也遇到过这类问题。下面是我看到的一篇不错英文版的翻译,看过我博客的人都知道,我翻译可能不会按部就班,会尽可能用中文的意思,来将作者要讲述的技术描述清楚。英文能力有限,如果有不对的地方请跟我留言,一定修改……^_^原著序处理 React 组件之间的交流方式,主要取决于组件之间的关系,然而这些转载 2016-11-30 10:33:28 · 3844 阅读 · 0 评论 -
PubSub模式简单实现
PubSub是一种设计模式,中文叫发布订阅模式,简单来说就是消息发布者不直接向订阅者发布消息,而是发布到中介,而中介根据不同主题对消息进行过滤,并通知对该主题感兴趣的订阅者。该模式在前端现在很火的组件化开发十分常用,因为该模式松耦合,易于扩展的优点正式组件化开发所需要的。一个PubSub模型主要方法有3个,订阅,退订,发布,下面尝试在前端实现一个最简单的PubSub模块。var Pub转载 2016-11-30 11:24:59 · 6479 阅读 · 0 评论 -
简单说一说数据结构——队列
上一次我们已经学习了栈。今天我们来说一说队列。队列和栈非常类似,都是非常容易理解的数据结构。队列是遵循先来先服务原则的一组有序的项。队列在尾部添加新元素,并从顶部移除元素。在现实中,最常见的队列的例子就是排队: 排在前面的会先被服务,不管是什么服务。概念的东西非常简单,在这里就不再多说了。接下来声明一些队列可用的方法: enqueue(elements):向队列尾部添加一个或多个新的项。 de原创 2017-02-15 20:42:38 · 1774 阅读 · 0 评论 -
简单说一说数据结构——栈
数组是Javascript里面非常灵活的数据结构,如何用数组来构建栈?栈是一种遵从后进先出(LIFO)的有序集合。新添加的或删除的元素都保存在栈的末尾,称为栈顶,另一端就叫栈底。在栈里,新元素都靠近栈顶,旧元素都接近栈底。现实生活中,书堆就是栈很好的呈现。后面放的就在上面,也是要第一本拿开的。其他就不多说了,栈也是一种比较简单的数据结构。下面,为栈声明一些方法:push(element(s)):添加原创 2017-02-14 17:25:05 · 826 阅读 · 1 评论 -
简单说一说数据结构——链表
数组是一种非常简单的存储数据序列的数据结构。平时开发中,要存储多个元素,数组是最常用的数据结构。但是,在大多数语言中,数组的大小是固定的。从数组的起点或中间插入或移除项的成本非常高,因为需要频繁地移动元素。链表存储有序的元素集合,但不同于数组,链表中的元素在内存中并不是连续放置的。每一个元素由一个存储元素本身的节点和一个指向下一个元素的引用(称为指针或链接)组成。相对于数组,链表添加或者移除元素的时原创 2017-02-20 20:44:36 · 2877 阅读 · 2 评论 -
微信浏览器阻止页面拖动
经常开发H5的童鞋一定会遇到这样的问题,当你的页面中有滑动或者拖拽事件时,整个网页也会随着移动。然后还能够看到域名信息。这是非常崩溃的体验!但是这个问题非常好解决,只要在body标签添加禁止滑动或者拖拽事件即可。这样的话,即使是其他子事件的滑动或者拖拽也会在这里给阻止掉。document.body.addEventListener('touchmove' , function(e){ e.p原创 2017-02-20 13:01:21 · 18179 阅读 · 9 评论 -
Math.random()函数生成n到m间的随机数字
Math.random()函数返回0和1之间的伪随机数,可能为0,但总是小于1,[0,1)生成n-m,包含n但不包含m的整数:第一步算出 m-n的值,假设等于w第二步Math.random()*w第三步Math.random()*w+n第四步parseInt(Math.random()*w+n, 10)生成n-m,不包含n但包含m的整数:第一步算出转载 2016-12-22 09:45:39 · 7975 阅读 · 0 评论 -
带你跳出H5 video的坑
出坑之video原创 2016-12-15 15:35:23 · 8874 阅读 · 0 评论 -
Gulp开发教程(翻译)
对网站资源进行优化,并使用不同浏览器测试并不是网站设计过程中最有意思的部分,但是这个过程中的很多重复的任务能够使用正确的工具自动完成,从而使效率大大提高,这是让很多开发者觉得有趣的地方。Gulp是一个构建系统,它能通过自动执行常见任务,比如编译预处理CSS,压缩JavaScript和刷新浏览器,来改进网站开发的过程。通过本文,我们将知道如何使用Gulp来改变开发流程,从而使开发更加快速高效转载 2016-12-15 11:38:40 · 601 阅读 · 0 评论