前端工程师js面试题

掌握这些题，面试不再愁

在前端工程师的面试中，javascript是至关重要的考察内容。下面就为大家详细介绍一些常见的面试题。

基础语法与数据类型

这部分主要考察对javascript基础语法和数据类型的理解。比如，会问到数据类型有哪些，像基本数据类型包括数值（number）、字符串（string）、布尔值（boolean）、空值（null）、未定义（undefined）和symbol，引用数据类型主要是对象（object）。

案例：判断一个变量的数据类型，可以使用typeof运算符。例如：

let num = 10; console.log(typeof num); // 输出 'number'

还可能会考察变量提升的概念。在javascript中，变量和函数的声明会被提升到当前作用域的顶部。比如：

console.log(a); // 输出 undefined
var a = 10;

函数与作用域

函数是javascript的一等公民，面试中经常会考察函数的定义和调用方式。函数可以通过函数声明、函数表达式等方式定义。

案例：函数声明方式定义函数

function add(a, b) {
return a + b;
}
console.log(add(2, 3)); // 输出 5

作用域也是重点考察内容，包括全局作用域和函数作用域。例如：

var globalvar = 'global';
function test() {
var localvar = 'local';
console.log(globalvar); // 可以访问全局变量
}
test();
console.log(localvar); // 报错，无法访问局部变量

异步编程

异步编程是javascript的重要特性，常见的考察点有回调函数、promise和async/await。

案例：回调函数实现异步操作

function getdata(callback) {
settimeout(() => {
callback('data fetched');
}, 1000);
}
getdata((data) => {
console.log(data); // 1秒后输出 'data fetched'
});

promise可以更好地处理异步操作的状态，避免回调地狱。例如：

const promise = new promise((resolve, reject) => {
settimeout(() => {
resolve('success');
}, 1000);
});
promise.then((result) => {
console.log(result); // 1秒后输出 'success'
});

面向对象编程

javascript支持面向对象编程，考察点包括构造函数、原型链和类。

案例：构造函数创建对象

function person(name, age) {
this.name = name;
this.age = age;
}
var person = new person('john', 25);
console.log(person.name); // 输出 'john'

原型链可以实现对象之间的继承。例如：

function animal() {}
animal.prototype.speak = function() {
console.log('animal speaks');
};
function dog() {}
dog.prototype = object.create(animal.prototype);
var dog = new dog();
dog.speak(); // 输出 'animal speaks'

dom操作与事件处理

在前端开发中，dom操作和事件处理是必不可少的。面试中可能会考察如何选择dom元素、修改元素属性和绑定事件。

案例：选择dom元素并修改属性

var element = document.getelementbyid('myelement');
element.style.color = 'red';

事件处理可以通过addeventlistener方法实现。例如：

var button = document.getelementbyid('mybutton');
button.addeventlistener('click', () => {
console.log('button clicked');
});