ES6
-
列举常用的ES6特性:
-
箭头函数需要注意哪些地方?
-
let、const、var
-
拓展:var方式定义的变量有什么样的bug?
-
Set数据结构
-
拓展:数组去重的方法
-
箭头函数this的指向。
-
手写ES6 class继承。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
微信小程序
-
简单描述一下微信小程序的相关文件类型?
-
你是怎么封装微信小程序的数据请求?
-
有哪些参数传值的方法?
-
你使用过哪些方法,来提高微信小程序的应用速度?
-
小程序和原生App哪个好?
-
简述微信小程序原理?
-
分析微信小程序的优劣势
-
怎么解决小程序的异步请求问题?
这个简单:数组 元素重复 转换成val1, val2
function areArraysContentEqual(arr1, arr2) {
if (arr1.length !== arr2.length) {
return false;
}
// 重复数组元素 加1、2、3
const countArr1 = updateArray(arr1)
const countArr2 = updateArray(arr2)
/**
*
* @param {*} arr 数组 元素重复 转换成val1, val2
* @returns
*/
function updateArray(arr) {
const countMap = new Map();
const updatedArr = [];
for (const item of arr) {
if (!countMap.has(item)) {
// 如果元素是第一次出现,直接添加到结果数组
countMap.set(item, 0);
updatedArr.push(item);
} else {
// 如果元素已经出现过,添加带有编号的新元素到结果数组
const count = countMap.get(item) + 1;
countMap.set(item, count);
updatedArr.push(`${item}${count}`);
}
}
return updatedArr;
}
const flag = countArr1.some(item => !countArr2.includes(item))
return !flag
}
const array1 = ["apple", "banana", "cherry", "banana"];
const array2 = ["banana", "apple", "banana", "cherry"];
areArraysContentEqual(array1, array2) // true
// 其实这种存在漏洞的
const array3 = ["apple", "banana", "cherry", "banana", 1, '1', '1' ];
const array4 = ["banana", "apple", "banana", "cherry", '1', 1, 1];
// 应该是false
areArraysContentEqual(array3, array4) // true
因为把判断的 转为了字符串 updatedArr.push(${item}${count}
) 所以出问题了
3. 统计元素次数(最终方案)✍
function areArraysContentEqual(arr1, arr2) {
if (arr1.length !== arr2.length) {
return false;
}
// 创建计数对象,用于记录每个元素在数组中的出现次数
const countMap1 = count(arr1)
const countMap2 = count(arr2)
// 统计数组中的元素出现次数
function count(arr = []) {
const resMap = new Map();
for (const item of arr) {
resMap.set(item, (resMap.get(item) || 0) + 1);
}
return resMap
}
// 检查计数对象是否相等
for (const [key, count] of countMap1) {
if (countMap2.get(key) !== count) {
return false;
}
}
return true;
}
const array1 = ["apple", "banana", "cherry", "banana", 1, '1', '11', 11];
const array2 = ["banana", "apple", "banana", "cherry", '1', 1, '11', 11];
areArraysContentEqual(array1, array2) // true
4. 评论区大佬方案(+1、-1)👍
- 只需要一个对象
- 遍历第一个数组就 +1
- 遍历第二个数组就 - 1
- 最后遍历对象,只要不是都是 0 就等于不匹配
这样就不需要俩个对象了,而且第二个遍历的时候如果找不到这个值的话也可以直接退出了
function areArraysContentEqual3(arr1, arr2) {
if (arr1.length !== arr2.length) {
return false;
}
const countMap = new Map();
// 计数第一个数组的元素
for (const item of arr1) {
countMap.set(item, (countMap.get(item) || 0) + 1);
}
// 比较第二个数组与计数
for (const item of arr2) {
const val = countMap.get(item);
if (val === undefined || val <= 0) {
return false;
}
countMap.set(item, val - 1);
}
return true;
}
5. 评论区大佬方案(操作第二个数组)👍
遍历第一个数组,在第二个数组找到就删除第二个数组中对应的元素,没有找到直接不等,最后再判断一下第二个数组的长度即可。实际使用中一般不直接操作原数组,浅复制一下就好
可能没有前几个性能好,但是想法还是很好的点赞~
function areArraysContentEqual2(arr1=[], arr2=[]) {
arr2 = [...arr2]
if (arr1.length !== arr2.length) {
return false;
}
arr1.some(item => {
// 找到元素在第二个数组中的位置
const index = arr2.findIndex(item1 => {
// 这里有坑 下面会讲到
if (isNaN(item) && isNaN(item1)) {
return true
}
return item ===item1
})
if (index !== -1 ) {
arr2.splice(index, 1)
}
})
return !arr2.length
}
NaN 判断的时候,会有隐式转换(参数不是数字时会隐式转换)
Number.isNaN 判断才是严格相等
isNaN('11') // false
isNaN('ccc') // true
isNaN('a') // true
isNaN(NaN) // true
Number.isNaN('11') // false
Number.isNaN('ccc') // false
Number.isNaN('a') // false
Number.isNaN(NaN) // true
第五点(NaN判断问题修复)—2023.10.20 发现bug并修正 😢😢
function areArraysContentEqual(arr1=[], arr2=[]) {
arr2 = [...arr2]
if (arr1.length !== arr2.length) {
return false;
}
const compare = (item1, item2) => {
if (Number.isNaN(item1) && Number.isNaN(item2)) {
return true;
}
return item1 === item2;
};
arr1.some(item => {
// 找到元素在第二个数组中的位置
const index = arr2.findIndex(item1 => compare(item, item1))
if (index !== -1 ) {
arr2.splice(index, 1)
}
})
return !arr2.length
}
注意事项
判断
回到题目,如果你真想检验一个人的水平。第一步先考察一下基本的编程基础,问几个基本的编程问题,可以和前端相关也可以无关。比如垃圾收集大致是怎么做的,setTimeout 大致做了什么(说会在另一个线程里执行回调的直接毙掉)。
第二步考察一下知识面,问问http、tcp的基本知识,dns是怎么工作的,或者常用框架的实现原理,看看候选人是不是除了自己的一亩三分地什么都不关心。
第三步考察hold业务逻辑的能力,从一个简单的注册页,或者查询页开始,先让说下代码的基本架构,然后需求、性能、可靠性、安全层层加码,看看能不能很快的反馈出解决方案。能对答如流的要么做过,要么对他来说这种复杂度的东西是小case。
前三步都没问题,基本上说明候选人已经还行了,但是行到什么程度,不知道。如果想找比较厉害的,就增加个第四步,亮点项目考察。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
总的来说,面试官要是考察思路就会从你实际做过的项目入手,考察你实际编码能力,就会让你在电脑敲代码,看你用什么编辑器、插件、编码习惯等。所以我们在回答面试官问题时,有一个清晰的逻辑思路,清楚知道自己在和面试官说项目说技术时的话就好了,我整理一套前端面试题分享给大家,希望对即将去面试的小伙伴们有帮助!
最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**
总的来说,面试官要是考察思路就会从你实际做过的项目入手,考察你实际编码能力,就会让你在电脑敲代码,看你用什么编辑器、插件、编码习惯等。所以我们在回答面试官问题时,有一个清晰的逻辑思路,清楚知道自己在和面试官说项目说技术时的话就好了,我整理一套前端面试题分享给大家,希望对即将去面试的小伙伴们有帮助!
[外链图片转存中…(img-iKIu49NC-1715722462560)]
[外链图片转存中…(img-Y8ASNAqK-1715722462561)]