源码 点击这里前往Github获取本文源码 意图 在不破坏封装性的前提下，捕获一个对象的内部状态，并在该对象之外保存这个状态。这样以后就可将该对象恢复到原先保存的状态。...——《设计模式：可复用面向对象软件的基础》中文版第212页 这个常常被运用于游戏存档、操作撤销等场景。 示例 这是一个悲催的故事，内容是一个人先涨薪然后通过本文提到的功能恢复了原来的薪水。...staff.salary) // 17500 staff.restore(careTaker.get(1)) console.log(staff.salary) // 12500 Memento指的是存储下来的数据...Originator，即本文的Staff，是一个可以保存状态并恢复状态的对象。 基本的模型就是上面三个。 参考 设计模式：可复用面向对象软件的基础 JavaScript Memento
；我为了方便都写到一个html中了；请把这个script标签中的内容单独写在一个js文件里 //整个插件写在一个立即执行函数里；就是function(){}();函数自执行；保证里面的变量不会与外界互相影响...； //最后面的undefined可不写；最好写了；保证里面再出现的undefined是未定义的意思；不被其他东西赋值； //好了下面是时候展现真正的技术了 //function前的!...号(叹号)或者;(分号)这不是写错了,为了防止那个二货写的js结束没有分号；而可能发生报错 /* ;function(win,doc,$,undefined){ }(window...this.num = 0;//你也可以写一些其他的默认的东西；比如默认的变量啦；方便下面调用；这里写了什么都不会报错；只是有用没用的问题这行可以忽略 this.author...} //；给构造函数addHtml对象原型里添加属性（方法） addHtml.prototype = {//给函数写方法；这里可能不止一个函数；你还记得你在全局里写一个个的function
http://data.eastmoney.com/jgdy/tj.html 我们希望抓取的是js生成的表格。 ...这种带有js的网站抓取其实不是那么简单的，基本分为那么几种方法，一种是观察页面，有的会有json数据，有的有js代码可以解析目标的url；一种是使用渲染工具；还有一种就是用工具来点击相关button，来抓取...今天我们使用的是第三种。 ? 我们希望爬取的是表格中的数据，但是如果我们仔细看一下html代码，会发现，这其实是js生成的，下面这张图是源代码的截图。 ? ...然后我们就点击第二页、第三页不断的来观察究竟js代码访问了什么后台的url。...接下来我们就可以用urllib来获得api背后的json内容了，比如是这样的： ?
不过从这个例子里也能小小练习一下Promise的用法。 这里要乘100的原因是防止几毫秒差别太小被抢占。...同时，得益于Promise，我们在异步函数里可以这样写： (async () => { const data = await sleepSort([4, 5, 3, 6, 8]) console.log...(data) // [ 3, 4, 5, 6, 8 ] })() 真的是非常的实用，非常的高效啊（赞）。
match(/hello/i); // "Hello" 提取数组中的所有匹配项 使用 g 标志 const testString = "Repeat repeat rePeAT"; const...作为任何字符的占位符 // To match "cat", "BAT", "fAT", "mat" const regexWithWildcard = /.at/gi; const testString...默认情况下，正则表达式是贪婪的（匹配满足给定要求的字符串的最长部分） 使用 ?...用\W 表示 \w 的反义 const noAlphaNumericCharRegex = /\W/gi; const weirdCharacters = "!...没法实时知道，事后为了解决这些BUG，花了大量的时间进行log 调试，这边顺便给大家推荐一个好用的BUG监控工具 Fundebug。
错误注释 你的注释是不是这样的？ //时间戳日期格式化函数 function formTime(time,isyear){ } 亦或者是这样的？.../* 时间戳日期格式化函数 */ function formTime(time,isyear){ } 简单的变量声明之类的内容可以进行简单注释，但是函数就不能这样做了，要知道注释的作用是一种为了让代码更易读...、易维护、易理解，起到提示的作用的，上面的两个注释都是正确的，但是它起到的作用太低了，在正式工作中我们往往会协同开发，这种注释是万万不可的。...，内容详细了很多，当然，不只是单单的内容多了，如果只是内容多了那么/* */段落注释同样也可以写，那么它还有什么优点呢？...npm install jsdoc -g 基本使用 jsdoc 文件名 其他的使用方式可以去官网查看 jsdoc 33.js 执行完此命令，会生成一个out文件夹，查看里面的index页面即可，右边侧边栏会显示函数的使用
2 2--> js.../jquery-1.8.3.js" type="text/javascript" charset="utf-8"> js/2048.js" type="text...（从右到左） var jj = j.toString();//转化为字符串 var jj_next = (j+1).toString();//当前块的右边的那一块所在列...($text); //当前移动块的值在数组的下标 $now.offset({"left":$now_left+100 }).text(_this.arr[$index...//当前移动块的值在数组的下标 $now.offset({"top":$now_top+100 }).text(_this.arr[$index+1])
原文地址：https://github.com/lianxiaozhuang/blog 转载请注明出处 js 写插件教程深入 1.介绍具有安全作用域的构造函数 function Fn(name...就是一个构造函数 //倘若有人忘记写new，直接调用Fn();此时var p = Fn();可见实例p没有getF的方法； //为了解决这种问题；引入了安全作用域的构造函数概念 function Fn...，getC到底写到this里还是原型里 //这要从内存说起；写到原型上，每执行一个实例，getC不需要开辟新的内存 //故，可以把一些纯计算的方法，写原型上，如果方法和实例本身有关，应该写道this中...4.方法名防止冲突处理 //如果在引入你的插件之前，window下已经有Fn的变量；怎么办,你如果这么搞； 岂不是把别人写的Fn搞掉了 //此时应该把Fn的控制权交出，自己用Fn2输出 (function...var MyPlugin = function(options) { this.name = name; this.init(); }; //覆写原型链
如何提高代码的可读性、复用性、扩展性。...，不用考虑参数的顺序。..... } const date = new Date(); addMonthToDate( 1, date ); 删除重复代码，合并相似函数 很多时候虽然是同一个功能，但由于一两个不同点，让你不得不写两个几乎相同的函数...，会浪费你的时间。...class 在 ES6 之前，没有类的语法，只能用构造函数的方式模拟类，可读性非常差。
正则表达式或“regex”用于匹配字符串的各个部分，下面是作者创建正则表达式的备忘单，供大家学习参考。...作为任何字符的占位符 // To match "cat", "BAT", "fAT", "mat" const regexWithWildcard = /.at/gi; const testString...使用字符集内的范围 [a-z] const regexWidthCharRange = /[a-e]at/; const regexWithCharRange = /[a-e]at/; const...默认情况下，正则表达式是贪婪的（匹配满足给定要求的字符串的最长部分） 使用 ?...用W 表示 w 的反义 const noAlphaNumericCharRegex = /W/gi; const weirdCharacters = "!
引入备忘录模式 备忘录模式的实例 备忘录模式的分析 引入备忘录模式 我们在使用文本编辑器的时候，一般如果不小心误操作了，按ctrl+z就可以恢复之前的状态，撤销（undo）操作。...所以，备忘录模式，就引入一个专门表示实例状态的角色，可以在保存和恢复实例的时候有效的防止对象的封装性遭到破坏。...备忘录模式的实例 我们实现一个实例，可以保存实例某个时间点的状态，并且恢复。 ?...备忘录模式分析 备忘录模式的角色： Originator生成者 生成者会在保存自己状态的时候，new一个新的menmeto角色 当需要恢复的时候，只需要把以前的menmeto传给生成者，他就会将自己恢复至...备忘录模式的类图 ? image.png
前言 在这篇文章中,我们将通过 JS 构建我们自己的 JS 解释器,用 JS 写 JS,这听起来很奇怪,尽管如此,这样做我们将更熟悉 JS,也可以学习 JS 引擎是如何工作的!...一个完全使用 javascript 实现的,小型且快速的 javascript 解析器 本次实践我们将使用 acorn.js ,它会帮我们进行词法分析,语法解析并转换为抽象语法树。...Webpack/Rollup/Babel(@babel/parser) 等第三方库也是使用 acorn.js 作为自己 Parser 的基础库。(站在巨人的肩膀上啊!)...acorn.js parse 返回值符合 ESTree spec 描述的 AST 对象,这里我们使用@types/estree 做类型定义。...: Expression | null; } Identifier 顾名思义,标识符节点,我们写 JS 时定义的变量名,函数名,属性名,都归为标识符。
1、下载nw.js https://nwjs.io/ 最好下载sdk版本。 2、解压打开安装包 下载完之后，解压打开 图中的「app文件夹」是我自己创建的，你也需要自己创建一个，里面放你项目文件。...代表app的入口文件，我们这里用的是index.html，就是当app启动的时候第一个页面是什么。...frame：是否使用边框，也就是含有最小化，关闭等按钮的边框。 resizable：是否可以调整窗口大小。 icon：窗口的图标，也是在快速启动栏显示的图标。...然后将app文件夹下的所有文件项目文件压缩成app.zip的压缩文件，将其更改为app.nw文件。...下载链接打开它，选中「app.exe」然后将你刚才下好的nw.js里原始文件（除去你自己生成和创建的文件或文件夹）。
ES6 提供的许多新特性。...用这些新特性，我们能在不降低代码可读性与维护性的基础上畅快地写 JavaScript~ 箭头函数 将数组的内容 * 2 以前我们这么写 [1, 2, 3].map(function(each){...){ name = name || 'Jack'; } 用 ES6 只需这样写 var introSomeBody = (name = 'Jack') => { } 不定参数 数字求和 以前我们这么写...return nums.reduce((prev, curr)=>{ return prev + curr; }, 0); } 解构(Destructuring)赋值 交换两个变量的值...以前我们这么写 var temp = a; a = b; b = a; 用 ES6 只需这样写 [a, b] = [b, a] 参数赋值 以前我们这么写 var introSomeBody = fuction
今天早上在开始讲零基础课的时候，我看了一眼旁边桌上的书，就跟我的学生们聊了一会，看书的必要性。有些前端和互联网方面的书，确实是垃圾，但也要看看，为啥呢？因为面试的时候，你没法保证每一句话都是干货。...就是大致的翻看一下，然后在脑子里有个印像也就算了。 写js这东西，其实并不能每个人都像我一样，在写JS中找到乐趣，就乐意写这东西直到50岁眼瞎为止。...那肯定有人要问，也许我不仅写JS写不到35，可能我连3、5年的时间都写不到。那我学JS的意义在哪里呢？直白的讲，也就是挣点钱儿。...要知道总有些事情是你必须要办，而且很可能它们的紧急程度是一样的，那你该怎么办呢？ 或者你可以像你在写JS的时候那样，把相同的事情分类，然后sort()排序，然后把这些事情分解，按照相关度重新组合。...而这种思考方式，我觉得通过写JS会是一种很好的练习方式。确实也是因为我只会JS。
评论功能资料 在网页上评论功能并不少见，我也想在自己的网站中增加评论功能，好让知道别人对我的网站的看法，还能让别人提醒我哪里出错了。 于是我就去寻找对应的资料去了，之前对评论功能并没有了解过…....【稍微复杂，一个评论可以对应多个回复】 实现评论与回复“盖楼”的方式，这种就是网易的评论【具体可看下面的博文，此种是最复杂的】 这位博主给出了相关的设计数据库过程，我觉得非常好，受益良多 而这位博主就是针对上面所说的第一种情况做的评论功能...(对我来说还是有点难）… 个人备忘录编写 之前就想做个人备忘录这个功能的了，本来是想用“手机短信”的方式来提示用户设置了备忘录的。...就直接使用邮箱了（因为我的账户体系本来就是用邮箱的） 既然是用户设置时间、发邮件提示，那么我第一时间想到的是Quartz任务定时调度框架… 后来，觉得当前的Quartz的知识不足够我去写这么一个功能，于是就去找资料重新学了一下...Quartz触发器的时间的..不过没有用到那个技术..
html+css+js写抽奖程序 简介：本文讲解，如何使用html+css+js写抽奖程序，后面也会加上后端，记录每一次的抽奖的结果。 HTML结构 这个html结构就十分的简单，几行而已。...的渲染，然后使得这个显示的结果是这个样子，这些都是很简单那的，主要是需要思考的是这个，js的逻辑怎么编写。...display: inline-block; margin-left: 40%; } #top{ margin-left: 15%; } js...当我们完成了随机数的产生工作之后，现在需要思考的就是，我们产生的随机数需要可以重复，这个时候，我们遇到重复了的之后，就需要重来一次。...然后当我们现在抽到奖品了之后，我们现在需要的是，如何将对应的奖品号，与奖品信息对应，一般人可能的最直接的想法就是if或者是switch容器的方法，但是了我这里用到的就是Map字典，通过这个可以更好的实现这个功能
居然可以用 js 写 PPT 用powerpoint或者keynote写演示文稿，对于代码、数学公式等的支持一直是个痛点。而且对于前端同学来说，一身的css功力用不上也是个痛点。...在我们上面默认的html模板中已经加载了RevealMarkdown插件。所以我们要做的就是在下面的模板上写markdown就好。...我们先把数学公式库的js引进来： js"> 然后在初始化时Reveal.initialize增加对于数学公式的配置,并且引入...而且也可以跟reveal.js的功能有更好的结合。...更进一步 除了上面介绍的基本特性之外，reveal.js支持自动播放、自制插件、支持处理事件等等有利于开发人员写slides的特性。相信能给你的slides带来新的好玩的东西，将汇报与分享变成乐趣。
ASI 在写JS之前，我一直在写Python，习惯了没有分号的代码。 刚好，JS为我们提供了 自动分号插入 Automatic Semicolon Insertion！...这让我们在大部分情况下都不用写分号，非常的优雅。 然而ASI在某些情况下将产生错误。 ASI发生错误的情况 IIFE 立即调用函数表达式 考虑以下代码。...> node 1.js /root/1.js:2 (function log() { ^ TypeError: 1 is not a function 提示显示1不是一个函数，看来引擎把代码理解成了这个样子...> node 1.js a: 4 b: 3 c: 3 d: 4 js把中间的两个swap看成了 [a, b] = [b, a][c, d] = [d, c] 仍然是一个连等，我们需要从右往左看，首先是...所以[2, 1][3, 4]可以写为[1, 2][4]，所以最后的值是undefined。
用原生js写一个"多动症"的简历 预览地址 源码地址 最近在知乎上看到@方应杭用vue写了一个会动的简历，觉得挺好玩的，研究一下其实现思路，决定试试用原生js来实现。...原理分两个部分 页面能看见的不断跳动着的增加的文字，控制 页面的布局效果由藏在"背后的"style标签完成 想象一下你要往一张网页每间隔0.1秒增加一个啊字，是不是开个定时器，间断地往body里面塞啊，...使用es6的写法 使用部分原生dom操作api standard.js(代码风格约束利器) 目录结构如下 最重要的几个模块分别是resumeEditor(简历编辑模块) 、 stylesEditor(...简历样式编辑模块) 、 以及vQuery(封装的dom操作模块) 最后app.js(入口模块)再将几个模块的功能结合起来完成整个项目。...，你没看错，传说中的回调地狱，亮瞎了我的狗眼啊。想必大家和我一样都是不愿意看到这坨恶心的代码的，但对于处理异步问题，回调又的确是一直以来的解决方案之一。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
云直播
