小钢炮的博客

1、下面是使用一个url的界面生成const puppeteer = require('puppeteer');const createPDF = async () => { const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto('https://example.com'); const pdf = await page.pdf({ forma

1、需要锁的场景例如：nodejs写了一个定时任务，如下：const schedule = require('node-schedule')schedule.scheduleJob("0 * * * * *", () => { runTask()})上述代码，每分钟执行一次 runTask 方法。如果将上代码部署两个实例服务器上，那么实际效果是两份实例都会执行定时任务。实际上就会变成每分钟执行两次。2、乐观锁乐观锁用于做并发的控制。大致的设计思路为：

1. apache-dubbo-jsnode调用dubbo，使用工具库：apache-dubbo-js代码地址：https://github.com/apache/dubbo-jsnpm安装npm install apache-dubbo-js2. 新建一个serviceimport { Dubbo } from 'dubbo-js';const demoProvider = dubbo => dubbo.proxyService({ // 包路径 dubboInt

1. 粘性事件就是在发送事件之后再订阅该事件也能收到该事件 。下面代码, 如果是非粘性事件应该打印2。而粘性事件打印应该为1，2EventBus.$emit('add', 1);EventBus.$on('add', (data) => { console.log(data);});EventBus.$emit('add', 2);2. 为何需要粘性事件在vue的开发中，生命周期是需要考虑的，我们通常需要保证监听在事件触发之前。举个例子：我们如何把消息从父组件List发

1. 场景如果我们在已经开发好的一个网站上优化，做ajax请求缓存，不确定他使用了什么ajax工具，应该怎么做。假如开发者使用的是axios，jquery等，我们可以在其中使用axios和jquery的拦截器做拦截。但是flyio提供了一个更简单的方法。2. 使用1.安装flyionpm install flyio --save2.使用如下使用，即可拦截全局的ajaximport fly from 'flyio';import EngineWrapper from 'flyio/dis

content_script和页面js通信content_script不能访问web页面或其它content script中定义的函数和变量，但是可以操作界面dom。我们可以通过dom事件实现界面script和content_script的通信。1.在界面script定义一个自定义事件msgEvent// 注册一个自定事件var event = document.createEvent('Event');event.initEvent('msgEvent', true, true);2.在界面

1. 简单示例// background.js 或者 popup.js// 监听来自content-script的消息chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) { console.log('收到来自content-script的消息：'); console.log(request, sender, sendResponse); sendResponse('我是后台，我

1.安装react-router-domnpm install react-router-dom2.代码import React from 'react';import ReactDOM from 'react-dom';import { BrowserRouter as Router, Route, Switch} from "react-router-dom";function Home() { return <div>home</div>}functio

废话不说，直接贴代码：var arr1 = [1, 2, 3];var arr2 = [4, 5, 6];arr1.push.apply(arr1, arr2);// [1, 2, 3, 4, 5, 6]

安装live-server npm i -g live-server到对应的目录下面启动 live-server --port=8080

插件：基于一个框架的扩展。演示一个进度条插件（基于jquery的开发）jquery扩展方法（任何一个成熟的框架都有扩展自身的方法）// jQuery扩展方法$.fn.test = function() {}$(selector).test();// 变色的插件&lt;span class="btn"&gt;点击我&lt;/span&gt;&lt;span class="btn"...

1.macrotask和microtask对于微任务和宏任务这里不做介绍。我们在写一些封装逻辑的时候，需要用到macrotask和microtask。这里我参(chao)考(xi) vue.js的实现，封装macrotask和microtask。2.macrotask封装macrotask 有setTimeout、MessageChannel、postMessage、setImmediate...

1 写作的目的写作的目的是为了让人阅读。所以写作的风格取决于读者，而不是作者。作为一篇好文章，一般都具有以下特点：结构整洁，中心明确。语言易懂，逻辑清晰。不是展现作者华丽的辞藻，也不是节约出版社的纸张。2 javascript的写作风格每一个作者都有自己的写作风格。我这里总结的是小钢炮多年以来拜师学艺的东西。希望能给到一定参考作用。方法的行数小于40行。变量和方法命名规范。...

1.看一道面试题问下面的打印结果console.log('0');setTimeout(function() { console.log('1');}, 0);Promise.resolve().then(() =&amp;gt; { console.log('2');}).then(() =&amp;gt; { console.log('3');});async1();a...

1. websocket这篇博主写的比较清楚：https://www.cnblogs.com/jingmoxukong/p/7755643.html1. 客户端实现(1)先画一个简单页面&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt;&lt;/head&gt;&lt;body&am

jquery中的观察者在js中自定义事件便可以实现观察者。

01 js基础作用域闭包原型类继承上下文异步队列02 http交互ajaxget和post状态码jsonp跨域缓存http1.0、http1.1、http2.0和https03 数据结构和算法排序法数组去重List、Map、Set、Tree04 设计思想双向绑定观察者节流器模块化CMD/AMD/UMD插件编写05 jquery...

思考起源于这样一个问题：如果一个A对象的加载时机很难把握，那么我们调用他方法的时候，就很难控制。这样子我们就需要做一个代理对象Proxy，调用A对象上面的方法时，可以统一把消息推送到Proxy上，Proxy将消息存到一个队列里面，然后去嗅探A是否加载，如果A加载完毕，Proxy再把队列里面的消息推送给A。simple is best ! 举一个简单的例子：下面的对象是一个服务...

es6中的class其实js中var和function这两关键字，加上闭包，是足够用了。class关键字是es6推出来的。作为一个js菜鸡，坦白的说 —— 食之无味，弃之可惜。1.class写法constructor是构造器，toString方法可以复写class Person { constructor(name, age) { this.name...

一、准备素材高德地图key值 vue.js (非必要）二、实现&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;script src="https://cdn.

一、让setTimeout去吧经常使用定时器的人都会使用setTimeout，而不使用setInterval，这个很好理解，setTimeout强调的是下次，而setInterval强调的是多次。当去医院看病的时候，医生一般会告诉你下次什么时候来复查，而不是隔多久复查一次。所以在可读性和可靠性上setTimeout更符合。二、请先去排队下面是一道常见的面试题for(...

观察者模式本文所要阐述的知识有以下观察者模式面向对象编程技巧js模块化多规范兼容vue的插件编写js分层编程观察者模式 Markdown 是一种轻量级标记语言，它允许人们使用易读易写的纯文本格式编写文档，然后转换成格式丰富的HTML页面。 —— [ 百度百科 ]使用简单的符号标识不同的标题，将某些文字标记为粗体或者斜体，创建一个链接等，详细语法参考...

拓扑图库一 、前言终于有时间写这个库了，这个库我取名为拓扑图(drawTool.js)，中英文没对上是因为这个库一开始就是叫拓扑图。drawTool.js虽然GitHub上由小钢炮写出，但是却要得益于Z某的设计和M某的实现。 目前drawTool.js已经服务于四个以上的项目，其生命力不言而喻。这也是小钢炮将其开源的目的。分割线 下面说闲事提供解决方案的是框架。 提...

01 vue中自定义指令vue指令// 注册一个全局自定义指令 `v-focus`Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() }})02 标准浏览器自定义事件触发方法w3 Event对象document.creat...

01 callcall是js最好用的函数之一，改变函数执行上下文成为插件编写必须要使用到的。var name = &amp;quot;小钢炮&amp;quot;;var cat = { name: &amp;quot;猫&amp;quot;}function say(name) { console.log(this.name + &amp;quot;-&amp;quot; + name);};say(&amp;quot;ketty

01 context任何方法，谁调用了它，则就是它的context。这个和this的下面描述是一致的：this最终指向的是调用它的对象上下文就是this的指向。三和小钢炮有这样子的理解：从函数编程，到面向对象，再到面向模块。从context来解释：只是改变了方法的context。02 不稳定的contextcontext在js的表现经常出现一些看似&amp;amp;amp;quot;不稳定&amp;amp;amp;quot;的情况，下面罗...

看下面代码public static void main(String[] args) { double c = 0.1 + 0.2; System.out.println(c);}还有js中var c = 0.1 + 0.2;console.log(c);结果都是0.30000000000000004这是由于java和js 采用IEEE二进制浮点数算术标准（IEEE 75...

拦截ajax(function (open) { XMLHttpRequest.prototype.open = function () { let args = arguments; this.addEventListener('readystatechange', function () { if (this.readyState === 4) { ...

js 断点续传1. js断点续传的思路对于一个大文件，可以将其切割成适当的小文件，提交给后台，再由后台合并成大文件。这样做法的好处有：（1）化整为零，可以防止文件上传中断而导致整个文件都需要重新上传的杯具问题。（2）分成小文件，可以利用ajax的多线程，同时提交多个小文件，从而提升上传速度。前端1.切片X是否存在?2.上传切片n3,合并切片后台...

浅谈闭包《javaScript权威指南》对闭包的定义是： 函数体内部的变量都可以保存在函数作用域内，这种特性在计算机学文献中称为“闭包”。jQuery之父对闭包的定义是：一个函数在创建时允许该自身函数访问并操作该自身函数之外的变量时所创建的作用域。一、闭包的误区面试中，经常问道，闭包是什么？经常见到的回答：一个函数里面返回另一个函数，由于变量被外部引用导致局部变量无法被回收...