Violetks Blog

Thinking will not overcome fear but action will.

JavaScript 深拷贝与浅拷贝（★）

一、深拷贝与浅拷贝如何区分深拷贝与浅拷贝，简单点来说，就是假设 B 复制了 A，当修改 A 时，看 B 是否会发生变化，如果 B 也跟着变了，说明这是浅拷贝，如果 B 没变，那就是深拷贝。 // 浅拷贝： let a = [0, 1, 2, 3, 4]; let b = a; console.log(a === b); a[0] = 1; console.log(a, b); 二、...

Posted by violetks on April 8, 2023

JavaScript 数组方法

一、JavaScript 数组方法有哪些（★） 1、push()：向数组的末尾添加一个或者多个元素，并返回新的长度。 2、pop()：用于删除并返回数组的最后一个元素。 3、unshift()：可向数组的开头添加一个或多个元素，并返回新的长度。 4、shift()：用于把数组的第一个元素从其中删除，并返回第一个元素的值。 5、isArray()：用来判断一个对象是不是...

Posted by violetks on April 7, 2023

JavaScript 代码片段分析

一、setTimeout 输出 10 个 10 for (var i = 0; i < 10; i++) { setTimeout(function() { console.log(i); }, 1000); } 分析：涉及到 JavaScript 的执行机制，JavaScript 是一个单线程的解释器，setTimeout是异步执行函数，本质是间隔一定时间将任务添加...

Posted by violetks on April 6, 2023

JavaScript 执行机制（★）

一、JavaScript 是一门单线程语言，是按照语句出现的顺序执行。二、JavaScript 事件循环分为：同步任务、异步任务。任务进入执行栈之后，同步任务和异步任务分别进入不同的执行场所，同步的进入主线程，异步的进入Event Table并注册函数。当指定的事情完成时，Event Table会将这个函数移入Event Queue。主线程内的任务执行完毕为空之后，会去...

Posted by violetks on April 5, 2023

JavaScript 实现继承的六种方式

一、JavaScript 的继承许多面向对象语言都支持两种继承的方式：接口继承和实现继承。接口继承只继承方法签名，而实现继承则继承实际的方法。在 JavaScript 中由于函数没有签名也就无法实现接口继承，而只支持实现继承，主要通过原型链来实现的。官方文档对于原型链的描述：其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。要理解这个概念要先弄清楚构造函数、原型、实例的关...

Posted by violetks on April 4, 2023

JavaScript 延迟加载的六种方式

一、概念 JavaScript 延迟加载，也就是等页面加载完成之后再加载 JavaScript 文件，有助于提高页面加载速度。延迟脚本：带async或defer属性的script标签，以及通过document.createElement('script')创建并且没有指定script.async=false的脚本默认为异步延迟脚本（必须为非内联脚本）。一般情况下，浏览器在解析 HTML ...

Posted by violetks on April 3, 2023

JavaScript 作用域

一、什么是作用域作用域是可访问变量的集合，JS 中的作用域是一个存储变量、函数和对象的位置，每个变量、函数和对象都被存储在一个特定的作用域中，它是指变量和函数在代码中的可访问范围，作用域决定了代码中哪些部分可以访问特定的变量和函数。可以将变量和函数封装在不同的作用域中，使其在合适的范围内可访问。就像上图中的示例，Foo1 无法获取 Foo2 中的 var4 变量。二、作用域类型 ...

Posted by violetks on April 2, 2023

前端性能优化

一、感知性能优化让用户感觉你的网站访问很快，没有衡量标准。如果一个页面的加载时间很长，可以通过一些方式让用户觉得没有那么慢。 1、使用 loading 图标、骨架屏二、HTML 优化 1、压缩 HTML HTML 代码压缩，将注释、空格和新行从生产文件中删除。删除所有不必要的空格、注释和中断行将减少 HTML 的大小，加快网站的页面加载时间，并显著减少用户的下载时间。 2、删除不必要...

Posted by violetks on April 1, 2023

原型链

一、原型（★） 1、函数中 prototype 指向原型对象当我们创建一个函数时，函数都会有一个默认属性prototype，该属性指向一个原型对象。 function fun() {} fun.prototype // 原型对象 2、对象中 __proto__ 指向原型对象（1）当函数作为普通函数进行调用时，该属性不会有任何作用。（2）当函数作为构造函数进行调用时，构建出来的实...

Posted by violetks on March 2, 2023

函数柯里化

函数柯里化（★） 1、柯里化（Currying）是把接受多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回接受余下的参数且返回结果的新函数的技术。简单来说，只传递给函数一部分参数来调用它，让它返回一个函数去处理剩余的参数，这个过程就称之为柯里化。 2、一个柯里化的函数首先会接受一些参数，接受了这些参数之后，该函数并不会立即求值（延迟执行），而是继续返回另外一个函数，...

Posted by violetks on March 1, 2023