前端常见小公司面试题

js

昨天刚一个上海的公司给我打电话面试，问了我一堆基础的东西，例如:position、数组、es6语法、响应式布局，div盒子，js，jquery，bootstrap等等让我讲一讲这些怎么理解的…
absolute : 将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位。而其层叠通过css z-index属性定义。此时对象不具有边距，但仍有补白和边框
relative : 对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置
相对定位就是，在相对于他原来的位置上开始移动，但是原来的位置还是在那里，他还是占据着位置，虽然他已经不在刚开始的位置上了，相当于，占着茅坑不拉shi
当时问了我，两个div，怎么让一个小的div位于大div的垂直居中的位置
绝对定位是在浏览器的左上角开始移动，他是不会占据刚开始的位置

大概就是这个样子，实现的方法有很多，但是基本上都要需要先给大div设置一个相对定位，下面都是id是container的div是大盒子,small是小盒子哦。下面我就不说了。

1. 第一种

#container {
				position: relative;
			}
#small {
				/* 绝对定位 */
				position: absolute;
				   /*第一种方法
					 top: 50%;
				     left: 50%;
					 margin-left: -50px;
					 margin-top: -50px; */
	 /* 需要达到子元素高度宽度一半的负值，缺点就是需要知道子元素的高度和宽度 */
					 }

2.第二种
还是一样的给父元素设置相对定位，给子元素设置上下左右为0，再通过margin控制居中

#container {
				position: relative;
			}
#small {
position: absolute;
	top: 0;
    left: 0;
	right: 0;
	bottom: 0;
    margin: auto;
    
			  }

1. 第三种
   通过css3给的属性transform设置平移50%来达到效果

#container {
				position: relative;
			}
#small {
position: absolute;
	 /* 这是第三种
			 top: 50%;
			 left: 50%;
			 平移50%
			 transform: translate(-50%, -50%); */
    
			  }

1. 第四种
   只需要给父元素设置display为弹性布局，通过弹性布局的属性来改变位置，这一种是很简单，当然还有其他的方式，这只是我懂得几种。

#container {
				
				/* 第四种方式，只需要设置这三个，其他的都不需要设置
					display: flex;
				    justify-content: center;
				    align-items: center; */
				
			}

关于this的指向问题

大家可以自行百度
这是我知道的可以解决指向问题的（all/apply/bind解决this指向问题）
箭头函数的this指向window，在 es6 中，箭头函数 this 指向的对象在出世的那一刻，就已经能确定下来了。即：指向他所处对象所在的作用域

这一个就很容易了

vue的生命周期和数据双向绑定

生命周期可以看官网哦，很清楚。
双向绑定v-model，在通过vue的双向绑定给这个input框绑定一个变量
记得在data里面声明这个变量

微信小程序

1. 关于微信小程序的生命周期？

• onLaunch: 初始化小程序时触发，全局只触发一次
• onShow: 小程序初始化完成或用户从后台切换到前台显示时触发
• onHide: 用户从前台切换到后台隐藏时触发
• onError: 小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
  后台： 点击左上角关闭，或者按了设备 Home 键离开微信，并没有直接销毁，而是进入后台
  前台：再次进入微信或再次打开小程序，相当于从后台进入前台。

1. 微信小程序的this.setdata()跟vue的双向绑定一样
2. 移动端组件：微信小程序官网的组件也是很丰富的，可以直接使用，我推荐这个vant可以进去看看 vant官网