⭐️ 更多前端技术和知识点，搜索订阅号 JS 菌 订阅 检查一个数组为空很容易，直接调用 length 方法即可，那么如何检查一个对象是否为空呢 ❓ 这里的空指的是对象没有自有属性 假设这里有两个对象，一个是 obj 一个是 anotherObj {代码...} ❗️想了半天查看对象是否有 Symbol 属性只能使用 getOwnPropertySymbols 方法，如果...

HTTP 协议是基于 TCP 协议的。大家都知道发送 HTTP 报文需要首先建立客户端和服务端之间的 TCP 连接。TCP 三次握手建立连接，四次挥手断开连接，再熟悉不过。本文实践一下 TCP 建立和断开的整个流程，并通过抓包工具进行逐一分析。

长时间我们一直在使用 document.execCommand 来与剪切板做交互，尤其是基本上都在使用 clipboard.js 这个库，其基本原理也是插入 DOM 树中一个隐藏的 textarea 元素，然后将要复制的文本写入到 textarea 元素中，最后调用 textarea 的 select 方法和 document.execCommand('copy') 方法，然后删除 textarea 元素

内容安全策略的主要作用就是尽量降低网站遭受 XSS 跨站脚本攻击的可能。浏览器没办法区分要执行的代码是否为页面本身的还是恶意注入的，XSS 就是利用这一点对网站进行攻击。 🙁

2019年3月29日目前，Node 对 ES6 Module 的支持又有新进展。一个新的 PR 更新了当前 --experimental-modules 的实现方案。

整个流程主要是创建 PaymentRequest，将购买货物的详细信息传递给浏览器，在 UI 层面显示支付的 UI，用户填入支付信息或从缓存中一键填充并确认支付。

Permission API 不是一个新的标准，早在 2015 年，就已经成为标准。这个 API 的主要作用就是提供一个统一的查询 API 权限的接口。 😌

IDB 操作的基本步骤是 open 方法打开数据库 ? 然后是创建数据库 store 对象仓库 ? 需要注意更新数据库版本应先调用 close 方法关闭旧版数据库 需要注意创建 store 一定要在新版本数据库的 upgradeneeded 事件处理函数中创建，因为本质上他是修改数据库结构 如果对数据库进行数据操作那么需要通过事务来执行 ?。 打开数据...

今天聊聊 xhr 的替代品 Fetch，在全局作用域中有个 fetch 方法方便使用。虽然同样也是处理 HTTP 请求和响应的，但 fetch 有两个不同之处，一个是收到错误的 HTTP 状态码时，fetch 方法返回的 Promise 不会被 reject，而是将 resolve 的对象中名为 ok 属性设置为 false，只有在网络出现故障的情况下才会被 reject。另外一...

PWA（Progressive web apps，渐进式 Web 应用）运用现代的 Web API 以及传统的渐进式增强策略来创建跨平台 Web 应用程序。

浏览器画中画功能允许用户在一个小的叠加窗口中弹出网页中播放的视频 🎥，Chrome 版本大于 71 均默认开启该功能。下面简单介绍一下该 API 如何使用 📖

[译]使用 JavaScript 对象 Rest 和 Spread 的7个技巧 原文作者：Joel Thoms 原文标题：7 Tricks with Resting and Spreading JavaScript Objects 原文：[链接] Rest 和 Spread 操作符不仅仅可以用于让参数休息和扩展数组。 下面针对 JavaScript 对象时使用 Rest 和 Spread 时的 7 个鲜为人知的技巧。 添加属性 克隆一个...

LocalStorage 大家都不陌生基本上每天都在跟他打交道。但这是个会阻塞主线程的同步 API，很多情况下存取大量数据可能会造成性能问题。🙁

记一次自定义导航栏及加载动画的解决方案 主要逻辑就是动态获取设备的 statusBarHeight 和 titleBarHeight，来设置导航栏的高度和 paddingTop ip6 ipx loading 导航栏是一个组件，自定义组件通过 properties 获得 prop 参数的，组件还需要维护 statusBarHeight，titleBarHeight 和 navigatorHeight(实际没用到) 这三个 d...

Interface 是一种描述对象或函数的东西。你可以把它理解为形状，一个对象需要有什么样的属性，函数需要什么参数或返回什么样的值，数组应该是什么样子的，一个类和继承类需要符合什么样的描述等等。下文分七个部分，一起看一下对象接口、函数接口、可索引类型接口、类接口是如何定义的，以及接口的继承、定义混合类型的...

