作者:牛客146475945号
链接:www.nowcoder.com/discuss/612…
来源:牛客网
腾讯前端实习一面【29min】
1. 有做过前端的项目吗?
2. 为什么从咨询转前端?
3. 如何学前端的?
4. 做项目时遇到什么问题,怎么解决的?
5. 什么是闭包?
Javascript里变量的作用域分为全局变量和局部变量。函数内部可以直接读取全局变量,但在函数外部无法读取函数内的局部变量。解决办法是在函数的内部,再定义一个函数,也就是子函数返回父函数中的局部变量。
闭包就是能够读取其他函数内部变量的函数,是将函数内部和函数外部连接起来的一座桥梁。
6. 闭包有什么缺点?
- 由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题。
- 闭包会在父函数外部,改变父函数内部变量的值。
7.闭包有什么用处?
最大用处有两个,一个是可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。 经典案例:防抖和节流。
8. 原型链?
每个实例对象( object )都有一个私有属性(称之为 proto )指向它的构造函数的原型对象(prototype )。该原型对象也有一个自己的原型对象( proto ) ,层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节。
几乎所有 JavaScript 中的对象都是位于原型链顶端的 Object 的实例。
JavaScript 对象是动态的属性“包”(指其自己的属性)。JavaScript 对象有一个指向一个原型对象的链。当试图访问一个对象的属性时,它不仅仅在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,直到找到一个名字匹配的属性或到达原型链的末尾。
9.执行上下文?
- 全局执行上下文:只有一个,浏览器中的全局对象就是 window 对象,this 指向这个全局对象。
- 函数执行上下文:存在无数个,只有在函数被调用的时候才会被创建,每次调用函数都会创建一个新的执行上下文。
运行JS代码时,会创建一个全局执行上下文并Push到当前的执行栈中。每当发生函数调用,引擎都会为该函数创建一个新的函数执行上下文并Push到当前执行栈的栈顶。
根据执行栈LIFO规则,当栈顶函数运行完成后,其对应的函数执行上下文将会从执行栈中Pop出,上下文控制权将移到当前执行栈的下一个执行上下文。
执行上下文的创建 执行上下文分两个阶段创建:1)创建阶段; 2)执行阶段
创建阶段
1、确定 this 的值,也被称为 This Binding。
2、LexicalEnvironment(词法环境) 组件被创建。
3、VariableEnvironment(变量环境) 组件被创建。
执行阶段
10. 如何改变this指针?
通过 call(),bind(), apply(), 能够使用属于另一个对象的方法。
bind 返回的是一个新的函数,必须调用它才会被执行。(后面要加个括号) call 和 apply 返回的是值。
bind 和 call, 以 ,分隔的方式传参。apply必须以数组方式传参。
11. 深浅拷贝?
function deepCopy(p, c) {
var c = c || {};
for (var i in p) {
if (typeof p[i] === 'object') {
c[i] = (p[i].constructor === Array) ? [] : {};
deepCopy(p[i], c[i]);
} else {
c[i] = p[i];
}
}
return c;
}
var Doctor = deepCopy(Chinese);
12.事件委托和事件冒泡?
事件冒泡:JS中当出发某些具有冒泡性质的事件是,首先在触发元素寻找是否有相应的注册事件,如果没有再继续向上级父元素寻找是否有相应的注册事件作出相应,这就是事件冒泡。
事件委托:利用事件冒泡的特性,将本应该注册在子元素上的处理事件注册在父元素上,这样点击子元素时发现其本身没有相应事件就到父元素上寻找作出相应。这样做的优势有:1.减少DOM操作,提高性能。2.随时可以添加子元素,添加的子元素会自动有相应的处理事件。
13.position的值?
子元素的绝对定位是相对于最近的position为absolute/relative/fixed的祖先元素,找不到时就相对于初始块(initial containing block)定位。 absolute fixed static relative inherit
14.引用css的方法?
<head><link rel="stylesheet" type="text/css" href="style.css"></head><style> @import url(style.css);</style>- 单文件:内联+嵌入
link和import的区别
-
link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;而@import属于CSS范畴,只能加载CSS;
-
link引用CSS时,在页面载入时同时加载;而@import需要页面网页完全载入以后加载。
-
link是XHTML标签,无兼容问题;而@import是在CSS2.1提出的,低版本的浏览器不支持。
-
link支持使用Javascript控制DOM去改变样式;而@import不支持。
-
@import可以在CSS文件中再次引入其他样式表;而link不支持。
15、为什么js放在html的最末端?
-
JavaScript执行确实会阻塞HTML的解析渲染, 若是以嵌入的方式引入JavaScript, 不管script标签是放在head标签中或是body标签尾部, 页面都会由于JavaScript的执行而持续白屏;
-
而在引入外部js文件的情况, 由于Network线程下载外部js文件仅阻塞HTML的解析而不会阻塞HTML的渲染, script标签置于body标签尾部可以避免由于js文件下载时间太长导致的页面持续白屏!
16、MVVM设计模式?
是指软件的三种架构。
数据驱动视图
17、生命周期?
JS的页面生命周期事件
- DOMContentLoaded, 浏览器完成HTML的加载, 并构建DOM树, 图片和样式等外部资源还没加载完成。
- load, 浏览器加载完所有资源, 包括HTML文档, 图片, 样式等。
- beforeunload, 用户即将离开, 用来检查用户是否保存了修改, 并询问是否真的要离开。
- unload, 用户几乎已经离开, 但是可以启动一些操作, 比如发送统计数据。
18、了解过webpack吗?
gulp 是 task runner,Webpack 是 module bundler。
19、性能优化?
20、知道哪些状态码?
21、代码题:
给定数据: [1,2,3,2,1,1,1,1] 编写函数getRepeatElements获取其中的重复元素,[1,2]