leonsux

Writing

文章

共 25 篇。写代码，也记录代码背后的判断、取舍和方法。

模块化

为什么要有模块化？ 项目庞大时，js文件多，变得不好维护 js文件作用域都是顶层，这会造成变量污染 js文件依赖问题，稍微不注意顺序引入错，代码全报错 CommonJS CommonJS 是一个更偏向于服务器端的规范。NodeJS 采用了这个规范。CommonJS 的一个模块就是

#模块化

React 中 setState 异步 or 同步 ？

根据日常开发中的表现，我们可能理解 setState 是异步的，因为当执行 setState 更新数据后，直接打印会发现数据并没有更新。然而这里表现出的 “异步” 并非真正的异步。 以下直接引用现有结论，原文链接贴在最后。 在React的setState函数实现中，会根据一个变量

#React

React 性能优化

避免不必要的组件更新。 将 props 设置为数组或对象 每次调用 React 组件都会创建新组件，就算传入的数组或对象的值没有改变，他们的引用地址也会发生改变，比如，如果按照如下的写法，那么每次渲染时 style 都是一个新对象 使用 PureComponent、React.m

#React 性能优化

防抖与节流

防抖与节流都是一种优化高频操作的手段。 比如在搜索框输入关键词时，如果不做处理，输入 “keyword” 会触发 7 次搜索，而实际上有效搜索只有最后一次。 节流(throttle): n 秒内只运行一次，若在 n 秒内重复触发，只有一次生效。 防抖(debounce): n 秒

#防抖与节流

网络安全

网络安全 XSS 攻击 跨站脚本攻击，将恶意脚本注入到页面中，例： alert('warning') 。 XSS攻击有两种 一种是通过修改浏览器 URL 导致脚本被注入页面，这种一般会被 chrome 浏览器自动防御 另一种是通过输入框将脚本提交到后端并注入数据库，需要我们手动防

#网络安全

事件循环

我们都知道 js 是单线程的，靠同步任务、异步任务来模拟实现多线程。 代码执行时，同步代码正常在主线程中执行，遇到异步代码（比如异步请求或者settimeout），则进入 Event Table（交给js的运行环境来处理，浏览器或者nodejs），并将其回调函数放入 Event

#事件循环

this指向 & apply与bind重写

函数中 this 的指向 & 箭头函数中 this 的指向 如果调用者函数，被某一个对象所拥有，那么该函数在调用时，内部的this指向该对象。如果函数独立调用，那么该函数内部的this，则指向undefined。但是在非严格模式中，当this指向undefined时，它会被自动指

#this指向#apply、bind

带你搞懂 执行上下文 和 作用域

执行上下文（Execution Context） 每当 Javascript 代码在运行的时候，它都是在执行上下文中运行，用来跟踪记录代码运行时环境的抽象概念。 执行上下文的三种类型： 全局执行上下文 任何不在函数内部的代码都在全局环境中 一个程序只有一个全局执行上下文 全局环境

#执行上下文#作用域#词法环境

LeetCode 刷题笔记【160. 相交链表】

题目 https://leetcode-cn.com/problems/intersection-of-two-linked-lists/ 给你两个单链表的头节点 headA 和 headB ，请你找出并返回两个单链表相交的起始节点。如果两个链表不存在相交节点，返回 null 。

#算法#链表

为你的 GitHub 博客添加 GitTalk 评论系统

Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。 先看一下最终效果，并且欢迎来体验：https://leonsux.github.io 添加授权 首先为我们的博客添加 GitHub 的登陆授权，点击头像到设置里找到新建授权 Settings

#Blog

LeetCode 刷题笔记【35.搜索插入位置】

题目 https://leetcode-cn.com/problems/search-insert-position 给定一个排序数组和一个目标值，在数组中找到目标值，并返回其索引。如果目标值不存在于数组中，返回它将会被按顺序插入的位置。 请必须使用时间复杂度为 O(log n)

#算法#二分查找

LeetCode 刷题笔记【206. 反转链表】

