前端面试 -- 第二场

今天去那家总体难度不大，不过技术栈不太合适，不知道会不会要我

删除数组的第二个元素（知道splice但参数记不得了。。。。。）

splice（index, howmany, item1, item2…）；
splice 会改变原始数组，返回被删除的数组，如果未删除元素则返回空数组

index	必需。规定从何处添加/删除元素。该参数是开始插入和（或）删除的数组元素的下标，必须是数字。
howmany	必需。规定应该删除多少元素。必须是数字，但可以是 “0”。如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
item1	可选。要添加到数组的新元素

//移除第三个元素,并且在数组第三个位置添加两个新元素
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2 ,1 , "Lemon", "lili");
//输出结果为Banana,Orange,Lemon,Kiwi,Mango

shift删除第一个元素，unshift添加第一个元素（说反了。。。。）

shift返回删除的元素值，如果数组为空则返回undefined

动态创建一个十行十列的表格，要求第一行为checkbox,颜色随机

function createTab(){
	var tableBox = document.getElementById("table");
	var table = tableBox.getElementsByTagName("table")[0];
	if(table)
	{
		table.parentNode.removeChild(table);
	}
	table = document.createElement("table");
	table.style.width = "500px";
	table.border = 1;
	
	for(var i = 0; i < 10; i++)
	{
		var row = table.insertRow(i);
	
		for(j = 0; j < 10; j++)
		{
			var col = row.insertCell(j);
			col.style.width = "50px";
			col.style.height = "50px";
			var a = Math.floor(Math.random()*(255-0)+0);
			var b = Math.floor(Math.random()*(255-0)+0);
			var c = Math.floor(Math.random()*(255-0)+0);
	
			col.style.backgroundColor = `rgb(${a},${b},${c})`;
	
			if(i == 0)
			{
				var check = document.createElement("input");
				var text = document.createTextNode(i+''+j);
				check.type = "checkbox";
				col.appendChild(check);
				col.appendChild(text);
			}
		}
	}
	
	tableBox.appendChild(table);
}

底层通信的过程

jQuery的Ajax 服务器返回的数据类型dataType

json html script

$.ajax({
	url: '*.php',
	type: 'POST',
	dataType: 'json',
	success: function(data){

	},
	error: function(){
		
	}
})

阻止事件冒泡

js/jQuery event.stopPropagation（）
vue @click.stop = “clickFunction”

页面渲染流程

1. 解析HTML
2. 构建DOM树
3. DOM树与CSS样式进行附着构造呈现树
4. 布局
5. 绘制

rem em px

em 一定需要知道其父元素的字体大小设置，因为“em”就是一个相对值，而且是一个相对于父元素的字体大小值（缩放比率/缩放因子）
rem 是相对于页面根元素，只需要在根元素确定一个参考值即可，其它元素设置rem大小都是以html的字体大小设置为参考值进行一个字体大小缩放

如果页面的宽度超过了640px，那么页面中html的font-size恒为100px，否则，页面中html的font-size的大小为： 100 * (当前页面宽度 / 640)

对于手机屏幕来说，640px的页面宽度是一个安全的最大宽度，保证了移动端页面两边不会留白。注意这里的px是css逻辑像素，与设备的物理像素是有区别的。如iphone 5使用的是Retina视网膜屏幕，使用2px x 2px的 device pixel 代表 1px x 1px 的 css pixel，所以设备像素数为640 x 1136px，而它的CSS逻辑像素数为320 x 568px。

1rem = 100px

session和cookie

（1）Cookie以文本文件格式存储在浏览器中，存储量有限，而session存储在服务端，可以无限量存储多个变量并且比cookie安全

（2）cookie的存储限制了数据量，只允许4KB，而session是无限量的

（3）我们可以轻松访问cookie值但是我们无法轻松访问会话值，因此它更安全

（4）设置cookie时间可以使cookie过期。但是使用session-destory（），我们将会销毁会话。

总结：如果我们需要经常登录一个站点时，最好用cookie来保存信息，要不然每次登陆都特别麻烦，如果对于需要安全性高的站点以及控制数据的能力时需要用会话效果更佳，当然我们也可以结合两者，使网站按照我们的想法进行运行

插件的使用

iScroll Swiper