Javascript面试题：30道含答案和代码示例的练习题

以下是30道Javascript面试题，每个问题都包含答案和代码示例。这些问题涵盖了Javascript的各个方面，包括基础知识、DOM操作、事件处理、异步编程和面向对象编程等。

什么是Javascript？

Javascript是一种脚本语言，用于在Web浏览器中编写交互式网页应用程序。

如何声明变量？

使用var、let或const关键字声明变量。

var x = 10;
let y = 20;
const z = 30;

如何创建函数？

使用function关键字创建函数。

function add(x, y) {
    
    
  return x + y;
}

如何调用函数？

使用函数名和括号调用函数。

var result = add(2, 3);

什么是DOM？

DOM（文档对象模型）是一种API，用于在Javascript中操作HTML和XML文档。

如何选取元素？

使用document.getElementById()、document.getElementsByClassName()、document.getElementsByTagName()或document.querySelector()方法选取元素。

var element = document.getElementById("myElement");
var elements = document.getElementsByClassName("myClass");
var elements = document.getElementsByTagName("p");
var element = document.querySelector("#myElement");

如何设置元素的属性？

使用element.setAttribute()方法设置元素的属性。

var element = document.getElementById("myElement");
element.setAttribute("class", "newClass");

如何添加元素到DOM中？

使用document.createElement()、element.appendChild()或element.insertBefore()方法添加元素到DOM中。

var element = document.createElement("div");
element.textContent = "Hello World";
document.body.appendChild(element);

如何移除元素从DOM中？

使用element.parentNode.removeChild(element)方法将元素从DOM中移除。

var element = document.getElementById("myElement");
element.parentNode.removeChild(element);

什么是事件？

事件是发生在HTML元素上的操作，如鼠标单击、按键、滚动等。

如何为元素添加事件处理程序？

使用element.addEventListener()方法为元素添加事件处理程序。

var element = document.getElementById("myElement");
element.addEventListener("click", function() {
    
    
  alert("Hello World");
});

如何阻止事件的默认行为？

使用event.preventDefault()方法阻止事件的默认行为。

var link = document.getElementById("myLink");
link.addEventListener("click", function(event) {
    
    
  event.preventDefault();
});

如何停止事件冒泡？

使用event.stopPropagation()方法停止事件冒泡。

var element1 = document.getElementById("myElement1");
var element2 = document.getElementById("myElement2");
element1.addEventListener("click", function(event) {
    
    
  event.stopPropagation();
});
element2.addEventListener("click", function(event) {
    
    
  alert("Hello World");
});

什么是闭包？

闭包是一个函数和其作用域的组合，可以访问上层作用域中的变量。

function outer() {
    
    
  var x = 10;
  function inner() {
    
    
    return x;
  }
  return inner;
}
var closure = outer();
var result = closure();

什么是回调函数？

回调函数是一个函数，作为参数传递给另一个函数，并在该函数完成后执行。

function add(x, y, callback) {
    
    
  var result = x + y;
  callback(result);
}
function displayResult(result) {
    
    
  console.log(result);
}
add(2, 3, displayResult);

什么是异步编程？

异步编程是一种编程模型，其中代码不会等待操作完成，而是立即继续执行。

如何使用回调函数进行异步编程？

使用回调函数作为异步操作完成后的处理程序。

function loadScript(url, callback) {
    
    
  var script = document.createElement("script");
  script.src = url;
  script.onload = callback;
  document.head.appendChild(script);
}
loadScript("script.js", function() {
    
    
  console.log("Script loaded");
});

什么是Promise？

Promise是一种异步编程模型，用于处理异步操作的结果。

var promise = new Promise(function(resolve, reject) {
    
    
  setTimeout(function() {
    
    
    resolve("Hello World");
  }, 1000);
});
promise.then(function(result) {
    
    
  console.log(result);
});

什么是async/await？

async/await是一种异步编程模型，用于处理异步操作的结果。

async function loadData() {
    
    
  var response = await fetch("data.json");
  var data = await response.json();
  console.log(data);
}
loadData();

什么是模块？

模块是包含一组相关功能的代码单元，可以通过导入和导出操作在不同的文件中重复使用。

// module1.js
export function add(x, y) {
    
    
  return x + y;
}

// module2.js
import {
    
     add } from "./module1.js";
var result = add(2, 3);

```javascript

1. 什么是类？

类是一个模板，用于创建具有相似属性和行为的对象。

Javascript面试题：30道含答案和代码示例的练习题

猜你喜欢