专业技能
一般来说,面试官会根据你的简历内容去提问,但是技术基础还有需要自己去准备分类,形成自己的知识体系的。简单列一下我自己遇到的一些题
- HTML+CSS
- JavaScript
- 前端框架
- 前端性能优化
- 前端监控
- 模块化+项目构建
- 代码管理
- 信息安全
- 网络协议
- 浏览器
- 算法与数据结构
- 团队管理
- 开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
最近得空把之前遇到的面试题做了一个整理,包括我本人自己去面试遇到的,还有其他人员去面试遇到的,还有网上刷到的,我都统一的整理了一下,希望对大家有用。
其中包含HTML、CSS、JavaScript、服务端与网络、Vue、浏览器等等
由于文章篇幅有限,仅展示部分内容
var arr=[1,2,3,4]
console.log(arr.join());
// 1,2,3,4
console.log(arr.join(':'));
// 1:2:3:4
实现重复字符串
function repetStr(str,n){
return new Array(n+1).join(str)
}
console.log(repetStr('嗨',5));
-
push方法数组尾部添加元素,返回数组的长度
arr.push(element1, …, elementN)
//可以传递多个参数 -
var arr=[]
console.log(arr.push('a'));
//1
console.log(arr);
//a
- pop删除最后一个元素,返回值为删除的那个最后元素
var arr=[1,2,3]
console.log(arr.pop());//3
console.log(arr);//[1,2]
-
unshift 在头部添加元素,返回值为数组长度
- arr.unshift (element1, …, elementN)
- 可以在头部添加多个元素
var arr=[1,2,3]
console.log(arr.unshift('0'));
console.log(arr);
- shift删除第一个元素,返回删除的第一个元素
var arr=[1,2,3,4]
console.log(arr.shift());//1
console.log(arr);//[2,3,4]
-
splice数组的增删改,第一个参数为开始位置,第二个参数为操作的个数,第三个参数是替换删除的数据
- 方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
- start指定修改的位置(从0开始计数)。如果这个值超出了数组的长度,则丛数组尾部添加内容;如果是负值,则表示从数组末位开始的第几位(从-1计数,这意味着-n是倒数第n个元素并且等价于arr.length-n)
如果负数的绝对值大于数组的长度,则表示开始从0位置 - deleteCount 整数,表示要移除数组元素的个数。如果deleteCount大于start之后元素的总数,则从start后面的元素将被删除,包含start元素。如果deleteCount被省略了,或者它的值大于等于start之后的值的总数,则start之后的元素都会被删除。如果为0或者负数的时候,则不移除元素,这种情况下,至少可以添加一个元素
- item1,item2 要添加进数组的元素,从start开始。如果不指定,则splcie只删除数组元素
- 返回值是删除的元素,如果没有删除,则返回空数组
var arr=[1,2,3,4]
// 从索引为0开始删除所有
console.log(arr.splice(0));
console.log(arr);
var arr1=[1,2,3,4]
// 从2的位置删除0个插入5
console.log(arr1.splice(2,0,5));
console.log(arr1);
-
reserve 颠倒数组的位置
- 返回值是颠倒后的数组
- 会改变原数组
var arr=[5,4,3,2,1]
console.log(arr.reverse());
console.log(arr);
-
sort()排序 括号内传函数,有连个参数比如说a,b
- 函数返回值为a-b 则为升序 从小到大
- 函数返回值为b-a 则为降序 从大到小
var arr=[1,54,2,16,22,8]
console.log(arr.sort(function(a,b){return a-b}));//升序
var arr1=[1,54,2,16,22,8]
console.log(arr1.sort(function(a,b){return b-a}));//降序
以上都是修改原数组的方法
- includes():第一个参数为检索的目标,第二个参数为检索的起始位置。返回值是布尔值
var arr=[1,2,3,4,5]
console.log(arr.includes(2,0));//true
console.log(arr.includes(12,0));//false
-
indexOf: 方法返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。
- 第一个参数检索的目标,第二个参数是检索的开始位置,如果检索到,返回值为为检索的第一个匹配元素的索引,没有检索到返回值为-1
- 第二个参数,如果大于整个数组的长度,说明不会从数组中查找,返回-1,如果提索引值是一个负数,则从数组尾部开始查找,-1表示倒数第一个元素,以此类推,如果负值抵消数组小于0,则表示0,从整个数组开始查找
- 从前往后查
var arr=[1,2,3,4,5]
console.log(arr.indexOf(5,2));
console.log(arr.indexOf(15,2));
console.log(arr.indexOf(5,-1));
console.log(arr.indexOf(2,-15));
-
lastIndexOf: 方法返回指定元素(也即有效的 JavaScript 值或变量)在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找,从
fromIndex
处开始。- 从后往前查找
- 如果为负数,从后面的位置开始查找,比如果-1,代表最后一个元素
var arr=[1,2,3,4,2,3]
console.log(arr.lastIndexOf(2,0));//-1
console.log(arr.lastIndexOf(2,6));//4
console.log(arr.lastIndexOf(2,-1));//4
-
slice方法 方法返回一个新的数组对象,这一对象是一个由
begin
和end
决定的原数组的浅拷贝(包括begin
,不包括end
)。原始数组不会被改变。- arr.slice([begin[, end]])
- begin 表示提取元素开始位置,从0开始。如果为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2)代表原数组中的倒数第二个元素到最后一个。如果省略begin,则默认为slice(0)提取元素,如果begin超出数组的索引范围,则会返回空数组
- end 和begin结合提取二者之间的数据,如果为负数slice(-2,-1)则提取倒数第二个元素,如果end大于整个数组的长度,则表示提取到最后,end被省略也会提取到最后
- 一个含有被提取元素的新数组。
var arr=[1,2,3,4,5,6,7]
console.log(arr.slice(-2));
//[6,7]
console.log(arr.slice(0));
//[1,2,3,4,5,6,7]
console.log(arr.slice(-2,-1));
//[6]
console.log(arr.slice(1,9));
//[2,3,4,5,6,7]
-
concat 方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
- var new_array = old_array.concat(value1[, value2[, …[, valueN]]])
- 返回的是原数组和另一个数组结合的浅拷贝
- 不会改变原数组
var arr1=[0,1,2,3]
var arr2=[12,11,10,13]
var arr3=['dsd','dada','ddd']
console.log(arr1.concat(arr2));
console.log(arr1.concat(arr2,arr3));
var arr4=[[1]]
var arr5=[2,[3]]
console.log(arr4.concat(arr5));
- toString方法 返回一个字符串,表示指定的数组及其元素。
var arr=['hello','vue','react']
console.log(arr.toString());
//hello,vue,react
- join 把数组转为字符串
var arr=['h','e','l','l','o']
console.log(arr.join());
console.log(arr.join(''));
console.log(arr.join(' '));
console.log(arr.join('-'));
h,e,l,l,o
hello
h e l l o
h-e-l-l-o
以上是不改变原数组的方法
遍历数组方法
总结:
-
函数式编程其实是一种编程思想,它追求更细的粒度,将应用拆分成一组组极小的单元函数,组合调用操作数据流;
-
它提倡着 纯函数 / 函数复合 / 数据不可变, 谨慎对待函数内的 状态共享 / 依赖外部 / 副作用;
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
Tips:
其实我们很难也不需要在面试过程中去完美地阐述出整套思想,这里也只是浅尝辄止,一些个人理解而已。博主也是初级小菜鸟,停留在表面而已,只求对大家能有所帮助,轻喷🤣;
我个人觉得: 这些编程范式之间,其实并不矛盾,各有各的 优劣势。
理解和学习它们的理念与优势,合理地 设计融合,将优秀的软件编程思想用于提升我们应用;
所有设计思想,最终的目标一定是使我们的应用更加 解耦颗粒化、易拓展、易测试、高复用,开发更为高效和安全;