前端学习总结

前端常见面试问题

最近发现了一个up主“Alice铛铛铛”，学习到了很多面试技巧，下面分享一下
一、
1.vueAPP适配是怎么写的，用的什么单位？
2.get和post有什么区别？
3.计算属性和监听器有什么区别？
4.v-for渲染列表是key是用来做什么的？
5.数据请求在生命周期哪一个阶段？
6.水平居中有哪几种方法？
7.flex弹性盒模型？
8.父盒子中子盒子浮动有什么后果？
9.清除浮动有哪些方法？
10.定位有哪些属性？相对定位是相对什么定位？
11.行没元素和行内块元素有什么区别？行内块元素在同一行显示时有默认空隙，如何解决？
12.给DOM元素绑定事件有哪些方法？
13.数组里面有哪些遍历方法？es6
二、
1.js中的闭包指什么？
2.v-if和v-show的区别是什么？分别的使用场景。
3.v-for中 key值的作用？
4.vue中插槽的作用？
5.js的执行机制
三、
1,原生js继承怎么实现
2,es6里面有什么类和方法
3,vue相关的问题
4,jquery和vue的区别
5,vue中父子组件和兄弟组件怎么传的
6,vuex和axios和使用
7,es6里const let var 区别
8,js里的垃圾回收机制
9,使用js怎么调bug
四、
问题：
1.h5新增的标签有哪些，为什么要加强语义化？
2.为什么要清除浮动，怎么清除浮动？
3.行内元素，块元素有哪些？它们有什么不同？
4.现在有哪几种存储数据的方式，它们分别有什么不同？
5.程序题for（i=0;i10;i++){setTimeout(function(){console.log(i)},10)}
6.vue实现双向绑定的原理是什么
7.Vue之间组件是怎么传值的
8.让两个组件实现按点击次序执行请求
9.怎么实现文本不自动换行，超出文本的部分变成省略号
10.vue的生命周期有哪些，分别有什么不同
11跨域的原理有哪些，jsonp的原理是什么？
答案：
1.html5增加了mainheaderfooterasidesectionvideoaudiotimedata之类的语义化标签, 搜索引擎会利用爬虫分析抓取页面结构内容，有利于SEO，页面结构更加清晰，利于维护.提高页面可访问性，不会在样式加载不正常的时候一团乱，维持基本结构。利于部分残障人士页面阅读器解析
2.浮动脱离了正常文档流,会导致父元素高度塌陷，后面元素会挤到浮动元素下方，造成布局错乱。清除浮动:1.父元素创建BFC，使其处于单独的块级渲染区域 overflow不为visible,float不为none,display值为flex grid inline-box table, position为absolute或fixed都可以创建。2.父元素的伪元素::after display:block,heght:0,visbility:hidden,clear:both,content:.
3.行元素无法设置宽高,行排布,不够换行 a b span img input button label, 块元素独占一行,可以设置宽高 p div ul ol form table , 还有空元素:link br hr等
4.cookie sessionStorage localStorage indexDb,cookie按设定的时间内有效，最多4k, 两个storage都是html5新api,存储键值对,sessionStorage会话存储,页面访问时间内有效，关闭页面失效,localStorage一直有效，关闭页面不会失效，两个都是最大5M，indexdb也是h5新api，浏览器内置小型数据库。
5.考变量提升和作用域,i先增加到了10,setTimeout为宏任务,10ms后宏任务里陆续增加了10个function(){log(i)}回调,10次事件循环每次把一个宏任务取到栈里,执行打印i, 10次10
6.Vue双向绑定 vm视图模型简单来说就是利用了Object.defineProperty(),通过劫持setter,实现model到view，view到model则是一堆事件监听 输入框的input,选择组件的 change等等。具体复杂些的实现就要看观察订阅设计模式了
7.父-子:props, 子-父: 子:emit,父 on,兄弟之间: 利用一个事件中央总线bus
8.可能是: 全局一个promise实例,不同按钮点击:在实例then后返回新的不同promise连接到全局promise,应该可以保证顺序吧。。
９.white-space:nowrap; overflow:hidden;text-overflow:ellipsis;
10.简单说:几个钩子函数created,mounted,updated,destroyed 再加上四个before，created时data绑定，el不可见。beforemount调用render,实例添加$el替换el后调用mounted,数据更新触发视图渲染则调用两个update,销毁实例之前调用beforedestroy。
11.跨域浏览器安全策略造成，非同协议，源，端口　皆为跨域，为了避免csrf跨域请求伪造，请求会被浏览器拦截。
实现跨域请求:jsonp ,后端设置CORS, 各种代理 像nginx,node中间件。跨域访问dom:Window.postMessage, document.domain,iframe
jsonp原理:利用script不受同源政策限制,将请求模拟成script标签请求,写入callback回调函数，后台将结果用callback包装返回，回调函数即可得到数据，，不过jsonp只支持get请求
五、
1,讲一下es6有哪些新特性
2,css3中的anvas绘画，node.js webpack是否有了解
3,html第一行！doctype是做上面用的
4,css动画特性可以用js实现，网上还要用css实现
5,ajax请求数据重新处理和拦截器
6,boorstarp中栏珊的24个是怎么做到的
7,轮播图怎么考虑实现的
8,git的常用操作
9,除了视频网站学习还会怎么学习
10,简单说下get和post的区别
11,h5的新特性，和css3的新特性
12,seo的搜索引擎优化
13,const定义对象能否改变
14,let和var在全局定义的时候有上面区别
15,js的三大事件
六、
1,闭包是什么，有什么优点和缺点
2,怎么让子盒子上下居中
3,js的本地的储存有哪些
4,cookie和session了解吗
5,跨域怎么做
6,this的指向问题
7,vue项目中用什么UI框架
8,npm中warn了解吗
9,node.js了解吗
10,详细说下做的项目
七、
1、学过哪些基础框架
2、vue的源码看过吗？怎么实现数据劫持
3、vue双向数据绑定
4、vue的生命周期
5、分别在什么时候使用created，mounted
6、用过es6，es7吗？列举常用的。
7、promise async await用过吗
8、箭头函数和一般函数有什么区别
9、有没有了解过后端的语言
10、jQuery中绑定事件用的on和bind有什么区别
11、前端常用的性能优化有哪些方法
12 闭包是什么？举例说明
13 vue中的组件data为什么是函数
八、
7/13（海康）
闭包是什么？有什么优点和缺点？
怎么让盒子上下居中？//定位和弹性盒子
Js的本地储存方式有哪些？（自己补充下大概怎么用）
cookie中的session了解吗？
跨域怎么实现？//1.jsonp 2.代理 3.php header写允许跨域
This的指向问题（过谁调用function(),就指向谁。而Vue中一般指向的是this所在的组件Vue实例本身）
怎么改变this的指向？//1.箭头函数 2.that 3.apply,call,bind 4.new
vue项目中用了什么UI框架？//up主用的是animate.css,个人推荐饿了么
Npm 中的warn了解吗？（面试官估计被实习生坑过）
Node.js了解吗？
详细描述一个自己的项目。（码字君：主要是面向信息处理类的，别搞那么花里胡哨。简历随便别处偷几张好看的图应付HR，github里面放段文字跟技术面试官说明就好）
“up主题外话，关于华为素质面试的，大厂关注的是抗压力(不想压力大的请转行)，学习能力（潜力），还有一些特长（相信大家都不是天才，给Hr画饼就好了）”
7/19
H5标签有哪些？
Css中的定位？//浮动，定位，弹性盒子
es6有哪些新特性，let var const的区别。
什么是闭包？
Vue的生命周期？（可以自己跟面试官补充常见的钩子函数的操作，增加good Image）
Vue中this从哪里可以开始调用？
Js的基本数据类型，别忘了es6新增的symbol
怎么判断数据类型，typeOf引用类型，instanceOf引用类型
（算法，高概率多准备）给数组去重//只回答了一个

