Hillyee-blog

Composition API 1. setup 1.1 setup函数有两个参数：props，context props：其实就是父组件传递过来的属性，但是在setup外面依然需要用props接收 context：里面包含三个属性： attrs：父组件传递过来的没有被prop接收的属性 slots：父组件传递过来的插槽 emit：当组件内部需要发出事件的时候用（vue2里面是this.$emit，但是vue3中，setup不能访问this） 1.2 setup 函数的返回值 setup() { let a = 1 return { a }} setup的返回值可以在模板 template 中使用，也就是可以代替data 但是直接这么返回变量，是没有响应式的 1.3 setup 不可以使用 this this 并没有指向当前组件实例 在 setup 被调用之前，data、computed、等都没有被解析 所以无法在 setup 中获取this 2. reactive API 为setup中定义的数据提 ...

面试题 — JS篇 问：JS 原始数据类型有哪些？引用数据类型有哪些？ 答：在JS中,存在7中原始数据类型,分别是： boolean,null,undefined,number,string,symbol,bigint 引用类型：Object(包含普通对象 Object, 数组对象 Array, 正则对象 RegExp,日期对象 Date,数字函数 Math,函数对象 Function) Symbol表示独一无二的值，主要是用来定义对象的唯一属性名 bigint 可以表示任意大小的整数 问：请说出下面代码的运行结果，并解释原因 function test(person) { person.age = 26 person = { name: 'hzj', age: 18 } return person}const p1 = { name: 'fyq', age: 19}const p2 = test(p1)console.log(p1) // -> & ...

1. TCP 三次握手过程 ? （首先，两个概念：SYN：同步标志 ACK：确认标志） 刚开始客户端处于 Closed 的状态，服务端处于 Listen 状态。进行三次握手： 第一次握手，客户端给服务器发送一个SYN报文，并指明客户端的初始化序列号 ISN。此时客户端处于 SYN_SEND 状态 第二次握手，服务器收到 SYN 报文之后，会以自己的 SYN 报文作为应答，并且也是指定了自己的初始化序列号序列号 ISN，同时会把客户端的 ISN + 1 作为 ACK 的值，表示自己已经收到了客户端的 SYN，此时服务器处于 SYN_REVD 的状态 第三次握手，客户端收到 SYN 报文之后，会回应一个 ACK 报文，也是一样的把服务器的 ISN + 1 作为 ACK 的值，表示已经收到了服务端的 SYN 报文，此时客户端处于 established 状态 最后服务器收到 ACK 报文之后，也处于 established 状态，此时，双方建立连接 2. 为什么需要三次握手？两次不行吗？ 其实这是由 TCP 的自身特点可靠传输决定的。 第一次握手，客户端发送网络包，服务端收到了，这样服务 ...

var、let、const 相关 var（ES5）let,const（ES6） 1. 作用域？ 简单来说，作用域就是一个独立的地盘，外层作用域无法读取内层作用域的变量，但是内层作用域可以访问外层作用域的变量或者定义外层作用域的同名变量。 2. var 变量提升？ var 特点？ 无论在全局作用域还是在局部作用域中，使用 var 关键字声明的变量都会被提升到该作用域的最顶部，这就是我们常说的变量提升 在代码预编译的时候，JavaScript 引擎会自动将所有代码里面以var 关键字声明的语句提升到当前作用域的顶端 function fn1() { var name = "jack"}// 等价于function fn1() { var name; name = "jack"} console.log(name) // undefinedvar name = "jack" var 的特点 存在变量提升 在变量未赋值时，变量为 undefined 一个变量可以多次 ...

call、apply、bind 实现 1. call 实现 首先我们要知道系统的 call 方法主要实现了什么 执行了函数 改变了 this 的指向 先看系统的call方法 function foo() { console.log("foo函数被执行", this);}function sum(num1, num2) { console.log("sum函数被执行", this); return num1 + num2}// 1. 传入对象foo.call({}) // 2. 传入null/undefinedfoo.call(null) // this自动替换为指向全局对象// 3. 传入其他，字符串，数字，布尔值等等foo.call("abc") // this 指向相应的对象let res = sum.call("123", 10,20)console.log(res) // 30 接下来我们开始实现自己的call（主要是实现思路， ...

JS 函数的 this 指向 1. this 在全局作用域下的指向 在浏览器中，this在全局作用域下指向 window console.log(this) // windowvar title = "hello"console.log(this.title) // helloconsole.log(window.title) // hello 2. this 的四个绑定规则 2.1 规则一：默认绑定 在独立函数调用的情况下会使用默认绑定 独立函数调用简单来说就是它没有绑定到某个对象上进行调用，简单看几个例子 // 例1function foo() { console.log(this)}foo() // window // 例2function foo1() { console.log(this);}function foo2() { foo1()}function foo3() { foo2()}foo3() // window // 例3var obj = { ...

一、JS 的内存管理 1. JS 的内存管理 JavaScript 会在定义变量时为我们分配内存 内存分配的方式是一样的吗？ JS 对于基本数据类型内存的分配，会在执行时直接在栈空间进行分配 JS 对于复杂数据类型内存的分配，会在堆内存中开辟一块空间，并且将这块空间的地址保存在栈空间 2. JS 的垃圾回收 垃圾回收的英文是 Garbage Collection，简称 GC 对于那些不再使用的对象，我们都称之为垃圾，它需要被回收，以释放出更多的内存空间 JavaScript的运行环境 js引擎都会内存垃圾回收器 3. 常见的两个 GC 算法 GC怎么知道哪些对象是不再使用的呢？这里就要用到 GC 算法了 3.1 引用计数 当一个对象有一个引用指向它的时候，那么这个对象的引用就 +1，当一个对象的引用为 0 时，这个对象就可以被回收掉 但是这个算法有一个很大的弊端，就是会产生循环引用 var obj1 = {friend: obj2}var obj2 = {friend: obj1} 3.2 标记清除 这个算法是设置 ...

1. 从输入 URL 到页面展示 发生了什么？ ​ 总体分为以下过程： DNS 域名解析：将域名解析成 IP 地址 TCP 连接：TCP 三次握手 发送 HTTP 请求 服务器处理请求并返回 HTTP 报文 浏览器解析渲染页面 断开连接：TCP 四次挥手 2. 浏览器工作原理 在浏览器中输入查找内容，浏览器是怎样将页面加载出来的？ 大致流程如下： 首先，用户输入服务器地址，与服务器建立连接 服务器返回对应的静态资源（index.html） 然后浏览器拿到 index.html 后进行解析 当解析时遇到 css 或 js 文件，就向服务器请求并下载对应的 css 和 js 文件 最后浏览器对页面进行渲染，执行 js 代码 3. 浏览器渲染过程 HTML Parser 将 HTML解析转换成 DOM 树 CSS Parser 将 样式表转换成 CSS 规则树 合并 DOM 树和 CSS 规则树，生成 render（渲染） 树 布局 render 树（Layout） 通过渲染树中渲染对象的信息，计算出每一个渲染对象的位置和尺寸 绘制 render 树（paint ...

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub. Quick Start Create a new post $ hexo new "My New Post" More info: Writing Run server $ hexo server More info: Server Generate static files $ hexo generate More info: Generating Deploy to remote sites $ hexo deploy More info: Deployment