前端面试常见问题

1、css3动画是怎样实现的？

利用animation属性制作动画，通过不同的keyframe实现效果。

2、p:nth-of-type(2) 和 p:nth-child(2) 选择器的区别？

p:nth-of-type(2) ：选择父标签下的第二个段落子元素；

p:nth-child(2) ：首先这是一个段落元素，其次这是父标签的第二个子元素（同时满足这两个条件）；

3、

(function(){
    function aa(){
        return 666;
    } 
    return aa(); 
    function aa(){
        return 999;
    } 
})();

结果：999

4、

(function(data){
    delete data;return data;
})(1)

结果：1；delete只能删除属性，不能删除数字等；

5、

function test(xxx) {
    console.log(xxx);
    var xxx = 1;
    function xxx(){

    }
    console.log(xxx);
}
test("111");

考察作用域知识

 结果：

function test(xxx) {
    console.log(xxx);//此处打印的就是申明式
    var xxx = 1;
    function xxx(){//申明式提升到了全局作用域中，首先打印出来，var定义的xxx提升的时候没有赋值，

    }
    console.log(xxx);//var表达式后赋值，此处打印的就是var定义的
}
test("111");

  

6、js数组去重的方法

第一种：

var test = function(arr){
  var newArr = [];
  var obj = {};
  for(var i=0, len = arr.length; i<len; i++){
    if(!obj[arr[i]]){
      obj[arr[i]] = true;
      newArr.push(arr[i]);
    }
  }
  return newArr;
}
var arr = [1,1,2,3,3,4,4,4,67];
console.log(test(arr))

第二种方法：ES6的方法

var arr = [1,1,1,2,2,2,2,3,3,3];
var newarr = new Set(arr);

7、JavaScript原始数据类型有哪些？

string、number、boolean、null、undefined

注：JavaScript还有一个数据类型：object 对象（包括function、array、date等）

8、JavaScript 隐式转换

    "32"+32  //“3232”

    32+32   // 64

    “32”-32  //0

9、创建对象的几种方式

第一种：对象字面量方式

var obj = {x:1,y:2}

第二种：使用new构造器的方式（构造函数创建对象）

function CreatePerson(name){
  this.name=name;
  this.showName=function(){
    alert(this.name);
  }
}
var p1=new CreatePerson('小米');

构造函数模式的优缺点：

　　1、优点：创建自定义函数意味着将来可以将它的实例标识为一种特定的类型，这是构造函数胜过工厂模式的地方

　　2、缺点：每个方法都要在每个实例上重新创建一遍

常问问题：

闭包、作用域、创建对象的方式、css居中方式（垂直和水平）、盒模型包含哪两种，差异是什么、事件有哪两种模式，区别是什么、原始数据类型有哪些、数组去重