腾讯2020前端开发暑假实习第一次面试

一、投递信息

1. 投递时间：2020年3月4日
2. 岗位：Web前端开发方向—暑期实习生
3. 工作地点：深圳
4. 面试时间：2020年3月14日
5. 面试方式：视频面试
6. 面试时长：约60分钟
7. 面试平台：牛客网
8. 面试官姓黄，是位女生

二、面试官问题

问答题

首先进行了一下自我介绍，然后问读研结束了是准备参加工作还是准备继续赌博？
然后问答题主要是分为了两个方面（css跟js）

1. position属性？
   我的回答：常见的有四种方式：①static无定位 ②relative相对定位 ③absolute绝对定位 ④fixed绝对定位
   追问：上述四种方式分别基于什么定位，定位方式？
   我的回答：fixed是基于浏览器窗口进行定位，relative相对于其正常位置进行定位，absolute基于第一个父元素进行定位。
   追问：relative基于的正常位置是指什么元素？
   我的回答：body

   补充知识：
   相关链接
   absolute：生成绝对定位的元素，定位原点是离自己这一级元素最近的一级position设置为absolute或者relative的父元素的左上角为原点的。
   fixed （老IE不支持）：生成绝对定位的元素，相对于浏览器窗口进行定位。
   relative：生成相对定位的元素，定位原点是元素本身所在位置。
   static：默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right z-index 声明）。
   inherit：规定从父元素继承 position 属性的值。

2. 脱离文档流的方式有哪些？
   我的回答：relative、fixed

   补充知识：
   相关链接
   使用float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置，环绕在该元素的周围。

3. display属性？
   我的回答：①inline作为内联显示 ②block作为块级显示 ③inline-block作为行内块显示 ④none不显示
   追问：display属性除了刚刚说的这四个还有吗？
   我的回答：不是很清楚了，常见的是这四个，其他的了解较少

   display补充知识：
   相关链接

4. CSS3常见的属性和值
   我的回答：字体、背景图片
   追问：想一下在小程序的编写过程中，用到过的，还有哪些？（见我在想，面试官给的提示：动画这一块的话）
   我的回答：transform、translate、animation
   追问：还有吗？
   我的回答：不太记得了
   补充知识：
   相关链接

5. H5移动端适配问题
   我的回答：我没有做过移动端的东西，主要在实验室的项目是涉及的是oa系统和小程序的开发。
   追问：PC端屏幕自适应问题
   我的回答：使用百分比

   上述的问题其实是同一个解决方式
   相关链接
   主要方式：
   1、使用meta标签：viewport
   2、使用css3单位rem
   3、使用媒体查询
   4、使用百分比

6. var、let、const的区别？
   我的回答：let和const主要是可以形成块级作用域，但是var不可以；var可以挂在window、进行变量提升、声明同名变量，但是两外两个不可以；
   追问：const是否可以修改？
   我的回答：不可以
   追问：定义对象的时候也是不可以修改的吗？
   我的回答：…不太清楚，了解的不多，之后再去深入了解一下。

   补充知识：
   相关链接
   const定义的基本类型不能改变，但是定义的对象是可以通过修改对象属性等方法来改变的。

7. 箭头函数与普通函数的区别
   我的回答：作为我自己使用的箭头函数来说，我觉得更便捷，语法更简单，，而且可以同时传入三个数据，即当前数组元素，下标值、原数组。他们之前的区别就是：①箭头函数是匿名函数，不能作为构造函数，不能使用new。 ②箭头函数不能绑定arguments，取而代之用rest参数…解决。 ③箭头函数没有原型属性。 ④箭头函数的this永远指向其上下文的this，没有办改变其指向，普通函数的this指向调用它的对象。 ⑤箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值。

8. this关键字
   ①函数调用的话，this指向window。 ②方法调用的话，this指向的是其方法的对象。 ③构造函数调用的话，this指向的是new创建的对象。 ④call、apply调用的话，this就是调用时指定的对象。 ⑤事件函数响应调用的话，this就是谁给它绑定的就是指向谁。

9. 闭包的定义？
   我的回答：我对闭包的理解就是函数中的函数，即内部函数可以读取外部函数中的变量。
   追问：其应用场景有？
   我的回答：一般用于定时器。
   追问：还有吗？
   我的回答：…不记得了。

   补充知识：
   相关链接
   应用：
   1.setTimeout
   2.回调
   3.函数防抖
   4.封装私有变量

10. vue父子通信的方式？
    我的回答：父传子通过prop，子传父通过$emit()函数
    追问：兄弟组件通信呢？
    我的回答：通过父组件做中转，或者使用中央事件总线，新建一个js文件作为中转。

11. vue双向绑定的原理
    我的回答：vue的双向绑定主要时通过Object.defineProperty()来进行数据劫持及发布者-订阅者模式来实现的。

在线笔试

直接上题目跟代码吧，过程中有些小问题。我是先做的第二题，再做的第一题。比如第一题的split()分割的时候，忘记写分割的条件；第二题，没有看到已经给了一个ul节点，我还自己去创建ul节点，然后循环创建li节点，而且由于写的时候太紧张，忘记给li绑定单击响应函数，在面试官提醒的时候，还说你不打算做第一题吗？结果一紧张，忘记加在哪里了，就先做了第一题，做完自己再检查第二题时加进去的。

• 题目1：写一个JavaScript函数实现两个超出最大整数范围的两个数字字符串的求和。
  比如：
  参数传入：‘11111111111111111’, ‘22222222222222222’
  返回：‘33333333333333333’

  function add(a, b) {
         
     var res = '',
        temp = 0;
      a = a.split('');
      b = b.split('');
  	console.log(a)
  	console.log(b)
      while (a.length || b.length || temp) {
         
        temp += ~~a.pop() + ~~b.pop();
        res = (temp % 10) + res;
        temp = temp > 9;
      }
      return res.replace(/^0+/, '');
    }
  console.log(add('11111111111111111','2222222222222222222'))
  

• 页面有一个ul，要在ul中插入1000个li，每个li的内容是它当前的序号，点击li会打印出当前li的序号。

  // 获取ul节点
  var oul = document.getElementById('ul')
  //循环创建1000个li节点，并添加为ul的子节点
  for(var i=0;i<1000;i++){
         
  	// new一个数组用来显示每个li中的内容
  	var text=new Array();
  	text[i]= i;
  	var oli=document.createElement("li");
  	var liText=document.createTextNode(text[i]);
  	oli.appendChild(liText);
  	oul.appendChild(oli);
  }
  // 添加事件点击函数
  var tag = document.getElementsByTagName('li');
  for(let i=0;i<1000;i++){
         
  	tag[i].onclick = function(){
         
  		alert(++i);
  	}
  }