2021-11-13 面试2-优快云博客

本文链接：https://blog.youkuaiyun.com/xxxxxxxr/article/details/121304697

本文深入探讨了JavaScript中的API作用，包括RPC、SQL、文件传输、信息交付等。同时，讲解了BFC、CSS盒模型、ES5与ES6的差异、AJAX、跨域解决方案CORS、DOM操作、HTTP事务处理流程、原型链概念、闭包特性和用途、以及各种布局模式。此外，还讨论了JavaScript中的作用域链、事件循环机制、计算属性与侦听器的区别，并阐述了不同HTTP请求步骤及JS执行顺序。最后，提到了Vue中父子组件的通信方式以及原生JS的重要性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

API的作用：
　　1.远程过程调用（RPC）：通过作用在共享数据缓存器上的过程（或任务）实现程序间的通信。
　　2.标准查询语言（SQL）：是标准的访问数据的查询语言，通过通用数据库实现应用程序间的数据共享。

　　3.文件传输：文件传输通过发送格式化文件实现应用程序间数据共享。
　　4.信息交付：指松耦合或紧耦合应用程序间的小型格式化信息，通过程序间的直接通信实现数据共享。
　　原理：
　　API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。

BFC就是页面上一个单独的容器，容器内部的元素不会影响到外面的元素

标准模型+ IE模型(区别) 内容+内边距+边框 box-sizing属性的作用具备栅格系统 box-sizing 属性是用来更改CSS盒模型中的这种计算元素宽高的一种方法

要实现界面主区域块100%显示

ES5：
定义变量使用var 变量进行变量提升同一作用域下可以声明同名变量（而let和const不可以）

ES6中，有两种定义let和const变量的新方法。有解构和速度运算符，箭头功能是ES6中引入的新功能，通过它不需要function关键字来定义函数。ES6引入了for?of循环的概念，以对可迭代对象的值执行迭代。新增了let命令，用来声明变量。类似于var，但是所声明的变量，只在let命令所在的代码块内有效。let 不允许在相同作用域内，重复声明同一个变量。ES6可以使用新增的模板字符串来进行变量和字符串的拼接

AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。

使用CORS解决跨域问题

跨域问题是针对ajax的一种限制。CORS是一个W3C标准，全称是"跨域资源共享"

浏览器对跨域请求区分为“简单请求”与“非简单请求”

DOM节点操作：

更新：更新该DOM节点的内容，相当于更新了该DOM节点表示的HTML的内容；
遍历：遍历该DOM节点下的子节点，以便进行进一步操作；
添加：在该DOM节点下新增一个子节点，相当于动态增加了一个HTML节点；
删除：将该节点从HTML中删除，相当于删掉了该DOM节点的内容以及它包含的所有子节点。

HTTP应用于WEB端内容获取是基于客户/服务器模式，且面向连接的。典型的HTTP事务处理有如下的过程： [7]

（1）客户与服务器建立连接；

（2）客户向服务器提出请求；

（3）服务器接受请求，并根据请求返回相应的文件作为应答；

（4）客户与服务器关闭连接。

原型链是实例对象和原型对象之间的链接。

每个函数都有一个prototype属性，这个prototype属性就是原型对象，这个函数通过new构造函数创建出来的实例对象，这个实例对象自己会有一个指针(_proto_)指向他的构造函数的原型对象！这样构造函数和实例对象之间就通过( _proto_ )连接在一起形成了一条链子。

为什么要使用原型链呢？
1.为了实现继承，简化代码，实现代码重用！
2.只要是这个链条上的内容，都可以被访问和使用到！

使用原型链有什么作用？
继承
prototype用来实现基于原型的继承与属性的共享
避免了代码冗余，公用的属性和方法，可以放到原型对象中，这样，通过该构造函数实例化的所有对象都可以使用该对象的构造函数中的属性和方法！
减少了内存占用

proto和prototype的区别

_proto_ ：是实例对象指向原型对象的指针，隐式原型，是每个对象都会有的一个属性。
prototype：是构造函数的原型对象，显式原型，只有函数才会有。

原型链的源头是Object！

闭包的特点：

1：在一个函数内部定义另外一个函数，并且返回内部函数或者立即执行内部函数。

2：内部函数可以读取外部函数定义的局部变量

3：让局部变量始终保存在内存中。也就是说，闭包可以使得它诞生环境一直存在。

闭包的另一个用处，是封装对象的私有属性和私有方法。

Filter也称之为过滤器把Array的某些元素过滤掉，然后返回剩下的元素。

创建一个新数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意：filter()不会对空数组进行检测、不会改变原始数组

函数 function 为必须，数组中的每个元素都会执行这个函数。且如果返回值为 true，则该元素被保留；
函数的第一个参数 currentValue 也为必须，代表当前元素的值。

href="#"与href="javascript:void(0)"的区别

# 包含了一个位置信息，默认的锚是#top 也就是网页的上端。

而javascript:void(0), 仅仅表示一个死链接。

在页面很长的时候会使用 # 来定位页面的具体位置，格式为：# + id。

ES6 新增加了两个重要的 JavaScript 关键字: let 和 const。

let 声明的变量只在 let 命令所在的代码块 {} 内有效，在 {} 之外不能访问。

const 用于声明一个或多个常量，声明时必须进行初始化，且初始化后值不可再修改：

const声明的常量必须初始化，而let声明的变量不用
const 定义常量的值不能通过再赋值修改，也不能再次声明。而 let 定义的变量值可以修改。

之前JavaScript 只有两种作用域： 全局变量 与 函数内的局部变量。函数内使用 var 声明的变量只能在函数内容访问，如果不使用 var 则是全局变量。

ES5 只有两种声明变量的方法：var命令和function命令。

ES6 除了ES5中的两种方法外，还包括let，const，import命令和class命令。所以，ES6 一共有 6 种声明变量的方法。

如果将一个匿名函数赋值给一个变量，ES5 的name属性，会返回空字符串，而 ES6 的name属性会返回实际的函数名。

switch：主要是将choose中的值和某一个case值进行比较，而case值是一个确定的值。 if else：每个执行的语句前都会有一个条件 if 语句适用范围比较广，只要是 boolean 表达式都可以用 if 判断；而 switch 只能对基本类型进行数值比较。

Function
函数实际上是对象，每个函数实际上都是 Function 类型的实例。而且与其他引用类型一样具有属性和方法。函数名实际上是一个指向内存堆中某个函数对象的指针。

块元素可以包含行内元素，行内元素不能包含块元素；
p元素里面不能包含块级元素；
特殊的块元素只能包含行内元素，不能再包含块元素，包括：h1-h6、p；
特殊的元素下面只能包含特定的标签元素，例如：table下面是thead、tbody，ul下面是li，ol下面是li，dl下面是dt、dd，如果有错误嵌套的话html会将其转为正确的嵌套标签；
块状元素：body、div、p、h1-h6、ul、li、table、tr、td；

行内元素：span、a、i、strong；

行内块元素：input、img；

    块状元素指的是有自身宽高、可以设置margin和padding、占据一行、多个块状元素排列方式从上到下；

    行内元素指的是自身没宽高、可以设置水平的margin和padding、不占据一行、多个行内元素排列方式从左到右；

    行内块元素，自身可设置宽高、可以设置margin和padding、但是不占据一行、多个行内块元素排列方式也是从左到右。