自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(86)
  • 收藏
  • 关注

原创 ESM浅析

一、出现背景 早期javaScript程序很小,不需要模块化,发展到现在,我们有了运行大量JavaScript脚本的复杂程序,有必要开始考虑提供一种,将 JavaScript 程序拆分为可按需导入的单独模块的机制...

2022-04-15 16:51:24 5592

原创 JS常用的八种继承方案

一、原型链继承继承的本质就是复制,即重写原型对象,代之以一个新类型的实例二、借用构造函数继承三、组合继承四、原型式继承五、寄生式继承六、寄生组合式继承七、混入方式继承多个对象、八、ES6继承extends...

2022-04-11 19:01:37 555

原创 作用域链与原型链的区别

作用域链,是相对于变量的,最顶层是window原型链是相对于属性而言,最顶层是Object.prototype

2022-04-11 17:47:38 902

原创 Function和Object的鸡先蛋先问题

详细请看木易杨的个人博客一、Object.prototypeObject.prototype是Object的原型对象,这个是显而易见的,它的[[Prototype]]属性是null,访问器属性__proto__,指向一个对象的内部[[Prototype]],Object.prototype的__proto__也就指向null,所以我们会说,null是原型链的顶端;但是我们需要了解的一点是 Object.prototype并不是通过Object函数创建的,它其实是浏览器底层根据ECMAScript规范创

2022-04-11 14:33:23 624

原创 为啥Object.prototype.toString.call()可以准确判断对象类型

.toString()方法,返回对象的字符串表现Array,function等类型作为Object的实例,都各自重写了toString()方法要得到对象的具体类型,需要调用Object的原型的未被重写的toString方法hasOwnProperty()方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性Object.prototype.toString.call(‘判断值’)为啥一定需要call,如果不call的话,调用toString()方法的不是’判断值’,而是Object.protot

2022-04-08 16:27:50 557

原创 undefined与null的本质区别

给一个全局变量赋值为null,代表将这个变量的指针对象以及值都清空,给对象或者局部变量赋值为null相当于给这个变量分配了一个空内存,然后值为null,垃圾回收机制会回收全局变量为null的对象给一个全局变量赋值为undefined,相当于将这个对象的值清空,但是指针对象依然存在;给一个对象的属性赋值为undefined,说明这个值为空值...

2022-04-07 14:09:21 151

原创 内存泄漏与垃圾回收机制

引用借鉴一、垃圾回收机制–标记清除算法步骤:1、垃圾回收器创建了一个“roots"列表。roots通常是代码中全局变量的引用。JS中,”window“对象是一个全局变量,被当作root。window对象总是存在,因此垃圾回收器可以检查它和它所有的子对象是否存在(即不是垃圾)2、所有的roots被检查和标记为激活(即不是垃圾)。所有的子对象也被递归地检查。从root开始的所有对象如果是可达的,它就不被当作垃圾.3、所有未被标记的内存都会被当作垃圾,收集器现在可以释放内存,归还给操作系统了二、四种常

2022-04-07 11:40:34 1102

原创 JS弱引用

在计算机程序中,弱引用与强引用相对,是指不能确保其引用的对象不会被垃圾回收器回收的引用。一个对象若只被弱引用所引用,则被认为是不可访问的(或弱访问的),并因此可能在任何时刻被回收一、weakMap(借鉴)1、weakMap只接受对象作为键名2、weakMap键名所引用的对象是弱引用 WeakMaps 保持了对键名所引用的对象的弱引用,即垃圾回收机制不将该引用考虑在内。只要所引用的对象的其他引用都被清除,垃圾回收机制就会释放该对象所占用的内存。也就是说,一旦不再需要,WeakMap 里面的键名对象和所

2022-04-07 10:52:51 775

原创 B站上的小知识点

一、query与params的区别query:1、 拼接在url后的参数2、 参数在?后面,且参数之间用&分隔3、 query相当于get请求,可以在地址栏看到参数params:1、 是路由的一部分,以对象的形式传递参数2、 使用params传参只能由name引入路由,如果写出path页面会显示警告,说参数会被忽略3、 params相当于post请求,参数不再会在地址栏中显示二、Vue3如何自定义指令及其生命周期钩子、参数 ceated:再绑定元素的attribute或事件监听

2022-04-06 17:35:03 684

原创 JS内存机制

