乐趣区

关于java:记录昨天面试的6道面试题内含答案

明天被抓差给候选者进行初面。在这里记录一下面试中波及的几个知识点。

每次面试我都会递给候选者一瓶水,这样能够让候选者没那么缓和,有更好的状态进行面试,毕竟面试是双向选择,公司也须要尽快找到适合的人,没那么多网上说的心理战。

这里我还想吐槽一下面试造火箭工作拧螺丝,尤其是开发行业,很多面试官针对本人善于的方向大问特问,齐全疏忽了候选人的劣势,从而给候选人带来一个极差的面试体验。面试最好还是要通过候选人身上的长处来判断对方是否适宜退出你的团队。

失常的面试应该是依照候选人简历中波及的技术点提问,不然面试时给你一份简历干嘛,至于简历中未波及的知识点有没有必要问,我感觉没什么必要的,因为很多人在写简历的时候都是力求全面,巴不得据说过的知识点都写上相熟。所以依照简历发问就能够了。除此之外再问一些最近风行的技术,次要考查的是候选人对新技术的敏感性和对新事物的承受能力。

如果其中波及到候选人答复不上的问题也须要给候选人做一番解答,毕竟人家那么远来你这面试,总要有所播种不是。

最初在简历中筛选一个候选人比拟善于的点深刻来问,这个环节我个别称为定级,后面的问题如果答复的不错,这个人根本就通过了,到最初就要给人定级。如果后面问题答复的不现实根本也到不了这个环节。

Proxy

在 2020 年来看 Proxy 早曾经不是一个生疏的词了,他能做的是有很多,尤其在 Vue3.0 通过 Proxy 来重构之后,很多面试官喜爱问这个 Proxy 以及和 Object.defineProperty 的比照。

Proxy 是专门为对象设置拜访代理器的,通过 Proxy 能够轻松监督到对象的读写过程,相比于 defineProperty,Proxy 他的性能要更为弱小甚至应用起来也更为不便。

这里咱们定义一个 person 对象,咱们通过 new Proxy 的形式来去为咱们的 person 来创立一个代理对象。

Proxy 构造函数的第一个参数就是咱们须要代理的对象,这里是 person,第二个参数也是一个对象,咱们能够把这个对象称之为代理的解决对象,这个对象中能够通过 get 办法来去监督属性的拜访,通过 set 办法来去介绍对象当中设置属性这样的一个过程。

const person = {
    name: 'yd',
    age: 18
}

const personProxy = new Proxy(person, {get() {},
    set() {}
})

先来看 get 办法,这个办法最简略能够接管两个参数,第一个就是所代理的指标对象,第二个就是内部所拜访的这个属性的属性名。这个办法的返回值将会作为内部去拜访这个属性失去的后果。

{get(target, property) {console.log(target, property);
        return property in target ? target[property] : undefined;
    }
}

再来看下 set 办法,这个办法默认接管三个参数, 别离是代理指标对象,以及咱们要写入的属性名称还有最初咱们要写入的属性值。咱们能够做一些校验,比如说如果设置的是 age,他的值就必须是整数,否则就抛错。

{set(target, property, value) {console.log(target, property, value);
        if (property === 'age') {if (!Number.isInteger(value)) {throw new TypeError(``${value} must be a integer);
            }
        }
        target[property] = value;
    }
}

相比于 Object.defineProperty, Proxy 到底有哪些劣势。

首先最显著的劣势就是在于 Proxy 要更为弱小一些,那这个弱小具体体现在 Object.defineProperty 只能监听到对象属性的读取或者是写入,而 Proxy 除读写外还能够监听对象中属性的删除,对对象当中办法的调用等等。

第二点劣势就是对于数组对象进行监督,通常咱们想要监督数组的变动,根本要依附重写数组办法,这也是 Vue 的实现形式,proxy 能够间接监督数组的变动。以往咱们想要通过 Object.defineProperty 去监督数组的操作最常见的形式是重写数组的操作方法,这也是 Vue.js 中所应用的形式,大体的形式就是通过自定义的办法去笼罩掉数组原型对象上的 push,shift 之类的办法,以此来劫持对应的办法调用的过程。

对象的键反对什么类型

这个问题考查的是候选人的基础知识是否扎实。

很多人都会认为对象的键是字符串类型,如果在以前的确没错,然而 ES2015 版本中对象的键类型还能够是 Symbol。

const person = {
       name: 'yd',
    [Symbol()]: 18
}

这也是引出上面的 Symbol。

Symbol

在 ECMAScript2015 之前,对象的属性名都是字符串,而字符串是有可能会反复的。如果反复的话就会产生抵触。

以前解决这种问题最好的形式就是约定,然而约定的形式只是躲避了问题并不是彻底解决了这个问题。如果在这个过程中有人不恪守约定那这个问题依然会存在。

ES2015 为了解决这个问题提供了一种全新的原始数据类型 Symbol,翻译过去的意思叫做符号,翻译过去就是示意一个举世无双的值。通过 Symbol 函数就能够创立一个 Symbol 类型的数据,而且这种类型的数据 typeof 的后果就是 symbol,那这也就示意他的确是一个全新的类型。

const s = Symbol();
typeof s; // symbol 类型 

