前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。深度剖析之由浅入深揭秘JavaScript类型转换(最全总结篇)值类型转换将值从一种类型转换为另一种类型通常称为类型转换，分为 隐式强制类型转换 和 显示强制类型转换。两者的区别在于是否可直观看出。如下代码：var a = 42; var b = a + ""; // 隐式强制类
前言欢迎关注 『前端进阶圈』 公众号 ，一起探索学习前端技术......前端小菜鸡一枚，分享的文章纯属个人见解，若有不正确或可待讨论点可随意评论，与各位同学一起学习~热点面试题：为什么 0.1+ 0.2 != 0.3，如何让其相等？在开发过程中遇到类似这样的问题：let n1 = 0.1, n2 = 0.2;console.log(n1 + n2 === 0.3); // false
终极秘诀：打破无代码状态的小方法 大家有没有遇到过不想写代码或学习的时候呢？这种情况下，你们会选择放松还是停下来呢？我很好奇大家是怎么度过这段时间的。我个人的情况是，当我不想写代码或学习的时候，我会去探索一些我感兴趣的东西。比如说，最近我对Bash Terminal路径配置很感兴趣。为什么会对这个感兴趣呢？ 因为我在vscode中使用git作为默认的终端，但是bash的路径看起来太长了，我总是想
第3章 代码的坏味道1.神秘命令(Mysterious Name)?整洁代码中最重要的一环就是有一个好名字，使他们能够清晰地表明自己的功能和用法。但正因为如此，命名就成了编程中最难的两件事之一。而在重构中改名是最常用的重构手法，包括改变函数声明，变量名，字段名等。记住，改名不仅仅是修改名字而已，若想不出一个好的名字，说明背后可能存在更深的设计问题。2. 重复代码(Duplicated Code
基于状态模式: 没有实践的理论都是扯淡！！！定义状态模式是一种面向对象的设计模式，它允许一个对象在其内部状态改变时改变它对应的行为。状态模式的关键在于如何区分事物内部的状态，事物内部状态的改变往往会带来事物的行为的改变。通常我们谈到封装，一般都会优先封装对象的行为（比如，某个函数），而不是对象的状态。但在状态模式中恰好相反，状态模式的关键是把事物的每种状态都封装成单独的类，跟状态有关的行为会被封装
基于装饰器——我劝你不要在业务代码上装逼！！！装饰器模式的定义在传统的面向对象语言中，给对象添加功能常使用继承的方式，但继承的方式并不灵活，会带来一些许多问题，如：超类和子类存在强耦合性，也就是说当改变超类时，子类也需要改变。而装饰器模式的出现改变的这种方式，装饰器模式可在不改变现有对象解构的基础上，动态地为对象添加功能。传统的 JavaScript 装饰器var plane = { fi
何为策略模式？比如在业务逻辑或程序设计中比如要实现某个功能，有多种方案可供我们选择。比如要压缩一个文件，我们既可以选择 ZIP 算法，也可以选择 GZIP 算法。这些算法灵活多样，可随意切换，而这种解决方案就是我们所要学习的策略模式。定义或概念策略模式：定义一系列的算法，将他们一个个封装，并使他们可相互替换。策略模式的最佳实践例子1：奖金计算题目：在很多公司的年终奖都是按照员工的工资基数和年底绩效
前言系列首发于『非同质前端札记』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。全能指挥官：玩转JavaScript命令模式，让代码听你的话！命令模式的含义命令模式指的是一个执行某些特定的指令。命令模式的示例 demo:// 命令接口 class Command { execute() {} } // 具体命令：打开文档 class OpenDocumentCo
前言系列首发于公众号『非同质前端札记』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。懒得改变原始对象？JavaScript代理模式教你怎样一步步偷懒！何为代理模式例如，你想预约一家公司的董事长会面，按照正常流程，你只能通过先联系他的秘书，然后跟他的秘书预约时间，约好时间后你们两个才能会面。(也就是说，代理模式的关键是有个中间者来协调你与对方之间的事情，只能通过中间者将事情转达
前言系列首发于『非同质前端札记』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。JavaScript程序设计模式小技巧——策略模式，快看快用！！！何为策略模式？比如在业务逻辑或程序设计中比如要实现某个功能，有多种方案可供我们选择。比如要压缩一个文件，我们既可以选择 ZIP 算法，也可以选择 GZIP 算法。这些算法灵活多样，可随意切换，而这种解决方案就是我们所要学习的策略
JavaScript 的优雅编程技巧：Singleton Pattern定义单例模式：保证一个类仅有一个实例，并提供一个访问的全局访问点。特点仅有一个实例对象全局都可访问该实例主动实例化延迟实例化类似单例模式的使用实践jQuery, lodash, moment ....电商中的购物车(因为一个用户只有一个购物车)Vue 或 React 中全局状态管理(Vuex、Redux、Pinia)全局组件关
前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。JavaScript类型、值和原生函数大揭秘, 前端开发者必看！类型ECMAScript 一共有七种语言类型：Undefined、Null、Boolean、String、Number、Object、Symbol内置类型函数不仅是对象，还拥有属性。在函数中的 length 属性是参数的个数如下代码：
JavaScript 实践+理论(总结篇)：作用域、闭包、this、对象原型系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。作用域与闭包第一章 作用域是什么作用域：根据标识符查找变量的一套规则。嵌套作用域：从当前作用域开始查找变量，如果找不到就向上一层继续查找，直到找到最外层的全局作用域为止。严格模式与非严格模式下引擎查找规则： 严格模式： 在 u
前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。理论+实践：从原型链到继承模式，掌握 Object 的精髓(二)前言上篇文章中介绍了对象，那本篇文章将继续介绍类相关的面向对象编程和原型。 我们知道类中有这三个关键的概念：实例化(instantiation),继承(inheritance),相对多态(polymorphism)，首先从理论说起。类
前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。理论+实践：从原型链到继承模式，掌握 Object 的精髓(一)在之前的文章中，我们介绍了函数调用位置的不同造成了 this 绑定对象的不同，但对象到底是什么？为什么我们需要绑定他们呢？语法对象一共有两种语法：定义(文字)形式和构造形式。// 对象的文字语法大概是这样： var myObj = {
前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。this 之谜揭底：从浅入深理解 JavaScript 中的 this 关键字（二）调用位置在理解 this 的绑定过程之前，首先要理解调用位置：调用位置就是函数在代码中被调用的位置(而不是声明的位置)。通常来说，寻找调用位置就是寻找"函数被调用的位置", 最重要的要分析调用栈(就是为了到达当前执
前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。this 之谜揭底：从浅入深理解 JavaScript 中的 this 关键字（一）为什么要用 this考虑以下代码：function identify() { return this.name.toUpperCase(); } function speak() { var gr
JavaScript深度剖析之变量、函数提升：从表面到本质前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。想要彻底理解提升这篇文章，除非你已经理解了作用域、词法作用域、动态作用域、编译器、引擎 之间的联系，否则建议你先从之前的文章读起。在前几篇文章中提到的作用域中的变量声明出现的位置有着某种微妙的联系，而这个联系就是本篇文章所讨论的内容。先有鸡
前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。面试官必问系列：深入理解JavaScript块和函数作用域在 JavaScript 中，究竟是什么会生成一个新的作用域，只有函数才会生成新的作用域吗？那 JavaScript 其他结构能生成新的作用域吗？3.1 函数中的作用域在之前的词法作用域中可见 JavaScript 具有基于函数的作用域，这
前言在上篇文章中, 我们说了作用域一共分为两种：词法作用域和动态作用域，而这篇文章我们一起来学习 动态作用域。动态作用域动态作用域似乎有着很好的理由让作用域作为一个在运行时就被动态确定的形式，而不是在写代码时进行静态确定的形式。考虑一下代码：function foo() { console.log(a); // 2 } function bar() { var a = 3;
前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。JavaScript中eval和with语句如何影响作用域链：探索深度知识前言在上篇文章中，我们介绍了深度剖析了作用域，并将其定义为一套规则，这套规则用来管理引擎如何在当前作用域以及嵌套的子作用域中根据标识符名称进行变量查找。 而作用域一共分为两种：词法作用域 和 动态作用域, 而本篇文章我们将深
前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。探究 JavaScript 前端热点面试题(三)：让你在面试中游刃有余！1. 什么是 BOM 和 DOM？DOM：文档对象模型，指把文档当做了一个对象，这个对象中包含了处理网页的方法和接口BOM：浏览器对象模型，把浏览器当成了一个对象，这个对象主要定义了与浏览器交互的方法和接口，BOM 的核心是
前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。JavaScript作用域深度剖析：从局部到全局一网打尽1.1 编译原理JavaScript 事实上是一门编译语言。在传统编译语言中，一段源代码执行前会经历三个步骤: 分词/词法分析(Tokenizing/Lexing)var a = 2; // 分解后： var、a、=、2、; // 空格是否会
必知必会的JavaScript前端面试题篇(二)，不看后悔！1. JavaScript 有哪些数据类型以及它们的区别？js 一共有八种数据类型，分别是: Undefined, Null, Boolean, Number, String, Object, Symbol, BigInt其中 Symbol, BigInt 是 ES6 中新增的数据类型： Symbol: 代表唯一的数据类型，主要为了解决全
必知必会的JavaScript前端面试题篇(一)，不看后悔！1. 对 this 对象的理解？定义：在执行上下文中的一个属性，它指向最后一次调用这个属性或方法的对象。通常有四种情况来判断。严格模式中使用 use strict函数调用模式：当一个函数不是一个对象的属性时，直接作为函数来调用时， 严格模式下指向 undefined, 非严格模式下，this 指向全局对象。// 严格模式 'use str
前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。手撕代码系列(四)手写触发控制器 Scheduler当资源不足时将任务加入队列，当资源足够时，将等待队列中的任务取出执行任务调度器-控制任务的执行，当资源不足时将任务加入等待队列，当资源足够时，将等待队列中的任务取出执行在调度器中一般会有一个等待队列queue，存放当资源不够时等待执行的任务。具有
前言系列首发于『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注最新消息。手撕代码系列(二)手写函数柯里化 curring/** * 函数柯里化 curring * @param {Function} * @return 视具体方法而定 * * @logic * 1.创建一个参数数组 args * 2.创建一个函数，接收参数列表 * 3.函数判断参
前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。面试必考: 手撕代码系列(一)手写深拷贝 (deepClone)/** * deepClone 深拷贝 * @param {*} source 源对象(需要拷贝的对象) * @returns 新对象 */ const deepClone = source => { // 存储
前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。热乎的前端面试题（昨天）1.Vue 响应式原理？vue2： 在 Vue2 中注意使用 Object.defineProperty() 方法来实现响应式，它为对象中的每一个属性都定义了一个 getter 和 setter，当数据发生变化时，会触发相应的操作，从而让视图也随之。在 Vue2 中
前言系列首发于公众号『前端进阶圈』 ，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。前端面试实录篇1. ~ 3.0？带宽延迟浏览器阻塞(HOL blocking)DNS 查询(DNS lookup)建立连接(initial connection)1.0无法复用：每次请求都会与服务器建立一次连接，消耗传输很大，队头阻塞：如果有多个请求，前一
Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号