之前提到过尾调用，尾调用就是函数的最后一步调用另外一个函数。那么递归就是调用自身，尾递归就是再函数的最后一步调用自身。😵 和尾调用一样，尾递归因为调用栈中只存在一个调用记录，因此不会像普通递归那样耗费那么多内存。 以乘阶函数为例 {代码...} 计算乘阶函数参数为 n 那么调用栈就需要保存 n 个调用记录。如果...

最近回顾 js 继承的时候，发现还是对一些概念不是很清晰。这里再梳理一下 JS 中继承的几种主要的方式，构造函数继承、原型链继承、组合继承以及原型式继承、寄生式继承、寄生组合式继承和 ES6 的 Class：

不可变性、纯函数、副作用，状态可变这些单词我们几乎每天都会见到，但我们几乎不知道他们是如何工作的，以及他们是什么，他们为软件开发带来了什么好处。

原型指的就是一个对象，实例“继承”那个对象的属性。在原型上定义的属性，通过“继承”，实例也拥有了这个属性。“继承”这个行为是在 new 操作符内部实现的。

Hooks 出了有段时间了，不知盆友们有在项目中开始使用了吗❓如果还没了解的童鞋，可以瞧瞧这篇文章，对比看下三大基础 Hooks 和传统 class 组件的区别和用法吧?

考虑到组件有可能 层层嵌套 ，在传 props 的过程中，如果书写大量的 ...props 或 propName={this.props.propValue} 会导致代码灰常丑陋 ?：

这是一篇给 react 新手的文章，老鸟就略过吧 ✈️ 作者：Llorenç Muntaner 原文：[链接] 作为一名编程教师，我见过许多学生尝试这样做： {代码...} 这不会在控制台中打印预期的列表。它只会在浏览器中渲染一个字符串 console.log（this.props.todos）。 我们先来看看一些非常简单的解决方案，然后我们将解释原因。 最常用...

很多人包括我在内很抵触这种问题?，因为很长一段时间我一直弄不明白 == 和 === 到底是怎么个规则。如果你也没闹明白 == 和 ===，读了这篇文章应该至少不会见到这俩操作符就觉得恶心了吧?。

在 Javascript 循环中使用 async/ await 循环遍历数组似乎很简单，但是在将两者结合使用时需要注意一些非直观的行为。让我们看看三个不同的例子，看看你应该注意什么，以及哪个循环最适合特定用例。

图解尾调用优化 尾调用 啥是尾调用？ 尾调用就是函数的最后一个步骤调用另一个函数 比方说： 函数在调用的时候会在调用栈中 push 一个调用帧，每次执行完函数都会逐一弹出调用帧知道所有函数执行完毕，调用栈被清空： 调用栈中的同步代码 {代码...} 调用栈如下图： 首先执行 script ，将 main 主程序推入调用栈中并执行...

有关 JS 中的 this、call、apply 和 bind 的概念网络上已经有很多文章讲解了 这篇文章目的是梳理一下这几个概念的知识点以及阐述如何用原生 JS 去实现这几个功能

常见的变量作用域就是 静态作用域（词法作用域） 与 动态作用域 。词法作用域注重的是 write-time ，即 编程时的上下文 ，而 动态作用域 则注重的是 run-time ，即 运行时上下文 。词法作用域中我们需要知道一个函数 在什么地方被定义 ，而动态作用域中我们需要关心的是函数 在什么地方被调用

Object.fromEntries 方法就是 entries 的逆操作，作用是将一个键值对数组转化为一个对象 同样的该方法也已经成为 ES10 中 stage4 提案： Object.entries 在介绍 fromEntries 之前，回顾一下 entries 的用法。这个方法返回的是对象自身的、可枚举的属性组成的数组： {代码...} 也可以通过 new Map 构造函数将对象转为 Map...

项目团队成员希望能够禁用某些 JS 依赖。比如有团队成员希望使用 lodash 而将这个巨大的依赖引入项目，导致项目整体过分臃肿。团队成员应当使用 lodash-es 来避免这种情况。那么 ESLint 就提供了一个名为 no-restricted-imports 规则，这个规则就是统一规范在项目中禁止使用的依赖。

升级包管理系统 首先使用如下命令升级包管理系统： sudo apt-get update && sudo apt-get upgrade 创建用户并配置账号权限 为了服务器安全，我们应该避免直接使用 root 用户去登录；而是创建一个新用户，并使用这个用户账号去登录远程服务器： 如果使用 centos ： {代码...} 使用 Ubuntu 创建用户非常简单： 使...