这是我参与「掘金日新计划 · 6 月更文挑战」的第2天，点击查看活动详情 本文简介 点赞 + 关注 + 收藏 = 学会了 本文讲解在 Fabric.js 中如何自由绘制椭圆形，如果你还不了解 Fabric.js...，可以查阅 《Fabric.js从入门到精通》。...但其实第3步还是有点难度的，我们要考虑几种情况： 点击时的坐标在移动时的左下方 点击时的坐标在移动时的左上方 点击时的坐标在移动时的右上方 点击时的坐标在移动时的右下方 这4种情况我在 《Fabric.js...自由绘制矩形》 里逐一分析过，可以去看看（记得点个赞哦~） 编码 在理清思路后，我们可以正式编码阶段。...代码仓库 ⭐Fabric.js 自由绘制椭圆
本文简介 这次要讲的是 自由绘制圆形 。 在 《Fabric.js 自由绘制矩形》 里讲到的思路，放在圆形里不太适用。 这次要做到的效果如下图所示。...思路 Fabric.js 默认的框选操作是矩形，如果需要做到上图的效果，需要做以下3步： 点击画布时 canvas.on('mouse:down', fn)，创建一个圆形。...如果你想知道在 Vue3 环境下如何实现 Fabric.js 自由绘制矩形，可以在 代码仓库 里查找。 ...canvasMouseDown(e) { downPoint = e.absolutePointer if (currentType === 'circle') { // 使用 Fabric.js
源码管理 源码管理就是配置你代码的存放位置，点击构建项目后，jenkins会按照如下配置拉取代码，然后移动到代码所在目录下，方便操作。...源码浏览器：你所使用的代码仓库管理工具，如github, gitlab，这里点击自动可以让jenkins自动识别。
自由变量的作用域在程序运行前就已经确定！...自由变量相当于Java中的全局变量，它在外层作用域中声明，但在内层作用域中使用，如下所示： var a = 1; function fn(){ console.log(a);//a为自由变量 }...当自由变量所属的函数被定义时，自由变量的值就已经确定，是该函数定义处的父作用域中同名变量的值。...在上述示例中，函数内部的a是自由变量，它的值是fn的父作用域中a的值，也就是1。...注意：自由变量的值一定要去函数定义处找！
为了帮助大家自学 SQL，去年的时候，我一个人做了个 免费 的 闯关式 SQL 自学网，并且决定把代码 完全开源 给大家学习！...查看建表语句功能来帮助你答题，甚至你也可以直接查看答案 4）如果你写的 SQL 语句和预期的结果一致，那么就可以进入下一关啦 也可以直接看下面这张图： SQL 之母使用教程 除了按照顺序过关外，大家还可以进入关卡页面自由选择关卡...、自由学习，不用担心卡在一道题目上过不去、也可以不做自己觉得简单的题目。...其实很简单，我把代码完全开源了，大家可以自行阅读，源码之前没有秘密！ 开源地址：https://github.com/liyupi/sql-mother 很关键的一点是，这个项目 没有后端 ！...首先框架用的是 Vue3，然后站在巨人的肩膀上，核心的 SQL 执行部分使用了 sql.js 开源库，通过 webassembly 实现了浏览器环境内 SQL 的执行。
什么是自由协议 Freedom Protocol（简称FP）是一种新的金融协议，它使质押变得更容易、更高效，并以可持续的固定复利模式为$FREE代币持有者提供加密货币最高的稳定回报。...创建自由协议的目的是建立一个基于区块链的元界世界，由所有自由协议参与者管理。同时，通过长期有效的复利机制，实现每个公民的财富自由，我们希望地球上的每个人都能加入自由协议。 ...用户只需购买Free并将其放入钱包中，即可每15分钟自动获得Free价值的回报，无需抵押，无需收款，一切都由智能合约自动化 自由协议的优势。 一种简单而安全的方式来获得回报。...自由勋章NFT 当您成功成为FP-DAO的合作伙伴后，您将获得自由勋章，该勋章具有固定编号。如果自由勋章被转让，其权利也将被转让。...每卖出一次，分红就会增加，自由勋章持有者可以从自由勋章NFT界面领取。
XSS靶场第一关源码 <!...---- 2.XSS案例：第2关 XSS靶场第二关源码 <!...分析源码 发现是在JS环境中输入PHP变量，接收get传来的name参数赋值给$a 过滤语句：var $a = ""; 存在问题：可以通过构造JS脚本使标签闭合然后加入新标签 alert...运行结果如下图所示，直接弹窗，通过JS闭合标签实现绕过。 另一种方法如下图所示： ---- 7.XSS案例：第7关 XSS靶场第七关源码 <!...分析源码 发现存在字符转义，比如 过滤语句：htmlentities($_GET["name"]) 存在问题：代码在JS环境中输出通过HTML编码的PHP变量，使用htmlentities(
Node.js 进程启动时，首先执行 c / c++ 代码，然后 c / c++ 加载并执行 lib/internal/bootstrap_node.js 并给予一个 process 参数( 运行上下文...) // lib/internal/bootstrap_node.js 概览 // Hello, and welcome to hacking node.js!...exports: 默认值是 {} loaded / loading: NativeModule 状态 _cache: 简单的模块缓存 _source: 模块源码资源 require():...()，源码如下: // bootstrap main module....至此 启动-js部分 已经全部完成，后续模块加载部分，见 Node.js源码解析-require背后 End 启动只是 Node.js 源码的一小部分，除此之外还有大量的内置模块和 c / c++ 源码
此外，SQL 闯关自学项目也是一个让你能好好掌握 SQL 技术的仓库。说回到面试，这个一周获得近 10k star 的 devops-exercises 定能让你好好刷一场面经。...本周特推 1.1 闯关式 SQL 自学：sql-mother 主语言：TypeScript New 免费的闯关式 SQL 自学教程网站，从 0 到 1 带大家掌握常用 SQL 语法，目前一共有 30 多个关卡...除了闯关模式之外，这个项目支持自由选择关卡、自定义关卡、SQL 在线练习广场等功能，方便自由地查漏补缺。...devops-exercises 2.4 图解算法：hello-algo 本周 star 增长数：1,050+ 《Hello 算法》：动画图解、一键运行的数据结构与算法教程，支持 Java, C++, Python, Go, JS...repository/daff67498be14b49b10fd366b8b89767 3.2 网页爬虫：URLFinder 主语言：Go 一款快速提取网页信息的工具，该项目可以快速爬取网页上的 URL 地址、JS
在Google上搜索时，我发现了impress.js的存在，与我的设想不谋而合，于是乎……不再自己造轮子，又花了两天时间熟悉使用impress.js来设计幻灯片，效果完全超越了我的预期。 ...impress.js简单来说仅仅是实现了幻灯片的转场特效的框架，虽说将单页限制在框架之内，但所有单页还是需要自己用代码设计。...花了一天探索了下impress.js源码，其实并不复杂，个人感觉收获颇丰，以下阐述我的收获。.../impress.js"> impress().init(); 源码中的init()函数，分析写在注释中 var init = function(...源码简洁明了，并不复杂，作者的本意也是构建一个基础的框架，让使用者自由发挥，正合吾意！
watch.js 源码解读 用麻雀虽小五脏俱全来描述Watch.js比较合适。“观察者”模式是我们在开发的时候经常需要用到的。...使用Watch.js那么我们就可以实现在“每当对象属性改变的时候，执行你的函数”。...虽然有很多其他的库可以实现相同的功能，但是Watch.js却可以不改变你平时书写代码的方式，并且实现属性改变的监听功能。...”修改的时候“观察者”函数会被调用 ex1.attr1 = "other value";` [try demo](http://jsfiddle.net/NbJuh/17/) Watch.js...总结 抛开watch.js的bug不谈，它还是有很多可圈可点的地方。
手写源码 手写源码才是本文的重点，前面的不过是铺垫，本文手写的目标就是自己写一个express来替换前面用到的express api，其实就是源码解析。...本文所有手写代码全部参照官方源码写成，方法名和变量名尽量与官方保持一致，大家可以对照着看，写到具体的方法时我也会贴出官方源码的地址。...express.js对应的源码看这里：github.com/expressjs/e… app.listen 上面说了，express.js只是一个空壳，真正的app在application.js里面，所以..._router = new Router(); } } 复制代码 app.listen，app.handle和methods处理方法都在application.js里面，application.js...[method] 所以我们来看下Router这个类，下面的代码是从源码中简化出来的： // router/index.js var setPrototypeOf = require('setprototypeof
第二篇文章是看了Express的基本用法，更主要的是看了下他的源码：手写Express.js源码 Express的源码还是比较复杂的，自带了路由处理和静态资源支持等等功能，功能比较全面。...从上面两个例子的代码来看，Koa跟Express有几个明显的区别： ctx替代了req和res 可以使用JS的新API了，比如async和await 手写源码 手写源码前我们看看用到了哪些API，这些就是我们手写的目标...lib/application.js这个文件就是我们经常用的Koa类，虽然我们经常叫他Koa类，但是在源码里面这个类叫做Application。...app.createContext对应的官方源码看这里：github.com/koajs/koa/b… context.js 上面的this.context其实就是来自context.js，所以我们先在...Express源码可以看我之前这篇文章：手写Express.js源码 Koa的思路看起来更清晰，Koa本身的库只是一个内核，只有中间件功能，来的请求会依次经过每一个中间件，然后再出来返回给请求者，这就是大家经常听说的
在看 jQuery 源码时，发现了这段注释： //源码5235行 /* * Helper functions for managing events -- not part of the public...Edwards' addEvent library for many of the ideas. */ jQuery.event = { } Dean Edwards 的 addEvent.js...(http://dean.edwards.name/weblog/2005/10/add-event/)库为 jQuery 的事件绑定提供了很多想法，我们就来看下 2005 年的 addEvent.js...console.log(a,'a55') //{0:'111'} b 改变属性，a 也会改变，因为 b 与 a 指向同一地址（b=a） 一、addEvent() 作用： 为目标元素绑定事件（如 click） 源码...最后： 完整代码请看https://github.com/AttackXiaoJinJin/jQueryExplain/blob/master/addEvent.js.html ----
对，就是看别人写的JS代码。文档嘛，自然是没有的。 之前也有试过看代码，但项目中N多JS文件，每个JS文件上千行，一行一行的看下来，用不了几分钟就完全晕掉了。...于是，这一次，我决定换一个方式读JS源码。 这个项目中有N个JS文件，我把入口的JS文件拿出来先看，然后我把它里面所有的函数名，都用思维导图写出来，就像这样， ?...看小说一行行看就OK，但读源码的重点，不在于要读完并理解每一行JS代码，而在于通过图表和笔记，理解系统的结构和它们之间的关系。...实际上这也是不可能的，每个大项目中上百个JS文件，每个JS文件上千行、几千行代码，这算起来就十万多行了，哪有时间让你慢慢看完。...推广来说，看项目源码，看前端各种构架的源码，它最大的好处就是可以培养自己的对于代码的“层次感”。
Vue.js 的源码都在 src 目录下，其目录结构如下： src ├── compiler # 编译相关 ├── core # 核心代码 ├── platforms...Vue.js 四、server Vue.js 2.0 支持了服务端渲染，所有服务端渲染相关的逻辑都在这个目录下 ?...注意：这部分代码是跑在服务端的 Node.js，不要和跑在浏览器端的 Vue.js 混为一谈 服务端渲染主要的工作是把组件渲染为服务器端的 HTML 字符串，将它们直接发送到浏览器，最后将静态标记"混合...这个目录下的代码逻辑会把 .vue 文件内容解析成一个 JavaScript 的对象 六、shared Vue.js 会定义一些工具方法，这里定义的工具方法都是会被浏览器端的 Vue.js 和服务端的...Vue.js 所共享的 ?
Hyperapp 是最近热度颇高的一款迷你 JS 框架，其源码不到 400 行，压缩 gzip 后只有 1kB，却具有相当高的完成度，拿来实现简单的 web 应用也不在话下。...源码解析 回到源码上来，由于 Hyperapp 所有的操作都在 app 函数中完成，下面就来探究一下 app 函数都做了什么。...该函数主流程相当简单，源码总计十来行，先贴在下面，后面慢慢分析： export function app(state, actions, view, container) { var map = [...我们看一下源码： function scheduleRender() { if (!...在研究其源码前，我们先看一下 Hyperapp 对 actions 中的方法制定的规范，当 state 中无嵌套对象时，总结起来大致是以下几条： 必须是一元函数（只接受一个参数） 函数返回值必须是以下几种
一、前言 avalon.js的影响力愈发强劲，而作为子模块之一的mmDeferred必然成为异步调用模式学习之旅的又一站呢！...三、源码剖析 首先要了解的是mmDeferred中存在Deferred和Promise两个操作集合（两者操作同一个的数据结构实例），Promise...利用JS中变量声明自动提升(hoist)的特性，通过前置return语句将对外接口与具体实现的代码分离。 2....下面是源码 define("mmDeferred", ["avalon"], function(avalon) { var noop = function() { } function...} Deferred.nextTick = avalon.nextTick return Deferred }) 四、总结 源码中还提供了相关资料的链接
由上图可知，JS 代码被略微混淆了，通过 JS 在线解密工具来进行解密：一眼就看到了 m 参数：_0x5d83a3['m'] = _0x57feae + '丨' + _0x2268f9 / ( - 1...') as f: js_code = f.read()context = execjs.compile(js_code).call('results')m = f'{context["cipher...后记在本文中，我们深入探讨了混淆源码的逆向分析过程，通过一系列的步骤逐步破解了复杂的混淆技术。...从跳过断点到分析接口，再到 timestamp 和 cipher 的深入研究，我们不仅掌握了如何应对复杂的 JS 混淆技术，也提供了针对性的解决策略。...以上就是博文 JS 逆向实战：深入解析 JS 源码混淆案例 的所有内容了，希望本篇博文对大家有所帮助！欢迎大家持续关注我的博客，一起分享学习和成长的乐趣！
renderEngine.renderer; //定义一个shader对象 const shader = { //名字必须字段 name: "xxx", //着色器代码中需要与js...，今天分享的内容是ShaderHelper组件中的核心CustomMaterial源码分析。...Effect的实例化 ---- texture与color的初始化比较简，但Eeffect实例化需要三个参数，看下引擎源码： //--------------CustomMaterail.js----...techniques是一个数组，我们接下来看CustomMaterial源码中是怎么创建它的。 4....小结 ---- 本篇的内容有些烧脑，特别是对于像Shawn这种从来不怎么关心底层渲染的人来说在初次读源码完全是一脸的蒙逼。我们暂且不纠结细节，从整体上理清材质系统的框架结构，请看下图： ?
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