var a = {n: 1};var b = a; // b = {n : 1}a.x = a = {n: 2};// a.x = {n : 2}// a = {n : 2}console.log(a);//{ n : 2}console.log(a.x);// undefinedconsole.log(b);// {n : 1, x : {n : 2}}console.log(b.x);//2其中 a.x = a = {n : 2} 相当于a.x = {n: 2}a = {

2022-04-06 16:41:54 406

原创 JS的预编译

JS的预编译与传统的预编译是不一样的JS是解释型语言(编译一行,执行一行)传统的编译会经历很多步骤,比如分词、解析、代码生成一、JS运行三部曲语法分析(先扫描一遍,看是否有语法错误)预编译(执行前一刻)(变量声明提升,函数声明整体提升)解释执行(解释一行,执行一行)1、函数编译四部曲(函数预编译发生在函数执行前一刻)(1)创建AO对象(2)找形参和变量声明,将变量和形参名作为AO属性名,值为undefined(3)将形参与实参的值统一(4)在函数体里找函数声明,并赋值函数体2、全局

2022-04-06 16:05:02 227

原创 gitHub常用命令

git init 初始化仓库 git add <文件名> 将提交文件加入缓存区,等待最后一次性提交git commit -m <提交说明> 将缓存区得到文件都提交到git仓库里git status 告诉我们仓库此时的状态,缓存区是否有文件等待提交git diff <文件名> 告诉我们文件的修改内容git log 显示最近到最远的提交日志git reset --hard HEAD^ 回退到上一个版本***git reflog***记录每一次的

2022-03-10 11:47:52 338

原创 BFC原理和应用

转载别人的博客

2021-10-15 11:07:17 123 1

原创 JS 异步编程与Promise以及async与await的实例详解

一、开始1、异步加载图片体验JS任务操作function loadImag(src,resolve,reject) { let image = new Image() image.src = src image.onload = () => { resolve(image) } image.onerror = reject }

2021-10-09 10:55:32 127

原创 JS中的12种循环遍历的方法

1、for循环JS常见的循环,常用于循环数组、字符串之类let arr = [1, 2, 3];for (let i = 0; i < arr.length; i++) { console.log(i, arr[i])}// 0 1// 1 2// 2 32、while循环也是JS常见的循环arr = ["1", "2", "3", "4"];var i = 0;while (arr[i]) { console.log(arr[i] + "<br>

2021-09-30 09:35:02 10115

原创 JS 判断空对象的5种方法

1、let obj = {name : '你好'}//是true为空对象,是false则不是空对象console.log(JSON.stringify(obj) === '{}');//false2、let obj = {}let fn = (s) => { for(let key in s) { return false } return true}//返回false代表不为空,返回true则为空对象 console.log(fn(o

2021-09-28 00:02:51 9779

原创 forEach是否会改变原数组

1、基本数据类型(改变不了原数组)const array1 = [1, 1, 1];array1.forEach(a => { a+1});console.log(array1);//[1,1,1]2、引用类型(可以改变原数组)const obj = [ { a : 'sss', b : 22 }, { a : 'xxx', b : 33 }]obj.forEach(aa =

2021-09-26 22:28:48 1957 1

原创 JS toString() 与String()的区别

文档

2021-09-26 18:23:26 480

原创 对象 - 原始值转换

在此文基础上进行的总结一、关于一些杂碎知识1、所有对象在布尔上下文(context)中均为true。所以对于对象,不存在to-boolean转换,只有字符串和数值转换2、数值转换发生在对象相减或应用数学函数的时候。例如,Date对象可以相减,date1 - date2的结果是两个日期之间的差值3、至于字符串转换----通常发生在我们像alert(obj)这样输出一个对象和类似的上下文中二、ToPrimitive我们可以使用特殊的对象方法,对字符串和数值进行微调。下面三个类型转换的变体,被称为“

2021-09-26 16:31:30 115

原创 关于JS的类型转换

一、数据类型JS一共有六种简单的数据类型:undefined、null、boolean、string、number、symbol,以及三种引用类型:function、object、array.但是JS在声明的时候只用一种类型,只有到运行的时候才能确定当前的类型。在运行期间,由于JS没有对类型做严格限制,导致不同类型之间可以进行运算,这样就需要允许类型之间相互转换二、类型转换1、显式类型转换显示类型转换就是手动将一种值转换为另一种值。转换为Number类型Number() / pars

2021-09-24 22:17:05 230 1

