[5.19]前端面试

卷菜包
231 阅读4分钟

一、JS

1.如何处理跨域

什么是跨域呢，简单地理解就是因为JavaScript同源策略的限制，a.com域名下的js无法操作b.com或是c.a.com域名下的对象。
同源策略限制从一个源加载的文档或脚本如何与来自另一个源的资源进行交互。
当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域。不同域之间相互请求资源，就算作“跨域”。跨域并不是请求发不出去，请求能发出去，服务端能收到请求并正常返回结果，只是结果被浏览器拦截了。

实现了CORS接口，就可以跨源通信。

在响应头上添加Access-Control-Allow-Origin属性，指定同源策略的地址。同源策略默认地址是网页的本身。只要浏览器检测到响应头带上了CORS，并且允许的源包括了本网站，那么就不会拦截请求响应。

Nginx

proxy代理是前端用的最多的解决跨域的方法。浏览器端口号8080,目标服务器端口号5000

// vue.config.js中配置代理
devServer:{
  proxy:"http://localhost:5000"
}
// 使用代理
axios.get('http://localhost:8080/students').then(
	response => {
		console.log('请求成功了',response.data)
	},
	error => {
		console.log('请求失败了',error.message)
    }
)

2.面向对象多态概念

指的是子类对象可以直接赋给父类变量，Java中，可以通过向上转型来实现多态。 js:子类对父类方法的重写, 这个会默认执行子类的方法, 即实现多态
子类的创建的时候, 写自己的方法, 继承父类, 调用父类的同名方法的时候, 父类原型上的this此时指向子类,这个时候就会调用不同子类的方法 子类原型指向父类

function Base() {
      Base.prototype.initfun = function() {
        this.init()
      }
    }
    function Sub1 () {
      this.init = function() {
        console.log('1')
      }
    }
    function Sub2() {
      this.init = function() {
        console.log('2')
      }
    }
    Sub1.prototype = new Base()
    Sub2.prototype = new Base()
    new Sub1().initfun () // sub1的init方法
    new Sub2().initfun () // sub2的init方法

3.虚函数

只有用virtual声明类的成员函数，称之为虚函数。 实现多态的三大步：
1.存在继承关系 子类继承父类
2.子类重写父类的virtual function
3.子类以父类的指针或者是引用的身份出现

二、ES6

1.promise概念

Promise 是一个对象，从它可以获取异步操作的消息。Promise 提供统一的 API，各种异步操作都可以用同样的方法进行处理。 Promise对象有以下两个特点。
（1）对象的状态不受外界影响。
（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。
Promise 实例具有then方法，也就是说，then方法是定义在原型对象Promise.prototype上的。它的作用是为 Promise 实例添加状态改变时的回调函数。

三、Vue

1.vue-route下都有什么配置

  • router-link页面URL的跳转,可以在不重新加载页面的情况下更改 URL，处理 URL
  • router-view将显示与 url 对应的组件。
  • router-link to目标路由的链接。 当被点击后，内部会立刻把 to 的值传router.push()

动态路由

const router = new VueRouter({
  routes: [
    {
      path: '/user/:id', component: User,
      children: [
        // 当 /user/:id 匹配成功，
        // UserHome 会被渲染在 User 的 <router-view> 中
        { path: '', component: UserHome },
        // ...其他子路由
      ]
    }
  ]
})

四、axios

1.axios请求头部

-axios发送post请求时默认是直接把 json 放到请求体中提交到后端的，axios默认的请求头content-type类型是’application/json;charset=utf-8’.

let params = new FormData()
params.append('file', this.file)
params.append('qq', this.qq)
params.append('weChat', this.WeChat)
axios.post(URL, params, {headers: {'Content-Type': 'multipart/form-data'}}).then(res => {
          if (res.data.code === 0) {
                this.$router.go(-1)
          }
        }).catch(error => {
          alert('更新用户数据失败' + error)
        })

2.参数拼接

设置获取参数，在axios中拼接

五、数据库

1.left join 和 right join区别？

left join：返回左表所有记录，再返回右边符合条件的记录 right join：返回右表所有记录，再返回左表符合条件的记录

image.png

六、计算机网络

1.链路层协议？运输层协议？

image.png

