yleave的博客

  2021届的秋招算是结束了，趁着还有点记忆，做个小结，再挖几个坑后面慢慢填~  先介绍一下个人背景：双非本，985水硕，前端知识主要从研一下开始学起，属于断断续续学习那种，前端项目主要是实验室相关项目，没有什么有含金量的奖项，就是非常非常普通的一个科班菜鸟。  春招（暑期实习）收获了蚂蚁、美团、拼多多、腾讯和莉莉丝这几家的 offer，最后选择了蚂蚁但是限于毕业论文的压力，暑期实习没去成????…  暑假都在实验室呆着了，时间较多，准备稍微充分了一些（误，实际上春招是什么水平到秋招基本也差不多??

个人博客文章目录几种常见的 CSRF 攻击：1. GET 类型的 CSRF 攻击2. POST 类型的 CSRF 攻击3. 链接类型的 CSRFCSRF 特点防护策略同源检测几种 Referer 策略CSRF TokenCookie 的 SameSite 属性REFCSRF（Cross-site Request Forgery），跨站请求伪造攻击，简单来说就是攻击者诱导受害者进入第三方网站，在第三方网站中，向被攻击网站发送请求，并利用受害者在被攻击网站中获取的用户凭证，达到冒充受害者的目的，并使用受害

个人博客  JS 中有一个奇怪的现象：  我们知道，instanceof 关键字是用于判断左值的原型链上是否存在右值，那按照这样的话不就是说 Object 和 Function 存在循环继承了吗？  那 Function 和 Object 的关系到底是什么呢？探究  其实对于所有构造函数/类，其 __proto__ 属性都是指向了一个函数：ƒ () { [native code] }，而 Function 的 prototype 属性也指向了这个函数：  而这个 [naitve code]

  咱先看看全景图实现效果：展示地址  截图：  体验了一下是不是感觉周围环境转了一圈，感觉世界是圆的？????  没错！恭喜你答对了！地球就是圆的！????全景效果实现  有了上面的提示，对 threejs 有一点了解的小伙伴可能就猜出来了，这个全景效果其实就是使用一个球体实现的~ 而我们只是在球体内表面上贴了一张纹理贴图而已（滚轮向外滚就可以看到这个球体了，看上去像个玻璃球，怪好看的，还有个彩蛋????（好吧，说出来就不是彩蛋了））：  初始时，我们的视角在球体正中心，视角的移动则是依靠

  记一个 react 程序报的错误：Expected an assignment or function call and instead saw an expression，直译是：需要是一个函数调用或赋值，不过却是一个表达式。  这个错误让我摸不着头脑，反复看代码也没发现哪出问题了，最后在看到这篇文章的时候才发现是哪错了（箭头函数里的括号问题）。这里记录一下来加深印象，也给出现同样问题的朋友们提供一个案例。  其实主要也是自己基础不扎实的问题  在我对箭头函数的印象中：若箭头函数的函数体中只有一

文章目录原生 JS 实现 div 拖拽HTML 拖拽 APIREF  之前找实习的时候，面试官出了道 “原生 JS 实现 div 元素拖拽”，当时实现了个大概，不过很多细节都没写好，刚好最近又看到了相关文章，因此这里再好好整理一下 JS 中的元素拖拽实现。原生 JS 实现 div 拖拽实现效果：演示地址  要实现这样的元素拖拽效果，一般思路是这样的：首先要被拖拽的 div 元素需要是定位元素，因为我们要使用 left 和 top 样式来不断更新 div 的位置设置一个 flag ，当鼠标左键在

文章目录问题背景ASI 插入分号的时机1. JS 中一些语法后加上换行符后会自动加上分号2. 并入新行后若成为非法语句则会自动插入分号3. 以自增/减运算符 ++、-- 开头4.特殊情况如何查看自动插入分号后的代码小结REF个人博客文章同步地址问题背景  敲代码的时候写了一条判断语句，大致作用是判断两个长方体是否贴合，因此需要对三个维度分别进行判断：return check(b1.min.x, b2.min.x) && check(b1.max.x, b2.max.x) &a