原创 [‘1‘,‘2‘,‘3‘].map(parseInt)详解

1、首先我们需要知道:console.log([1,2,3].map(parseInt));//[1,NaN,NaN]那么为啥呢?2、首先了解下map()函数:对数组的每个元素调用定义的回调函数并返回包含结果的数组[1,2,3].map(function(a,b,c) {//function 执行时会传入三个参数 //a为当前被传递的元素 console.log(a);//1,2,3 //b为当前被传递元素的索引 console.log(b);//0,1,2

2021-09-24 20:39:26 3228

原创 javascript中=== 、==、!==与!=的区别

===代表恒等于,不仅判断数值,而且判断类型!==代表恒不等于,也是要判断数值与类型而==和!=只是判断数值是否相等

2021-09-23 22:28:35 136

原创 JS 清空数组的方式

1、splice函数let a = [1,2]a.splice(0,a.length)console.log(a);//[]2、赋予空值let a = [1,2]a = []console.log(a)//[]3、给数组的length赋值为0let a = [1,2]a.length = 0console.log(a)//[]

2021-09-23 22:00:11 80

原创 JS简单实现树结构

本文借鉴于此一、树的基本概念1、树: 树是由n(n>0)个有限节点组成的一个具有层次关系的集合,它具有以下的特点:每个节点有0个或多个结点没有父节点的节点叫做根节点每个非根节点有且只有一个父节点除了根节点外,每个子节点可以分为多个不相交的子树2、节点的度: 节点拥有的子树个数,例如图中节点A的度为2,节点H的度为13、树的度: 树的最大节点的度,例如图中最大的节点B的度为3,树的度为34、叶节点: 度为0的节点,图中K,J,F,L,O,P都是叶节点5、父节点: 一个含有子节点

2021-09-22 22:27:54 5256 1

原创 关于构造函数、原型、原型链进阶版

一、构造函数(1)啥是构造函数constructor返回创建实例对象时构造函数的引用,此属性的值是对函数本身的引用,而不是一个包含函数名称的字符串function Person() {}var p = new Person()console.log(p.constructor === Person);//trueconsole.log(p.constructor === Object);//false构造函数本身就是一个函数,与普通函数没有任何区别,不过为了规范一般将其首字母大写。构造

2021-09-16 18:34:27 172 1

原创 javaScript的基本数据类型

值类型(基本类型)字符串(String)数字(Number)布尔(Boolean)对空(null)未定义(undefined)Symbol引用数据类型对象(Object)数组(Array)函数(Function)

2021-09-14 21:12:33 38

原创 关于JS原型链及继承

一、普通对象与函数对象1、普通对象: 除了函数对象之外的对象都是普通对象,以及new 函数对象(包括Object ,Array ,String, Number, 但不包括Function)产生的实例,普通对象没有prototype,也就没有继承和原型链2、函数对象:(1)由function创造出来的函数:function f1() {}var f2 = function() {}var f3 = new Function('aaa')console.log(typeof f1);//fu

2021-09-14 18:51:08 150 1

原创 关于闭包的理解

一、闭包的概念1、多种概念多种理解当函数可以记住并访问所在的词法作用域的时候,就产生了闭包,即使函数是在当前词法作用域之外执行闭包就是能够读取其他函数内部变量的函数,可理解成“定义在一个函数内部的函数”闭包让你可以在一个内层函数中访问到其外层函数的作用域来看这段代码:function foo() { var a = 2 function bar() { console.log(a); } bar()}foo()上面这段代码,从技术上讲,

2021-09-09 22:29:03 212

原创 深度解析new原理及模拟实现

fwef we fwefew

2021-09-07 22:24:30 116

原创 JS手动实现call() , apply() , bind()

dfqwe

2021-09-07 22:24:08 1453 2

原创 call()、apply()、bind()的区别

一、call()function.call ( thisArg , arg1 , arg2,…) : 使用一个指定的this值和单独给出的一个或多个参数来调用一个函数 thisArg: 可选的。在function函数运行时使用的this值;但是this可能不是该方法看的实际值:如果这个函数处于非严格模式下,则被指定为null或undefined时会自动替换为指向全局对象,原始值会被包装。 arg1,arg2,.... : 指定的参数列表 返回值:使用调用者提供的this值和参数调用该函数

2021-09-07 21:25:57 160

原创 JS创建栈和队列