这种类型最大的特点就是举世无双,也就是说咱们通过 Symbol 函数创立的每一个值都是惟一的。他永远不会反复。

Symbol() === Symbol(); // false

思考到在开发过程中的调试 Symbol 创立时容许接管一个字符串,作为这个值的形容文本, 对于咱们屡次应用 Symbol 时就能够辨别出是哪一个 Symbol,但这个参数也仅是形容作用,雷同的形容字段生成的值仍是不同的。

const s1 = Symbol('foo');
const s2 = Symbol('foo');

s1 === s2; // false

从 ES2015 开始,对象就曾经容许应用 Symbol 作为属性名。那也就是说当初对象的属性名能够是两种类型,字符串和 Symbol。

const person = {[Symbol()]: 123,
    [Symbol()]: 456
}

如果咱们须要在全局去复用一个雷同的 Symbol 值,咱们能够应用全局变量的形式去实现,或者是应用 Symbol 类型提供的一个静态方法去实现。具体就是 Symbol 的静态方法 for,这个办法接管一个字符串作为参数,雷同的参数肯定对应雷同的值。

const s1 = Symbol.for('foo');
const s2 = Symbol.for('foo');

s1 === s2; // true

这个办法保护了一个全局的注册表,为字符串和 Symbol 提供了一个对应关系。须要留神的是,在外部保护的是字符串和 Symbol 的关系,那也就是说如参数不是字符串,会转换为字符串。

const s1 = Symbol.for('true');
const s2 = Symbol.for(true);

s1 === s2; // true

JSONP

很多人对 jsonp 的了解都停留在概念上,没有真正了解过他的原理,他为什么能够跨域,当然不仅仅是 script 标签不受同源策略影响,实际上 jsonp 是一种前后端约定的解决方案。

不过当初根本曾经很少用到了。因为当初曾经有了更风行的 CORS 计划,相对来说也会更平安,不过 jsonp 还是有其本身的劣势的。

很多人都晓得浏览器的同源策略,就是发送申请的页面地址和被申请的接口地址的域名,协定,端口三者必须统一,否则浏览器就会拦挡这种申请。浏览器拦挡的意思不是说申请公布进来,申请还是能够失常触达服务器的,如果服务器失常返回了浏览器也会接管的到,只是不会交给咱们所在的页面。这一点查看 network 是能够看到的。

jsonp 个别是利用 script 标签的 src 属性,对于服务器来说只有申请和响应两种操作,申请来了就会响应,无论响应的是什么。申请的类型切实太多了。

浏览器输出一个 url 是一个申请,ajax 调用一个接口也是一个申请,img 和 script 的 src 也是申请。这些地址都会触达服务器。那为什么 jsonp 个别会选用 script 标签呢,首先大家都晓得 script 加载的 js 是没有跨域限度的,因为加载的是一个脚本,不是一个 ajax 申请。你能够了解为浏览器限度的是 XMLHttpRequest 这个对象,而 script 是不应用这个对象的。

仅仅没有限度还不够,还有一个更重要的点因为 script 是执行 js 脚本的标签,他所申请到的内容会间接当做 js 来执行。

这也能够看出,jsonp 和 ajax 对返回参数的要求是不同的,jsonp 须要服务返回一段 js 脚本,ajax 须要返回的是数据。

因而这就要求服务器独自来解决 jsonp 这中申请,个别服务器接口会把响应的数据通过函数调用的形式返回,比如说返回的内容是 ’yd’,那就要返回成 cb(‘yd’)

cb('yd')

这是一段函数调用的脚本,通过 script 标签加载之后会立刻执行的,如果咱们在全局定义一个 cb 函数。那么这段脚本执行的时候就会调用到咱们定义的那个函数,函数中的参数就是服务返回的值了。前端也就能够在这个函数中获取到了。

function cb (data) {console.log(data);
}

所以说 jsonp 是前后端独特约定的一种后果。

CORS

浏览器通过同源策略来限度前后端的跨域问题,但同时也给了相应的解决方案。

服务器在返回相应的时候能够通过设置响应头来容许哪些网址跨域申请,这样前端就能够胜利拿到响应的后果了。所以这也证实了,前端拿不到后果不是服务器不返回,而是浏览器没有给到前端。

Access-Control-Allow-Origin: www.xxxx.com

webpack 的 proxy 是如何解决跨域的?

后面说了,跨域是因为浏览器的同源策略限度,问题产生在浏览器身上,那咱们是不是能够避过浏览器呢。后面我写过一篇前端须要晓得的 nginx,外面介绍了反向代理和负载平衡,其实这里就像是反向代理一样。

咱们在应用 webpack 开发我的项目的时候,webpack 的 dev-server 模块会启动一个服务器,这个服务器不止帮咱们做了自动更新,同时也能够做到反向代理。

就是咱们把申请发送给 webpack-dev-server, 而后 webpack-dev-server 再去申请后端服务器,服务之间的申请是没有跨域问题的,只有后端返回了 webpack-dev-server 就能拿到,而后再返回给前端。

好了基本上就问了这几个问题,老板说面试工夫管制在 20 分钟左右。

小编这里也整顿了小米、腾讯、网易等一线大厂 2020 年最新面试材料。

须要的能够通过以下形式。

获取形式:1. 私信, 发送“666”

2. 评论区,评论“666”

退出移动版