面试总结系列（一）------ 国际化中台事业部

最新推荐文章于 2024-07-18 09:31:50 发布

gaoqiang1112

最新推荐文章于 2024-07-18 09:31:50 发布

阅读量448

点赞数

分类专栏： JavaScript 面试文章标签：面试 vue.js 前端

本文链接：https://blog.youkuaiyun.com/gaoqiang1112/article/details/122433451

版权

JavaScript 同时被 2 个专栏收录

23 篇文章

订阅专栏

面试

1 篇文章

订阅专栏

国际化中台事业部，三轮技术面+一轮HR面，11.15一面，11.22二面，11.30三面，127HR面，12.9意向
书，1.4offer，base杭州西溪园区一面(65min，P7):
1.项目介绍
2项目技术难点，怎么调研技术方案，怎么从用户层考虑优化方案
3场景题:前端给页面加水印，说说各种编码的特点，说说数字签名的特点

4场景题:实现协同编辑，说说你认为的技术关键点

5js数据类型，怎么区别array和object
6.原型链，es6class怎么设置原型、静态、实列方法
7letconst区别，const声明了数组，还能push元素吗，为什么?
8.说说你经常使用到的array方法，类数组怎么转换为数组，说说你知道的所有方法
9.DOM怎么添加事件
10.cookielocalstorage的区别，哪些情况和设置，请求不会携带cookie11.说说fetch，优缺点?怎么做polvfill
12Vuedata为什么是函数，深拷贝、浅拷贝
13Vue使用nextTick的原因和作用，项目哪些场景用到了nextTick

答案解析

1. 略

2. 略

3. a主要利用创建div 然后循环后 append到页面最后利用定位旋转等属性做成水印特效

b 编码特点不太了解

c 数字签名 https://www.iteye.com/blog/justjavac-1144151 这个文章想到清晰的解释了这问题。

4. 协同编辑比较好的文章。关键点（socket通信 Quill编辑器 ot记录操作处理中文输入保存作者等等）具体可以看下面的文章从零开始设计一个Web端多人协同编辑器 - 知乎

5. 这种题第一反应 typeof 肯定不行返回的都是object

js其他2种 A. Object.prototype.toString.call() B.instanceof C.Array.isArray

const arr = [6,6,6]
const obj = {sex:1}
Array.isArray(arr) // true
Array.isArray(obj) // false


const arr = [7,7,7]
const obj = {sex: 2}
Object.prototype.toString.call(obj)==="[object Array]" // false
Object.prototype.toString.call(arr)==="[object Array]" // true


const arr = [8,8,8]
const obj = {sex: 2}
arr instanceof Array // true
obj instanceof Array // false


const arr = [8,8,8]
const obj = {sex: 2}
Array.prototype.isPrototypeOf(arr) // true
Array.prototype.isPrototypeOf(obj) // false

6. 比较清晰的2个文章。

https://segmentfault.com/a/1190000010275040

es6中class类的静态方法、实例方法、实例属性、(静态属性) - 古墩古墩 - 博客园

let与const都是只在声明所在的块级作用域内有效。

let声明的变量可以改变，值和类型都可以改变，没有限制。

const 声明的变量只要不改变内存地址，就可以修改内容， push是可以的，通过索引改变值也是可以的，因为没有改变指向地址，但是赋值是不行的，

8. 数组的方法 https://www.runoob.com/jsref/jsref-push.html

类数组：

A.概念：

拥有length属性，其它属性（索引）为非负整数(对象中的索引会被当做字符串来处理，这里你可以当做是个非负整数串来理解)
不具有数组所具有的方法

B.例子： var a = {'1':'a','2':'b','4':'c',length:4};

C.类数组转成数组：

var toArray = function(s){  
    try{  
        // 方法1
        return Array.prototype.slice.call(s);  
        // 方法2 
        // return Array.prototype.splice.call(s,0);  
    } catch(e){  
        // 方法3
        var arr = [];  
        for(var i = 0,len = s.length; i < len; i++){   
           arr[i] = s[i]; 
        }  
        return arr;  
    }     
}

1 js类数组转数组的方法 - 简书

2 js类数组转数组的方法（ArrayLike） - gq_orange - 博客园

3 参考文章中多看了个 isFinit 方法 JavaScript isFinite() 函数 | 菜鸟教程

isFinite() 函数用于检查其参数是否是无穷大，也可以理解为是否为一个有限数值（finite number）。

提示： 如果参数是 NaN，正无穷大或者负无穷大，会返回 false，其他返回 true。

9. addeventlistener和on 吧感觉问的不会那么简单这里就说一下这2个添加事件的区别吧

on 当多次绑定的时候后面的会覆盖前面的

addeventlistener 可以实现多次绑定依次执行

10. cookie 是html4 时代的东西每次请求都会自动带上大小4k 可操作可禁止操作生命周期如果不设置就是网页打开和关闭如设置可保存到硬盘操作麻烦存储的都是字符串切每次要自己进行切割啥的很费劲(之前写的如何操作cookie) 等等上文章链接读一下学习即可 cookies、sessionStorage和localStorage解释及区别 - pengc - 博客园

如何操作可以不携带cookie 就是设置默认的ajax 是不带cookie的

想带cookie 这么设置。

$.ajax({
　　　　url: 'www.baidu.com',
　　　　type: 'post',
　　　　data: '',
　　　　//  默认情况下，标准的跨域请求是不会发送cookie的
　　　　xhrFields: {
　　　　　　withCredentials: true
　　　　},
　　　　success: (rs) {
　　　　}
　　})

网上的文章都是不带cookie。然后想携带cookie 然后各显神通这个问题是不携带很奇怪发一个处理不带cookie的文章链接前台请求不带cookie的问题解决方案大汇总_u013282737的博客-优快云博客_请求头没有cookie

11. 优缺点链接。fetch和axios的优缺点_维多利亚少年-的博客-优快云博客_fetch和axios

如何polyfill 看这篇讲的不要太好 fetch使用的常见问题及解决办法 - wonyun - 博客园

12.data是函数的目的是为了隔离各个页面的data 控制作用域防止变成全局被复用被影响

深拷贝和前拷贝。js浅拷贝与深拷贝的区别和实现方式 - 简书

13. 上2个文章

https://segmentfault.com/a/1190000012861862

vue.nextTick有什么用途 - 知乎

我在项目中的使用场景其实nexttick作用就是页面渲染完做点什么。比如隐藏的显示后要做什么

比如我的项目视频源切换后的自动播放。比如一个文章的滚动列表进到第3个文章右侧的列表要渲染完定位到第三个再比如做一个2个人的聊天页面页面要一直滚动到某个位置都是在dom渲染完后在去定位到某个位置的