题目 https://leetcode-cn.com/problems/reverse-linked-list 给你单链表的头节点 head ，请你反转链表，并返回反转后的链表。 示例 非递归解法 思路 首先观察示例特点 before： 1 -> 2 -> 3 -> 4 -> 5

#算法#链表

Royal TSX使用

Royal TSX，mac上强力的远程连接管理神器 安装 直接去官网下载即可：https://www.royalapps.com/ts/win/download。 安装 Terminal(SSH) 和 File Transfer(FTPS) 插件 Royal TSX -> Plu

#Royal TSX

关闭Oh my zsh自动更新

感觉最近 Oh my zsh 更新有点频繁，每次打开都询问是否更新，再加上更新也比较慢，干脆关闭自动更新。 首先打开 Oh my zsh 的配置文件 找到 DISABLEAUTOUPDATE="true"(老版本是这个) 这行，可以看到是被注释了的，把注释去掉即可 现在最新版的z

#oh my zsh#zsh

JS中以name作为变量名出现的问题

JS中使用 name 作为变量名出现的问题 今天突然被问到一个问题：我定义了一个数组 var name = ["leon", "jack", "tom"]; ，但是为什么通过下标获取不到正确的值，而且居然能获取到 ,。当时我以为是什么细节问题，仔细检查了一下代码后发现并没有什么问

#Js

Git常用指令

参照廖雪峰的git教程做了下自己的总结，包括一些常用的命令，用于自己查阅 公钥 私钥 在本地创建公钥，加密一波，生成私钥；把公钥传到远端，也加密一波，生成私钥；比较本地私钥和远程私钥，那肯定是一样的啊，所以就不用每次都输入密码了 SSH 1. 创建本地公钥 ssh-keygen

#Git

JS中的作用域问题

JS解析器解析步骤 第一步：寻找代码中定义的变量，函数，参数（预解析，这也是在声明变量前使用变量不报错的原因） 第二部：逐行解读代码 Tips 1. 定义在script中的变量，称为全局变量，函数则称为全局函数，当变量名与函数名一致时会保留函数 2. 当有多个script时，先解

#Js

老生常谈的JS闭包

闭包，虽然工作中用到的频率并不高，但是在面试中用到的频率倒不低，或许，闭包最大的一个功劳就是封装了jQuery吧 闭包 闭包是一个能读取其他函数内部变量的函数： 从这句话我们可以看出： 1. 闭包是一个函数 2. 这个函数能读取到其他函数内部的变量（局部变量） 3. 他能让读取到

#Js#闭包

如何获取jQuery对象类型字符串的值

问题 标题可能有点绕，大致意思就是通过$()，把一个字符串str = "hello"转成了jQuery对象，如何获取到原字符串的值。为什么会有这种需求呢？因为今天封装一个处理字符串的jQuery方法时发现了这个问题。 方法里的this是jQuery对象，并没有原生的replace

#Js#jQuery

JS中不写分号会...

问题 今天突然遇到了一个让我有点摸不着头脑的事儿，大致是这么个情况 按理说应该是理所当然的输出 fn1 和 fn2，但其实是在控制台报了错：Uncaught TypeError: fn1(...) is not a function，瞎说什么？fn1怎么会不是一个function

#Js

去除空白文本节点(空白符)

什么事空白符 空白文本节点是指在编写代码时缩进所造成的换行和空格。 可以借助下面的小demo和图解理解下 处理 理解了空白符现在要了解为什么要去除他。 在开发中可能需要获取一个元素的所有子元素（包括纯文本），就比如： 现在要获取list里的所有元素，包括那句hello word!

#Js

递归那些事

果然还是想递归能让脑子转起来 上一次写递归还是很久以前在学校写扫雷的时候用到的，因为需要遍历地图，当时自己写的时候用队列写的广度优先搜索（BFS），因为相对于比较费脑的递归，用队列好想的多了，但碍于指导老师的要求还是又用递归写了一遍。再往前的话，就是acm的时候做题用到的了，但也

#Js

按年份浏览归档 →