- 博客(23)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 非空断言操作符（Non-null assertion operator）
被用来告诉编译器一个表达式一定不为 null 或 undefined，即使类型检查（type checking）可能推断它可能为 null 或 undefined。在这个例子中，variable 的类型为 string | null | undefined，所以尝试访问 variable.length 将引起一个 TypeScript 错误，因为 variable 可能为 null 或 undefined。.length 这行代码时一定不为 null 或 undefined，你可以使用非空断言操作符!
2024-03-27 11:12:45
276
原创 【JavaScript】typeof Symbol === ‘function‘ && Symbol.for什么作用
相反，你的代码可以在 Symbol 或 Symbol.for 不可用时，有条件地提供备选功能。所以，这个条件是验证当前环境中是否存在并且支持 Symbol。Symbol.for：在确认 Symbol 是函数后，接下来会检查 Symbol 是否有 for 方法。Symbol.for 是 Symbol 的一个内置方法，使我们能从全局 symbol 注册表中创建或检索 symbol，以便重用。在这个代码片段中，只有在环境支持 Symbol.for 的情况下，才会尝试使用 Symbol.for。
2024-01-21 20:38:52
407
原创 打包工具的安全性
这些文件可以确保在所有的开发环境和服务器上安装相同版本的依赖包，从而避免在解决问题时可能遇到的“在我机器上可以运行”的问题，并保证所有开发者和用户获取到的依赖性一致。这包括确保没有使用任何包含已知安全漏洞的包，以及保护你的项目免受恶意库的攻击。：这个方面的问题涉及到打包工具如何在开发和构建环境中保护安全性。：对于打包工具来说，需要防止任何敏感数据（如API秘钥或数据库凭证）被意外暴露在配置文件或者打包的源代码中。所有这些都是在选择和使用打包工具时需要考虑的重要安全因素。：现代打包工具提供了锁定文件，如。
2024-01-20 08:17:17
357
原创 npm, yarn, pnpm打包工具的比较
Sync：与npm和Yarn不同，pnpm通过使用一个全局存储的方式来安装和管理包，它将每个版本的每个模块只存储一次，然后通过链接的方式将这些模块链接到你的项目中。npm可能仍然是最主流的选择，但yarn和pnpm在性能和磁盘空间使用等方面有其优点。npm,yarn和pnpm都是流行的JavaScript包管理器，它们用于安装和管理项目的依赖关系。Sync：npm的依赖关系分配方式是嵌套安装，每个模块都有自己的依赖关系，这可能会导致文件的重复以及一些其他的问题。速度：pnpm的速度与Yarn相当。
2024-01-20 08:14:21
454
原创 前端打包Uncaught ReferenceError: process is not defined
如果你在前端代码中使用 process.env.NODE_ENV 这类方法来进行环境判断或者其他操作，你需要在打包的过程中，例如使用 webpack 的 DefinePlugin，将 process 对象或者 process.env 对象替换为浏览器能识别的对象。如果你在使用的库或者代码中大量使用了process，并且不方便修改源码，那么你也可以考虑引入一个浏览器版的 process 对象，在你的代码运行前先定义好，例如使用 browserify 的 process/browser。
2024-01-10 20:31:43
2036
原创 【史上最全】定义开发规范和代码风格
w 在根目录安装依赖（对于monorepo而言需要指定）创建.eslintrc.json文件，并写入"env": {"node": true //自定义},"prettier", //自定义"plugin: prettier/recommended" //自定义],},"prettier" //自定义],"rules": {"prettier/prettier" : "error", //自定义"no-case-declarations": "off", //自定义。
2024-01-08 08:23:18
362
原创 过滤数组中无意义的数据
有这样一个数组，里面含有一些元素，包含一些无意义的元素，或者boolean为false的元素[0,’’,1,null,45,undefined,‘abc’,false,true,‘isajdfsa’].filter(v=>!!v)结果就是[1, 45, “abc”, true, “isajdfsa”]这里用到了!!v， 两个！把v强制转换为boolean类型返回...
2020-06-04 17:53:28
289
原创 如果递归多了，就发生什么？用什么办法优化？
比如下面这个例子，递归次数在100的时候，还没有问题。一旦执行100000次的时候就会发生递归栈溢出的问题。 function sum0(total, i, callback) { if(i===0){ callback(total); return; } sum0(total+i, i-1, callback) } sum0(0, 100, value=>{ co
2020-05-25 17:17:23
1349
原创 React源码解析与实现（1）--环境配置与React和ReactDOM的实现
配置环境新建react_simple目录，并新建index.html和index.js两个文件。全局安装parcel，一个比webpack更简单的打包工具。npm install parcel -g然后在开发环境中安装parcel-bundlernpm install parcel-bundler --save-dev安装babel，将jsx转换为js对象（虚拟DOM）npm i babel-core babel-preset-env babel-plugin-transform-
2020-05-20 17:28:02
172
原创 算法-JavaScript（1）
二分法查找二分法查找：g为猜测位置，l为左边界，r为右边界，function bsearch(A, x) { let l = 0, //查询范围的左边界 r = A.length-1, //查找范围的右边界 guess //猜测位置 while (l <= r){ guess = Math.floor((l+r)/2) //循环不变式 //guess等于l，r中间位置 //l:查找范围左，r:查找范围
2020-05-18 16:31:05
150
原创 几种后代选择器的比较
一、后代选择器选取指定元素的后代元素与子元素选择器相比，后代选择器选取的不一定是直接后代（儿子），而是作用于所有后代元素（儿子、孙子、重孙…）都可以。实例：（选取类为 box的元素的 id为aa后代元素）HTML复制代码 emmmmmmmmmm…… 23333333333333333…… wwwwwwwwwwww QQQQQQQQQQ 复制代码CSS.box #aa{ background: #aaf; }二、（>）
2020-05-16 11:07:24
2017
原创 Javascript深入认识（5）——函数
函数声明函数声明比变量声明具有更为优先的执行顺序，即我们常常提到的函数声明提前。因此我们在执行上下文中，无论在什么位置声明了函数，我们都可以在同一个执行上下文中直接使用该函数。fn(); // functionfunction fn() { console.log('function');}函数表达式函数表达式使用了var进行声明，按照var的规则进行判断，即变量声明。...
2020-05-07 17:34:46
111
原创 Javascript深入认识（6）——this的问题
文章目录误区：定义：全局对象中的this函数中的this在非strict情况下在'use strict'情况下使用call，apply显示指定的this误区：对于this的理解，以前一直以为是谁调用了，this就指向谁，这样理解可能会有偏差。定义：this的指向，是在函数被调用的时候确定的，也就是执行上下文被创建时确定的。下面这个例子的thisvar a = 10;var obj...
2020-05-06 13:45:02
383
原创 这个妞是什么？--Javascript中的new详解
先看这个代码：var Person = function (name, age) { this.name = name; this.age = age; this.gender = ['man','woman']}var person1 = new Person('p1','10')var person2 = Person('p2','20')console.lo...
2020-05-03 23:56:29
114
原创 Javascript深入认识（4）——作用域链
必备知识：基础数据类型与引用数据类型内存空间垃圾回收机制执行上下文变量对象与活动对象作用域和执行上下文的区别：JavaScript代码的整个执行过程，分为两个阶段，编译阶段：由编译器完成，将代码翻译成可执行代码，这个阶段作用域规则会确定。执行阶段：由引擎完成，主要任务是执行可执行代码，执行上下文在这个阶段创建。作用域链结合执行上下文的生命周期，得出下图：作用域链...
2020-04-26 16:01:18
127
原创 Javascript深入认识（3）——变量对象
上一篇中，我们知道，当函数被调用时，就会创建执行上下文（执行环境）。一个执行上下文的生命周期分成两部分：创建阶段执行上下文分别创建对象，建立作用域链，以及确定this的指向。代码执行阶段执行代码，完成变量赋值，函数引用，以及执行其他代码变量对象变量对象的创建，依次经历了以下几个过程。建立arguments对象。检查当前上下文中的参数，建立该对象下的属性与属性值。检查当前上...
2020-04-26 15:17:00
136
原创 Javascript深入认识（1）——内存空间
文章目录1. 栈数据结构2. 堆数据结构3. 队列4. 基础数据类型和引用数据类型--基础数据类型--引用数据类型5.内存管理空间1. 栈数据结构先进后出，后进先出2. 堆数据结构树状结构，可以随机存取。就像是书架，知道书名就可以索取想要的书3. 队列先进先出（FIFO）4. 基础数据类型和引用数据类型–基础数据类型JavaScript的基础数据类型往往都会保存在变量对象中。...
2020-04-24 13:42:56
130
原创 Webpack介绍和实战
文章目录@[TOC]Webpack介绍1. 什么是webpack？2. 理解loader3. 配置文件4. 插件Webpack介绍1. 什么是webpack？webpack是一个模块打包器在webpack看来，所有资源文件（js/json/css/img/less……）都会作为模块处理它将根据模块的依赖关系进行静态分析，生成对应的静态资源2. 理解loaderwebpack本身...
2020-04-23 17:43:26
98
原创 Gulp中的异步
在gulp中如果有return，就是执行异步操作，//注册转换less的任务gulp.task('less', function () { return gulp.src('src/less/*.less') //异步操作 .pipe(less()) //编译less文件为css文件 .pipe(gulp.dest('src/css/'))})//注册合并...
2020-04-23 17:41:30
332
原创 Gulp介绍与实战
Gulp中文主页一个重要前提：gulp在4.0以后做了结构上的调整，如果用3.x版本习惯的话，要回退到3.x版本， npm install gulp@3 --save-de文章目录Gulp入门Gulp实战压缩css和less压缩html半自动构建全自动构建全自动构建Gulp入门作用：前端项目构建工具，基于nodejs的自动任务运行器，能自动完成javascript/coffee/...
2020-04-23 17:38:41
275
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人