文章目录词法作用域执行上下文与词法环境闭包闭包练习作用域链REF  个人博客文章同步地址词法作用域  JS 使用的是词法作用域（或称为静态作用域），函数的作用域在定义的时候就决定了，与词法作用域相对的是动态作用域，动态作用域会在运行时确定的。  一个《JS权威指南》中的例子：var scope = "global scope";function checkscope(){ var scope = "local scope"; function f(){ retur

文章目录选点绘线动态绘制线段和显示距离文字居中撤销操作  测距功能，也就是选择两点，计算它们的距离，实现效果大致如下：  上图中主要涉及几个操作：点击鼠标左键选点，点击鼠标右键停止选点，若选择点数超过两点，则两点绘制一条线段动态绘制线段动态绘制距离确定两点后将距离文字居中按下 ESC 键撤销上一步操作选点绘线  首先，我们需要通过鼠标在三维空间中选点，但是我们的屏幕是二维的，还有一维不知道，因此没办法直接凭空选点，因此目前的选点都是基于某个物体来的，即在物体上选点。那么要如何获取鼠

文章目录基本概念三大原则使用 Redux 最简单的示例：计数器梳理使用 react-redux 的示例：计数器梳理使用 combineReducers 合并 reducer中间件自定义中间件使用第三方中间件异步中间件使用 redux-thunk 的示例Redux 示例优化Redux 调试工具REFDemo 仓库：https://github.com/yleave/redux-demo基本概念  有几个图片可以帮助理解 redux:  这张图片说明了 reudx 的作用：组件间的信息传递不用再只能通过

文章目录闭包1. 闭包可以访问当前函数以外的变量2. 即使外部函数已结束，闭包仍能访问其中定义的变量3. 闭包可以更新外部变量的值作用域链全局环境非嵌套的函数嵌套的函数多个闭包闭包  引用红皮书 p178 上对闭包的陈述：闭包是指有权访问另一个函数作用域中的变量的函数。  有两个要点：闭包是函数它可以访问另一个函数的作用域中的变量  闭包有几个特点：1. 闭包可以访问当前函数以外的变量function getOuter() { let date = '112'; f

文章目录1. 根据相机是否移动来判断是否进行了拖拽2.设置鼠标监听事件小结  前因：想实现一个小功能，有一个参数 lockTiles，当鼠标在屏幕上拖动时，参数 lockTiles 设置为 true，停止拖动时，lockTiles 重设为 false。  思考了一下，这个功能并不难，有两个方向可以实现这个功能：根据相机是否移动来设置设置鼠标监听事件，使用 mousedown、mousemove 和 mouseup 来判断是否进行了拖动  不过在对鼠标进行事件监听时遇到了一些坑点。。1. 根据

文章目录从一个示例开始全局安装方式局部安装方式官网  介绍：webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。  （简单来说就是在使用ES6的模块编程时，webpack会分析这些文件的关系，然后打包成一个 JS 文件，最后直接使用这个 JS 文件即可。从一个示例

文章目录  根据 webpack 版本的不同，安装的 babel 依赖有些区别，下面的是 webpakc 4.2 及以上版本安装的依赖。 4.2 之前的是：babel-core、babel-preset-env  要配置 babel 首先需要安装 @babel/core，这是 babel 的核心编译包：cnpm install --save-dev @babel.core  然后需要安装 babel-loader 来帮助我们加载使用 babel：cnpm i --save-dev babel-lo

文章目录121.买卖股票的最佳时机解法1：122.买卖股票的最佳时机 II解法1：贪心1解法2：贪心2解法3：动态规划空间优化123. 买卖股票的最佳时机 III解法1：动态规划188. 买卖股票的最佳时机 IV解法1：动态规划309. 最佳买卖股票时机含冷冻期解法1：动态规划714. 买卖股票的最佳时机含手续费解法1：贪心解法2：动态规划股票问题小结总结一下力扣上的股票交易问题。有：121.买卖股票的最佳时机122. 买卖股票的最佳时机 II123. 买卖股票的最佳时机 III1

文章目录prototype`__proto__`constructor原型的原型实例与原型链补充constructor`__proto__`属性 “继承”  首先，在 JS 中可以使用类或构造函数来创建一个实例：function Person() {}// orclass Person {}Person.prototype.name = 'Kevin';let p1 = new Person();let p2 = new Person();// p1.name === p2.name =

文章目录作用域静态作用域和动态作用域作用域  作用域是指程序源代码中定义变量的区域。  它规定了如何查找变量，也是就确定当前执行代码对变量的访问权限。  JS 采用了词法作用域（lexical scoping），也就是静态作用域。静态作用域和动态作用域  JS 采用的词法作用域是静态作用域，因此函数的作用域在函数定义的时候就决定了。  与静态作用域相对的是动态作用域，函数的作用域是在函数调用的时候才决定的。例如：var value = 1;function foo() { co

文章目录变量的存放内存回收垃圾回收算法引用计数标记清除内存泄漏内存泄漏的识别方法1 浏览器方法2 命令行方法四种常见的 JS 内存泄漏1.意外的全局变量2. 被遗忘的计时器或回调函数3. 脱离 DOM 的引用4. 闭包  JS 内存空间分为 栈、堆、池（一般归类为栈中）。其中栈存放变量，堆存放复杂对象，池存放常量，因此也叫常量池。变量的存放  JS 使用了传统的堆栈来保存变量：基本类型：保存在栈内存中，这些类型在内存中有固定的大小，通过按值来访问。基本数据类型一共有 6 种：Undefined、N

https://leetcode-cn.com/problems/evaluate-division/  给出方程式 A / B = k, 其中 A 和 B 均为用字符串表示的变量， k 是一个浮点型数字。根据已知方程式求解问题，并返回计算结果。如果结果不存在，则返回 -1.0。  输入总是有效的。你可以假设除法运算中不会出现除数为 0 的情况，且不存在任何矛盾的结果。示例 1：输入：equations = [["a","b"],["b","c"]], values = [2.0,3.0], qu

https://leetcode-cn.com/problems/perfect-squares/  给定正整数 n，找到若干个完全平方数（比如 1, 4, 9, 16, …）使得它们的和等于 n。你需要让组成和的完全平方数的个数最少。示例 1:输入: n = 12输出: 3解释: 12 = 4 + 4 + 4.示例 2:输入: n = 13输出: 2解释: 13 = 4 + 9.解法1：递归 + 记忆数组  对于一个正整数数 n，我们需要找出它的最少完全平方数的组合个数。  首先