2020年最新10道JavaScript面试题

其实面试的时候都是一些基础但是又是精髓的知识。今天就来于测一下2020年最新10道JavaScript面试题。

1、对作用域上下文和this的理解

例如:

var person = {
num: 1,
getNum:function(){
return this.num;
}
}
console.log(person.getNum());//1
var fun = person.getNum; //相当于把函数拿出来,在全局中的函数复制给一个变量,所以是undefined
console.log(fun());//undefined
//fun是在window上下文被执行的,上下文中没有num,所以为undefined

2、setTimeout事件处理器

for(var i = 0; i < 5; i++){
setTimeout(function(){
console.log(i)//5,5,5,5,5
},0)
}
 // i 相当于是全局中的i,所以是5
//Javascript事件处理器在线程空闲之前不会运行,要等到全部执行完了才开始执行,所以是5次5

3、JS数据类型

var j = null;
console.log(typeof(j));//object
//null是一个只有一个值的数据类型,这个值就是null。表示一个空指针对象,是对象类型

//还有其他几种数据类型也要熟悉和了解,比如undefined和null的区别。

4、作用域

var a = 10;
function num(){
console.log(a);//10
a = 100;
console.log(a);//100
}

num();
console.log(a)//10
//这里考的是作用域的问题,全局作用域中有a,所以执行函数时,按照先后顺序,先输出10,然后函数体中改变了变量a,s所以再次输出时时100,最后,在windon中输出的是已经被改变数值的a,所以是100

//全局变量:当前页面内有效
//局部变量:函数方法内有效


5、new操作符

function User(name,password){
this.name = name;
this.password = password;
this.fun = function(){
console.log(name+","+password)
}
}

var user = new User("lucy",11212)
console.log(user.name); // lucy
user.fun(); // lucy,11212
//new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例
//创建一个new实例,其实就是创建了一个空的对象{},然后再把这个对象和另外一个对象相连链接,将获得另外一个对象的属性和方法。

6、DOM操作

获取页面上所有的checkbox:

var inputs = document.getElementsByTagName("input");//获取所有的input标签对象
var checkboxArray = [];//定义一个空的数组,用于存放所有的checkbox
for(var i=0;i<inputs.length;i++){
var obj = inputs[i];
if(obj.type == 'checkbox'){// 判断input的属性type是否为checkbox
checkboxArray.push(obj);//如果是就添加到数组里面去
}
}

7、数组处理(算法)

去掉数组中重叠的元素:

var arr = [1,2,5,5,6,5,4,5,6,8,7,9,2,4];//定义一个数组
var array = [];//定义一个空的数组,用于存放唯一的元素
for(var i = 0; i<arr.length; i++){//遍历数组
var j = arr[i];//数组中的元素
if(array.indexOf(j) == -1){//检查array数组,如果里面没有元素j,就把j添加到数组里,如果已经存在就不会执行
array.push(j)
}
}
console.log(array)//[1, 2, 5, 6, 4, 8, 7, 9]

补充:使用es6的去重复方法

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array =[];
    for(var i = 0; i < arr.length; i++) {
            if( !array.includes( arr[i]) ) {//includes 检测数组是否有某个值
                    array.push(arr[i]);
              }
    }
    return array
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}]  

8、处理字符串

例如更具空格‘ ’分割字符串:

var str = "dmj kaf nndjsaj infjnf hf knmklja";
var str_arr = str.split(' ');//分割字符
var sort_arr = str_arr.sort();
console.log(sort_arr)
//["dmj", "hf", "infjnf", "kaf", "knmklja", "nndjsaj"]

字符串还可以考到怎么找出出现最多次数的字符。

9、let和var的区别

for(var i = 0; i<5; i++){
var a = "luara"
}

console.log(a);//luara
console.log(i);//5

//Js没有块级作用域,for之后全局作用域和函数作用域,for不是函数,所以就算不在for里面也是可以访问到i,a


for(let i = 0; i<5; i++){
let a = "luara"
}
console.log(a);//报错:a is not defined
console.log(i);//报错:i is not defined

//let声明的变量拥有块级作用域,在函数或者方法体内定义的变量不会被外层访问到;
//另外,var定义的全局变量是window的属性,可以通过window.访问到,而let定义的不能。

10、ES6的新特性

(1)新增的let和const,let用于声明变量,const用于声明常量。
(2)使用剪头函数

let fun = function(){
console.log("a");
}

//剪头函数简写函数
let fun = ()=>{
console.log("a");
}

以上是精选2020年最新10道JavaScript面试题,预祝大家可以找到好工作。

点赞
  1. re大法好说道:

    7、数组处理(算法)
    数组去重用indexOf有问题的.(如 NaN, 0, -0)。换成es6的includes方法更好,

    1. luo16616说道:

      谢谢大神指点

  2. luo16616说道:

    7、数组处理(算法)补充:
    function unique(arr) {
    if (!Array.isArray(arr)) {
    console.log('type error!')
    return
    }
    var array =[];
    for(var i = 0; i < arr.length; i++) { if( !array.includes( arr[i]) ) {//includes 检测数组是否有某个值 array.push(arr[i]); } } return array } var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}]; console.log(unique(arr)) //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}]

luo16616进行回复 取消回复

电子邮件地址不会被公开。 必填项已用*标注