原生常见面试题@酷酷的小航航

数组去重

使用ES6的Set去重

Set是ES6新增的数据类型，Set 的成员具有唯一性
function distinct(arr) {
  return Array.from(new Set(arr));
}      

使用ES6的Set去重(超级简化版)

[...new Set(arr)]   // [...new Set(需要去重的数组)]

使用splice配合两重for循环去重

function distinct(arr) {
  for(let i = 0; i < arr.length; i++) {
  	for(let j = i + 1; j < arr.length; j++) {
  		if(arr[i] === arr[j]) {
  			arr.splice(j, 1);
  			j--;
  		}
  	}
  }
  return arr;
	}	

使用for循环配合indexOf去重

 function distinct(arr) {
 	let newArr = [];
 	for(let i = 0; i < arr.length; i++) {
 		if(newArr.indexOf(arr[i]) === -1) {
 			newArr.push(arr[i]);
 		}
 	}
 	return newArr;
}

使用for循环配合sort排序去重

function distinct(arr) {
  	arr = arr.sort();
  	let newArr = [];
  	for(let i = 0; i < arr.length; i++) {
  		if(arr[i] !== arr[i-1]) {
      		newArr.push(arr[i]);
  		}
  	}
  	return newArr;
  }

使用for循环配合includes去重

  function distinct(arr) {
  	let newArr = [];
  	for(let i = 0; i < arr.length; i++) {
  		if(!newArr.includes(arr[i])) {
  			newArr.push(arr[i]);
  		}
  	}
  	return newArr;
 }

使用filter配合indexOf去重

function distinct(arr) {
  	return arr.filter((item,index, arr) => arr.indexOf(item) === index);
}

实现一个clone函数

• 实现一个函数clone，可以对JavaScript中的5种主要数据类型（Number、String、Object、Boolean、Function、Array）进行值复制

•  function clone(data){
   let obj;
    switch (typeof data){
            case "undefined":
                  break;
            case "string":
                  obj = data+'';
                  break;
            case "number":
                  obj = data-0;
                  break;
            case "boolean":
                  obj = data;
                  break;
            case "object":
                  break;
  

浏览器如何渲染到页面

1.处理HTML标记并构建DOM树
2.处理CSS标记并构建CSSOM树
3.将DOM与CSSOM合并成一个渲染树
4.根据渲染树来布局，计算每个节点的布局信息
5.将各个节点绘制到屏幕上
6.如果DOM或CSSOM被修改，就会重新执行上面所有步骤

1、call,apply和bind的区别

它们在功能上是没有区别的，都是改变this的指向，它们的区别主要是在于方法的实现形式和参数传递上的不同。call和apply方法都是在调用之后立即执行的。而bind调用之后是返回原函数，需要再调用一次才行，call，apply和bind都是Function原型中的方法，而所有的函数都是Function的实例。