1.2 扩展

  1. 物理层：主要功能是直接在物理传输介质上发送和接收数据位，为数据链路层提供物理连接。
  • IEEE 802.3:定义了有线以太网的物理层和数据链路层的介质访问控制 （MAC）
  1. 数据链路层：主要功能是负责信息从一个结点到另一人结点的物理传输
  • PPP(点对点协议):用来通过拨号或专线方式建立点对点连接发送数据
  1. 网络层：负责数据从一个结点到另一个结点的传输，根据地址为信息在网络中传输是选择最佳路径
  • IP(网络互联协议):为主机提供一种无连接、不可靠的、尽力而为的数据包传输服务
  • ICMP(网络控制报文协议):是一种面向无连接的协议，用于传输出错报告控制信息
  • ARP(地址解析协议):据IP地址获取物理地址的一个TCP/IP协议
  • RARP(反向地址转换协议):发出要反向解析的物理地址并希望返回其对应的IP地址，应答包括由能够提供所需信息的RARP服务器发出的IP地址
  1. 运输层：负责数据传输时端到端的完整性，隐藏了上一层提供数据传输时任何网络独立信息。
  • TCP(传输控制协议):一种面向连接的、可靠的、基于字节流的传输层通信协议
  • UDP(用户数据报协议):面向事务的简单不可靠信息传送服务
  • TLS(传输层安全协议):在两个通信应用程序之间提供保密性和数据完整性
  1. 会话层：负责应用程序之间建立、维持和中断会话，同时也提供对设备和结点之间的会话控制，协调系统和服务之间的交流
  2. 表示层：提供应用层数据的公共表示,即统一数据格式,从而使得数据能在两个系统中传输。
  3. 应用层:提供各种各样的应用层协议,为用户与网络之间提供一个打交道的接口。
  • TELENT:使用远程计算机上所拥有的本地计算机没有的信息资源
  • DNS(域名解析协议):将域名解析为IP地址
  • HTTP(超文本传输协议):规定web服务端和客户端的数据传输格式
  • HTTPS(超文本传输安全协议):是HTTP加上TLS/SSL协议构成的可加密传输的网络协议
  • FTP(文件传输协议):网络共享文件传输
  • NFS(网络文件系统):用户和程序可以像访问本地文件一样访问远端系统上的文件。

2.400下各个状态码？

  • 400 （错误请求） 服务器不理解请求的语法。
  • 401 （未授权） 请求要求身份验证。 对于需要登录的网页，服务器可能返回此响应。
  • 403 （禁止） 服务器拒绝请求。
  • 404 （未找到） 服务器找不到请求的网页。
  • 405 （方法禁用） 禁用请求中指定的方法。
  • 406 （不接受） 无法使用请求的内容特性响应请求的网页。
  • 407 （需要代理授权） 此状态代码与 401（未授权）类似，但指定请求者应当授权使用代理。
  • 408 （请求超时） 服务器等候请求时发生超时。
  • 409 （冲突） 服务器在完成请求时发生冲突。服务器必须在响应中包含有关冲突的信息。
  • 410 （已删除） 如果请求的资源已永久删除，服务器就会返回此响应。

2.2 扩展

image.png

3.url有哪些内容？

协议部分、域名、端口、路径（虚拟路径）、携带的参数、哈希值；
协议部分：http https；
域名：www.baidu.com网站的域名
端口： 在没有填写的情况下默认端口就是80
路径（虚拟路径）： index.html虚拟目录
携带的参数：？ name=mo 多个参数用&连接

七、Linux

1. Linux上查找最大文件？

1.1 第一种：ls

比如，我要列出/data/log/目录中的20个最大文件，可以： Is-ISh /data/log/|head-20

1.2 第二种：find

fid本身就是查找命令，可以递归查找一个目录的子目录，所以用它是自然的。

  • 查找/etc目录下最大的5个文件： find /etc-type f-printf "%s\t%p\n"sort-n tail-5 xargs Is-SIh
  • 查找当前用户名下最大的10个文件 find $HOME -type f-printf "%s\t%p\n"sort-nr head-10 xargs Is-SIh
  • 查询大于200M的文件 find -type f-size +200M xargs Is-SIh
  • 查询100M和200M之间的文件 find -type f-size +100M-size +200M xargs Is-SIh
  • 查询root目录下最大的5个文件 find /root-type f -exec Is-s {};sort-n tail -n5 xargs Is-SIh
  • 查询/目录下10天以前最大的5个文件 find /-type f -mtime +10-printf "%s\t%p\n"sort-n|tail-5 xargs Is-SIh

1.3 第三种：du

du命令可以查看磁盘空间的使用情况，自然也可以用来查看磁盘上占用空间较多的文件和文件夹。

  • 查找/root下5个最大的文件 du -ah /root sort-nr head -n5
  • 查找当前目录下最大的5个目录 du -ah sort -nr head -n5
  • 查找根目录下最大目录文件（包括子文件夹） du -Sh sort-rh head -n10
  • 只看大小在GB范围内的所有文件 du -ah grep "[0-9]G\b"
avatar
文章
阅读
粉丝