7/18
学过哪些基础框架？
（糊弄下）有没看过Vue的源码？怎么实现数据劫持？
“绑定和传值的原理”
Vue的生命周期？什么情况使用created,mounted
Es6特性(自己补充下ES6的一些常识和基础操作)
Promise async await用过吗
箭头函数和一般函数有什么区别？（自己补充下箭头函数的一些常识）
有没了解过后端语言（大概讲讲对node和php的涉猎）
Jquery中绑定事件用的on和bind有什么区别？//面试官，on绑定父级会冒泡，bind绑定自己不会冒泡
前端常用的性能优化有哪些？
打开页面，速度比较慢，该怎么做
闭包是什么？举例说明
（每次介绍面试官都会让你问他问题，砸一些准备好的高技术难题给他，让他对你印象深刻嘻嘻）
[other：
vue中的组件的data为什么是函数
Vue-cli是如何使用json数据模拟
]
6/16 (网易电话面试)
闭包是什么？（破厂都喜欢问这问题）
Js的执行机制是什么？
Vue v-for中key的作用？
V-if和v-show的区别？
Vue中插槽有什么作用？
（up主不是211就是985，不然不会那么多次大厂会有电话）
7/12
Es6有哪些新特性
Css3中的canvas绘图，node.js,webpack是否了解过？（没时间的学最好百度下涉猎个大概，这问题最好回答下一点点）
html第一行!doctype是作什么用的？（上面的那个问题，up主一点都没回答，根据头几个问题，面试官已经把她分类到菜鸡小萌新的级别，接下来面试官要做的只是看她符不符合最低要求，和有什么亮点）
css动画特性可以用js实现，为什么还要用css实现？
Ajax请求数据重新处理和拦截器
boorstrap中栏删的24个是怎么做到的？
轮播图怎么考虑实现？（原生js怎么作的和UI插件。“争取在自己熟知的知识点跟面试官讲多几句，长时间的良性谈话会让面试官产生感觉你挺ok的错误心理。另外吹水能力也超级重要，是吹水不是吹牛”）
Git的常用操作。（自己补充一些关于git的项目好习惯）
除了视频网站还会怎么学习？（主要回答博客和简书，然后大概说诸如电子笔记和请教大佬的学习习惯。最好让整个面试谈话让人感觉饱满，不然三言两语的干巴巴几分钟鬼记得你）
简单说一下get和post的区别
H5的新特性？Css3的新特性？
SEO搜索引擎优化？
const定义对象能否改变？//能！因为定义的对象还是存储在堆当中，const只是存了地址
Let和var在全局定义的时候有什么区别？
Js的三大事件//捕获，冒泡这些事件

