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

逃离我推掉我的手 2024-03-22 00:48 215阅读 0赞

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

  1. 什么是Javascript?

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

  1. 如何声明变量?

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

  1. var x = 10;
  2. let y = 20;
  3. const z = 30;
  1. 如何创建函数?

使用function关键字创建函数。

  1. function add(x, y) {
  2. return x + y;
  3. }
  1. 如何调用函数?

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

  1. var result = add(2, 3);
  1. 什么是DOM?

DOM(文档对象模型)是一种API,用于在Javascript中操作HTML和XML文档。

  1. 如何选取元素?

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

  1. var element = document.getElementById("myElement");
  2. var elements = document.getElementsByClassName("myClass");
  3. var elements = document.getElementsByTagName("p");
  4. var element = document.querySelector("#myElement");
  1. 如何设置元素的属性?

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

  1. var element = document.getElementById("myElement");
  2. element.setAttribute("class", "newClass");
  1. 如何添加元素到DOM中?

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

  1. var element = document.createElement("div");
  2. element.textContent = "Hello World";
  3. document.body.appendChild(element);
  1. 如何移除元素从DOM中?

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

  1. var element = document.getElementById("myElement");
  2. element.parentNode.removeChild(element);
  1. 什么是事件?

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

  1. 如何为元素添加事件处理程序?

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

  1. var element = document.getElementById("myElement");
  2. element.addEventListener("click", function() {
  3. alert("Hello World");
  4. });
  1. 如何阻止事件的默认行为?

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

  1. var link = document.getElementById("myLink");
  2. link.addEventListener("click", function(event) {
  3. event.preventDefault();
  4. });
  1. 如何停止事件冒泡?

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

  1. var element1 = document.getElementById("myElement1");
  2. var element2 = document.getElementById("myElement2");
  3. element1.addEventListener("click", function(event) {
  4. event.stopPropagation();
  5. });
  6. element2.addEventListener("click", function(event) {
  7. alert("Hello World");
  8. });
  1. 什么是闭包?

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

  1. function outer() {
  2. var x = 10;
  3. function inner() {
  4. return x;
  5. }
  6. return inner;
  7. }
  8. var closure = outer();
  9. var result = closure();
  1. 什么是回调函数?

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

  1. function add(x, y, callback) {
  2. var result = x + y;
  3. callback(result);
  4. }
  5. function displayResult(result) {
  6. console.log(result);
  7. }
  8. add(2, 3, displayResult);
  1. 什么是异步编程?

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

  1. 如何使用回调函数进行异步编程?

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

  1. function loadScript(url, callback) {
  2. var script = document.createElement("script");
  3. script.src = url;
  4. script.onload = callback;
  5. document.head.appendChild(script);
  6. }
  7. loadScript("script.js", function() {
  8. console.log("Script loaded");
  9. });
  1. 什么是Promise?

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

  1. var promise = new Promise(function(resolve, reject) {
  2. setTimeout(function() {
  3. resolve("Hello World");
  4. }, 1000);
  5. });
  6. promise.then(function(result) {
  7. console.log(result);
  8. });
  1. 什么是async/await?

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

  1. async function loadData() {
  2. var response = await fetch("data.json");
  3. var data = await response.json();
  4. console.log(data);
  5. }
  6. loadData();
  1. 什么是模块?

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

  1. // module1.js
  2. export function add(x, y) {
  3. return x + y;
  4. }
  5. // module2.js
  6. import {
  7. add } from "./module1.js";
  8. var result = add(2, 3);
  9. ```javascript
  10. 1. 什么是类?
  11. 类是一个模板,用于创建具有相似属性和行为的对象。

发表评论

表情:
评论列表 (有 0 条评论,215人围观)

还没有评论,来说两句吧...

相关阅读