随笔分类 - JS相关
摘要：使用JavaScript实现深拷贝 1.JSON序列化实现深拷贝 在JS中，想要对某一个对象（引用类型）进行一次简单的深拷贝，可以使用JSON提供给我们的两个方法。 JSON.stringfy()：可以将JavaScript类型转成对应的JSON字符串； JSON.parse()：可以解析JSON，
阅读全文
摘要：掌握JavaScript中的迭代器和生成器，顺便了解一下async、await的原理 前言 相信很多人对迭代器和生成器都不陌生，当提到async和await的原理时，大部分人可能都知道async、await是Promise+生成器的语法糖，其原理具体是怎么做的呢？下面通过这篇文章带你详细了解一下迭代
阅读全文
摘要：由浅入深，从掌握Promise的基本使用到手写Promise 前言 在ES6之前，对于一些异步任务的处理始终没有很好的方案可以解决，处理异步的方案可谓是十分混乱，在业务需求下异步请求的套用，就形成了回调地狱，严重影响代码的阅读性。而Promise的出现，给我们统一了规范，解决了之前处理异步任务的许多
阅读全文
摘要：由浅入深，带你用JavaScript实现响应式原理 前言 为什么前端框架Vue能够做到响应式？当依赖数据发生变化时，会对页面进行自动更新，其原理还是在于对响应式数据的获取和设置进行了监听，一旦监听到数据发生变化，依赖该数据的函数就会重新执行，达到更新的效果。那么我们如果想监听对象中的属性被设置和获取
阅读全文
摘要：ES6-ES12简单知识点总结 1.ES6相关知识点 1.1.对象字面量的增强 ES6中对对象字面量的写法进行了增强，主要包含以下三个方面的增强： 属性的简写：当给对象设置属性时，如果希望变量名和属性名一样就可以直接写该变量名； 方法的简写：对象中的方法可直接写成foo() {}的形式； 计算属性名
阅读全文
摘要：JavaScript面向对象—深入ES6的class 前言 在前面一篇中主要介绍了JavaScript中使用构造函数+原型链实现继承，从实现的步骤来说还是比较繁琐的。在ES6中推出的class的关键字可以直接用来定义类，写法类似与其它的面向对象语言，但是使用class来定义的类其本质上依然是构造函数
阅读全文
摘要：JavaScript面向对象—继承的实现 前言 面向对象的三大特性：封装、继承和多态。上一篇我们简单的了解了封装的过程，也就是把对象的属性和方法封装到一个函数中，这一篇讲一下JavaScript中继承的实现，继承是面向对象中非常重要的特性，它可以帮助我们提高代码的复用性。继承主要的思想就是将重复的代
阅读全文
摘要：JavaScript面向对象—对象的创建和操作 前言 虽然说在JavaScript编程语言中，函数是第一公民，但是JavaScript不仅支持函数式编程，也支持面向对象编程。JavaScript对象设计成了一组属性的无序集合，由key和value组成，key为一个标识符名称，而value可以是任意类
阅读全文
摘要：JavaScript函数式编程（纯函数、柯里化以及组合函数） 前言 函数式编程（Functional Programming），又称为泛函编程，是一种编程范式。早在很久以前就提出了函数式编程这个概念了，而后面一直长期被面向对象编程所统治着，最近几年函数式编程又回到了大家的视野中，JavaScript
阅读全文
摘要：使用JS简单实现一下apply、call和bind方法 1.方法介绍 apply、call和bind都是系统提供给我们的内置方法，每个函数都可以使用这三种方法，是因为apply、call和bind都实现在了Function的原型上（Function.prototype），而他们的作用都是给我们函数调
阅读全文
摘要：JavaScript中this的绑定规则 前言 我们知道浏览器运行环境下在全局作用域下的this是指向window的，但是开发中却很少在全局作用域下去使用this，通常都是在函数中进行使用，而函数使用不同方式进行调用，其this的指向是不一样的。JavaScript中函数在被调用时，会先创建一个函数
阅读全文
摘要：JavaScript闭包 1.函数在JavaScript中的地位 在介绍闭包之前，可以先聊聊函数在JavaScript中的地位，因为闭包的存在是与函数息息相关的。 JavaScript之所以可以称之为支持头等函数的编程语言，是因为JavaScript中函数是一等公民； 函数不仅在JavaScript
阅读全文
摘要：JavaScript的内存管理 1.什么是内存管理？ 在了解JavaScript的内存管理之前，可以先大致熟悉一下什么是内存管理，不管什么样的编程语言，在其代码执行的过程中都是需要为其分配内存的。 不管什么样的编程语言，以及它用什么方式来管理内存，其内存的管理都具备以下的生命周期： 申请内存：分配其
阅读全文
摘要：JavaScript的执行过程 前言 编写一段JavaScript代码，它是如何执行的呢？简单来说，JS引擎在执行JavaScript代码的过程中需要先解析再执行。那么在解析阶段JS引擎又会进行哪些操作，接下来就一起来了解一下JavaScript在执行过程中的详细过程，包括执行上下文、GO、AO、V
阅读全文
摘要：浏览器工作原理和JS引擎 1.浏览器工作原理 在浏览器中输入查找内容，浏览器是怎样将页面加载出来的？以及JavaScript代码在浏览器中是如何被执行的？ 大概流程可观察以下图： 首先，用户在浏览器搜索栏中输入服务器地址，与服务器建立连接； 服务器返回对应的静态资源（一般为index.html）；
阅读全文
摘要：JS数组去重的方式 例：将下面数组去除重复元素（以多种数据类型为例） const arr = [1, 2, 2, 'abc', 'abc', true, true, false, false, undefined, undefined, NaN, NaN] 1.利用Set()+Array.from(
阅读全文
摘要：数组扁平化的方式 什么是数组扁平化？ **数组扁平化：**指将一个多维数组转化为一个一维数组。 例：将下面数组扁平化处理。 const arr = [1, [2, 3, [4, 5]]] // > [ 1, 2, 3, 4, 5 ] 1.使用flat() flat() 方法是ES10提出的，它会按照
阅读全文