7/10 （华为电话面试）（大厂问题比较吊，去小厂的混子不推荐研究）
原生js里继承是怎么实现的？用prototype是怎么实现的
es6里面新增了类和方法
Class和继承。是怎么实现继承的
jquery和Vue使用起来有什么区别？（jquery和Vue主要是开发思想不同。具体的区别最好自己百度）
Vue里面父子组件怎么传值？//用订阅者模式bus
设计模式了解吗？（模式这些大中厂一般都会问，小厂一般不问）
vue中Vuex和Axios的使用
Es6里面const let var 的区别？
闭包是什么？用let怎么实现
Js的垃圾回收机制？
在使用js的时候怎么调bug
九、
8/3（第三次海康，恭喜Up喜提offer！！！）
电话面试
Js的基本数据类型
Js中怎么绑定事件
深拷贝和浅拷贝的区别，怎么实现深拷贝
数组的常用操作方法？Splice和slice的区别
Es6里面的 let var const
事件委托是什么
简要说明get和post的区别
简要说明v-if和v-show的区别
父子组件，兄弟组件之间的传值

现场面试
http请求头content-type？//根据请求头的type类型解码
Es6里面Promise的两个参数分别是什么？//第一个参数表示成功时的回调函数，第二个是失败状态的回调函数
for in和for of的区别？//不会就讲讲自己对它的了解
Vue的computed和watch区别，以及应用场景
Vue生命周期，用过哪些，怎么用的，mounted里面一般放什么?
V-if和v-show区别，项目中的使用
v-for在项目中的使用，key值的作用，对使用效率的影响，没有key会出现什么情况？
《面试官了解你的面试项目情况》项目中的每一个功能详解，要手写代码（后台数据模拟，获取数据），项目难点//项目难点准备用以提问面试官
父子组件传值，兄弟组件传值，Vuex代码怎么写
bootstrap,jquery分别用了哪些，css选择器的优先级，子代/后代
学校竞赛，学习途径，《js高级程序设计》中函数重载，vue使用版本
十、
8/4(宇视)
先笔试在电话面试

笔试：选择题(20道)和填空题，还有算法题(3-5道)

在js的浏览器对象模型当中，windows对象当中什么属性是用来指定用来指定浏览器状态栏里面的临时消息的?//这个是status
两个div采用绝对定位，设置层叠关系，需要设置什么：z-index
《eval函数，它可不可以解释由JS原码组成的字符串呢？//可以的，
然后这个函数能不能用调式工具的断点来调试呢?//是不可以用断点，
这个函数是js自带的函数，使用的话会不会引起安全问题呢？//是会的，它会引起XSS攻击，
还有一个就是这个函数，它会不会有效率问题，该函数是动态解释字符串，会不会存在效率问题？//当时写的是会，效率问题主要还是在自身逻辑上面（建议自行百度）
》
html网页元素加载完后触发哪个事件？//选项有onready onchange onload onblur ？Onready是先于onload执行的，onload是要等所有元素包括img之类的加载完成之后才会执行的，而onready是只要DOM结构绘制完成就能执行。如果有多个onload函数，它只会执行最后一个函数，而onready是有多少个执行多少个。

addEventListener可不可以多次给DOM对象添加监听事件？//是可以的。（简述：一个监听对象一般只会有一个监听事件，多余的会移除掉）

attachEvent可以删除DOM对象的监听事件吗？//是不可以的，这是用来监听的，如果要删除的话，用removeEvent。

New Date（）可以获取的是哪里的时间？是PC本地的时间

Form标签之间可以出现p、u等非表单域元素吗？//是可以的，form可以包含包括input,文本，单选，复选，textarea等

在JS里，两个整数进行除法，得到的数是整数还是小数？//是小数,要得到整数则用parseInt和Math.round等等。

属性document.body.scrollWidth,表示的是网页中滚动条的宽度吗？不是的，它表示的是网页正文全文的宽度。

offsetsetWidth clientWidth分别代表可见区域的宽度，还有高度等。//up主表示这些最好去查一下，这个特别多
http常见状态码有哪几种，写至少五种？
JS或DOM操作的时候，浏览器兼容的注意事项有哪些？
Web开发，常见的安全性漏洞有哪些，写三个？
冒泡排序怎么写？
深拷贝的代码怎么写？