JS创建栈//使用JS创建一个栈function Stack() { let items = [] //添加一个或者几个新元素到栈顶 this.push = function(element) { items.push(element) } //移除栈顶的元素,同时返回被移除的元素 this.pop = function() { return items.pop() } //返回栈顶元素,但是并不对栈顶的元素做出任何的修改 this.peek

2021-09-02 20:28:44 308

原创 异步——事件监听与回调函数

一、相关概念1、单线程(sigle thread)JavaScript是单线程语言。同一时刻只能执行一段代码,这是防止不同代码之前的冲突。对应的多线程语言有一堆,Java,C++等大多数语言都是多线程语言。2、同步(synchronous)代码按照顺序执行。一段代码执行完,才执行下一段代码。3、异步(asynchronous)代码不按照顺序执行。可以先执行后面一段代码,再执行前面一段代码;也可以先执行一段代码的一部分,再执行其他代码,再返回来执行该段代码。4、阻塞因为目前正在运行代码,所以其

2021-09-01 22:35:27 1691

原创 JS关于单链表的基本操作

//创建一个节点,每个节点具有两个属性,一个是值和一个指针class Node { constructor(value) { this.value = value this.next = null }}//创建一个链表,包含三个属性class LinkedList { constructor() { this.head = null this.tail = this.head //用于存储链表的最后一个节点tail this.length =

2021-09-01 21:09:57 129

原创 关于条件判断中的 !符号

function a() { let s = true if(!s) console.log('1') //当s值为false才执行 else console.log('2');}a() //输出为2

2021-09-01 18:04:56 346

原创 宏任务和微任务

一、宏任务与微任务异步任务中包含两种:宏任务和微任务宏任务:DOM事件回调、AJAX事件回调、定时器回调微任务:Promise、MutationObserver、(node环境中还包括process.nextTick)JS每次运行程序代码都是同步的,执行完所有的同步代码就执行异步代码,执行异步代码的时候,(在同一层级)先执行微任务,再执行宏任务,执行完一个层级之后,再执行下一个层级...

2021-08-31 21:19:39 74

原创 关于位运算符的 >> 与 >>>

1、">>" 为 右运算符,将32位数字的所有有效整体右移,再使用符号位的值填充空位,移动过程中超出的值将被丢弃2、“>>>” 执行无符号右移位运算,它把无符号的 32 位整数所有数位整体右移。对于无符号数或正数右移运算,无符号右移与有符号右移运算的结果是相同的,对于负数来说,无符号右移将使用 0 来填充所有的空位,同时会把负数作为正数来处理,所得结果会非常大所以,使用无符号右移运算符时要特别小心,避免意外错误。...

2021-08-31 18:24:22 1716

原创 关于JS的运行机制

一、进程与线程1、进程进程是CPU资源分配的最小单位(是能拥有资源和独立运行的最小单位)2、线程线程是CPU调度的最小单位(线程是建立在进程基础上的一次程序 运行单位,一个进程中可以有多个线程)3、区分进程与线程进程是一个工厂,工厂有它的独立资源 ——》 工厂的资源指的是系统分配的内存...

2021-08-21 17:39:31 324

原创 options 请求

一、作用及由来1、针对跨域HTTP 请求,有一种方式叫做“跨域资源共享”,准确的说是一个W3C标准,可以克服同源策略的限制2、针对CORS请求,浏览器将其分为两个类型:简单请求和非简单请求3、针对非简单请求,浏览器必须首先使用options方法发起一个预检请求,从而获知服务器端是否允许跨域请求。服务器确认允许之后,才发起实际的HTTP请求。在预检请求的返回中,服务器端也可以通知客户端,是否需要携带身份凭证(包括Cookies和HTTP认证的相关数据)二、options的请求场景1、简单请求与非简单

2021-08-18 21:55:56 887

原创 关于JS是否添加分号问题

一、关于分号添加javascript并不严格使用分号,当有一个需要分号的地方时,javaScript会在解析时自动添加,执行此操作的过程为自动插入分号。二、自动插入分号规则1、javaScript并不是在所有换行处都填补分号,只有在缺少了分号就无法解析代码的时候,javaScript才会填补分号。2、在解析源代码期间,要是发现以下特定的情况时,javaScript解析器将会自动添加分号:(1)当下一行代码开始破坏前一行的代码时(javaScript代码可以写在多行中)。<font color

2021-08-18 16:21:57 847

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除