2023 JavaScript 面试问答

JavaScript 面试题和答案:

1. 提及 JavaScript 中的不同数据类型。
   原始数据类型:
   数字
   布尔值
   字符串
   未定义
   标识符
   Null 值
   非原始数据类型:
   对象
   数组
   2.在 JavaScript 中定义提升。
   这是前 50 个 JavaScript 面试问题和答案的第二个问题。提升是 Javascript 默认行为，其中所有变量和函数声明都移动到顶部。
2. 说出’= =’ 和 ‘= = =‘的区别。
   这是前 50 个 JavaScript 面试问题和答案的第三个问题。如果两个值相同，’= =’ 返回 true，而如果变量的数据类型和值相同，‘= = =’ 返回 true。

var a = 3, b = '3';
console.log(a==b);
console.log(a===b);
// Output
// true
// false

3. JavaScript 是动态类型语言吗？是的，因为变量的数据类型是在运行时决定的，所以 JavaScript 是一种动态类型的语言。
4. isNaN在JavaScript中的用法是什么？
   NaN 代表“不是数字”。如果给定值不是数字，则返回 true，否则返回 false。

console.log(isNaN(5.5));
console.log(isNaN('hello'));
console.log(isNaN(true));
// Output
// false
// true
// false

6.在 JavaScript 中，“this”关键字是什么意思？
这是前 50 个 JavaScript 面试问题和答案的第 6 个问题。 JavaScript 中的“this”关键字指的是调用它的对象。根据使用的位置，“this”有多个值。它在方法中引用所有者对象，在函数中引用全局对象。
7.如何使用 JavaScript 改变 HTML 元素的样式？
可以通过两种方式更改 HTML 元素的样式：

• setAttribute() 方法:
  element.setAttriute(‘style’, cssProperty); 例:

element.setAttribute("style", "background-color: yellow;");

• style 属性:
  element.style.cssProperty = value;例:

element.style.background="yellow";

8.下面给出的 JavaScript 代码的输出是什么？

console.log(5+3+'6');
// Output
// 86

9.提及JavaScript 中不同类型的弹出框。弹出框有3种类型:

alert()
//For example,
alert(‘Alert Box’);
prompt()
//For example,
const value = prompt(‘Enter a value:’);
console.log(value);
confirm()
//For example,
const value = confirm(“Do you want to continue?”);
console.log(value);

10.在JavaScript中定义undefined。在 JavaScript 中，undefined 表示变量已声明但未赋值或根本未声明。
11.在 JavaScript 中定义 null。JavaScript 中的 Null 表示没有任何值。它可以分配给一个变量，以表明它目前没有价值，但将来会这样做。
12.JavaScript中typeof运算符的用法是什么？typeof 运算符用于检查变量或值的数据类型。

const x = 5, y = 'Hello';
console.log(typeof x, typeof y);
// Output
// number string

13.JavaScript 中的 DOM 是什么？DOM 代表文档对象模型。它是 HTML 文档的分层表示。
14.访问和操作文档对象模型（DOM）的方法有哪些？

document.getElementById(idName)
document.getElementsByClass(className)
document.getElementsByTagName(TagName)
document.querySelector(cssSelector)
document.getElementsByName(name);
document.querySelectorAll(cssSelector)

5. JavaScript 中数组的 push 和 unshift 方法有什么区别？push() 方法是一种数组方法，用于在数组末尾插入一个元素。例:

const arr = [-4, 9, -7, 11, 19];
console.log(arr);
arr.push(6);
console.log(arr);
// Output
// [-4, 9, -7, 11, 19]
// [-4, 9, -7, 11, 19, 6]

unshift() 方法是一种数组方法，用于在数组的开头插入一个元素。例:

const arr = [-4, 9, -7, 11, 19];
console.log(arr);
arr.unshift(6);
console.log(arr);
// Output
// [-4, 9, -7, 11, 19]
// [6, -4, 9, -7, 11, 19]

16.JavaScript中的for-in循环有什么用？ JavaScript 中的 for-in 循环用于遍历对象的属性。句法:

for(let variableName in objectName){
// do something
}
For example,
var person = {
  name: "Shikhar Gupta",
  age: 22,
  gender: "Male",
  email:"shikhar@xyz.com"
};
for(let key in person)
{
  console.log(key, person[key]);
}
//Output
//name Shikhar Gupta
//age 22
//gender Male
//email shikhar@xyz.com

17.JavaScript 中数组的 pop() 和 shift 方法有什么区别？pop() 方法是一种数组方法，用于删除数组末尾的元素。例:

const arr = [-4, 9, -7, 11, 19];
console.log(arr);
arr.pop();
console.log(arr);
// Output
// [-4, 9, -7, 11, 19]
// [-4, 9, -7, 11]

shift() 方法是一种数组方法，用于删除数组开头的元素。例:

const arr = [-4, 9, -7, 11, 19];
console.log(arr);
arr.shift();
console.log(arr);
// Output
// [-4, 9, -7, 11, 19]
// [9, -7, 11, 19]

18.JavaScript 中的 innerHTML 和 innerText 有什么区别？
innerText 是用于检索和设置 HTML 元素或标记的内容的属性，不考虑空格。使用时不能使用HTML标签；否则，将写入纯文本。
innerHTML 属性用于打印或更改 HTML 及其中包含的文本，以及设置 HTML 组件的内容。空间也包括在内。也可以插入 HTML 标签。
19.命名用于在 HTML 文档上打印消息的方法。

document.write()
//For example,
document.write(‘Hello, World!’);
document.writeln()
//For example,
document.writeln(‘Hello, World!’);

20.什么是箭头函数？
箭头函数是在 JavaScript 中编写用户定义函数的一种简短语法或简明方式。此功能是在 ES6 或 ECMAScript 2015 中引入的。
例:

let fun = () => {
  console.log ('This is an example of the JavaScript arrow function.');
}
fun ();
// Output
// This is an example of the JavaScript arrow function.

21.JavaScript 中的解构是什么意思？JavaScript 中的解构用于从对象和数组中提取或检索多个值。

• 数组的解构

let arr = [1, 3, -4, 10];
let [a, b, c, d] = arr;
console.log(a, b, c ,d);
// Output
// 1 3 -4 10

• 对象的解构

let person = {
  name:"Samar Singh",
  age: 21,
  gender: 'Male'
}const {name, age, gender} = person;
console.log(name, age, gender);
// Output
// Rahul Sharma 22 Male

• 下面给出的 JavaScript 代码的输出是什么？

let a = {}, b = {name:"Rohit"}, c = {name:"Singh"};
a[b] = {name:"Vivan"};
b = {name:"Akshay"};
console.log(a);
// Output
// {name: 'Vivan'}

23.有多少种不同的方式可以将 JavaScript 包含在一个 HTML 文件中？
JavaScript 代码可以通过三种不同的方式包含在 HTML 文件中：

• 有序
• 外部的
• 内部的

24. 提及 Java 和 JavaScript 之间的区别。

Java	JavaScript
Java是一种面向对象的编程语言。	JavaScript是一种面向对象的脚本语言，客户端和服务器端都使用。
它开发在虚拟机或网络浏览器中运行的应用程序。	它开发在网络浏览器中运行的应用程序。

25. 在JavaScript中定义变量有哪些不同的方法?
    在JavaScript中定义变量有3种不同的方法:var、let、const。
26. 用JavaScript定义回调函数。
    回调函数是在另一个函数执行之后执行的函数。它也被定义为一个函数，作为参数传递给另一个函数。
27. 提到JavaScript中void(0)的使用。Void(0)用于防止页面刷新或重新加载。
28. 如何使用JavaScript找到客户端机器上的操作系统?
    我们可以使用导航器。appVersion 属性来查找客户端机器上的操作系统。console.log (navigator.appVersion);
29. 如何检查JavaScript复选框的状态? 我们可以使用checked属性来检查JavaScript中复选框的状态。
30. 如何检测正在运行网页的浏览器? 窗口对象导航器用于确定当前正在执行网页的浏览器。
    console.log (navigator.appName);
31. 如何使用JavaScript将用户重定向到不同的页面? 窗口对象位置可用于将用户重定向到新页面。
    window.location.href = https://www.usemynotes.com/;
32. 预测以下JavaScript代码在执行时的输出。

var x = 10;
(function () {
  console.log("Initial Number " + x);
  var x = 20;
  console.log("New Number " + x);
})(); 
// Output
// Initial Number undefined
// New Number 20

33. 列举JavaScript中各种类型的错误。

Runtime errors	运行时错误
Load time errors	加载时间错误
Logical errors	逻辑错误

34. 提到JavaScript中indexOf()和lastindexOf()方法的区别。

indexOf ()
它返回指定文本第一次出现的字符串中的位置或索引。
lastIndexOf ()
它返回字符串中指定文本最后一次出现的索引。

let str = "Hello world";
console.log(str.indexOf("l"));
console.log(str.lastIndexOf("l")); 
// Output
// 2
// 9

35. 为动态添加新元素编写JavaScript代码。

<!DOCTYPE html>
<html>
<head>
  <title>Elements Dynamically</title>
</head>
<body>
<button id="btn">Click Me</button>
<script>
const button = document.querySelector('#btn');
button.addEventListener('click',()=>{
  var p = document.createElement('h1');
  var text = document.createTextNode('Add content dynamically using JavaScript');
  p(text);
  document.body(p);
});
</script>
</body>
</html>

36. 如何使用JavaScript提交表单?
    要使用JavaScript提交表单，可以使用document.form[0].submit()方法。
37. 在JavaScript中，我们如何创建和读取cookie?
    在JavaScript中，我们可以使用属性来创建和读取cookie。

document.cookie = “username=Raman Singh”;
console.log(document.cookie);

38. 在JavaScript中，如何创建通用对象?

var genericObject = new Object();

39. 预测以下JavaScript代码在执行时的输出。

console.log(false == '0')
console.log(false === '0')
// Output
// true
// false

40. 预测以下JavaScript代码在执行时的结果。

var a = 21;
var fun = function () {
  console.log(a);
  var a = 40;
};
fun ();
// Output
// undefined

41. 给定的JavaScript代码会产生错误吗?

var arr = [3, 2, 5];
console.log(arr[4]);
No, the above code does not produce an error.
// Output
// undefined

42. 执行以下脚本时会输出什么?

console.log(typeof undefined===typeof null);
// Output
// false

43. 下面的JavaScript在执行时会输出什么?

console.log(typeof typeof 2.4);
// Output
// string

44. 执行下面的JavaScript时会得到什么结果?

var x = 1;
function outerFunction(){
  var x = 5;
  function innerFunction(){
    x++;
    var x = 8;
    console.log(x)
  }
  innerFunction();
}
outerFunction();
// Output
// 8

45. 预测下列JavaScript代码的结果。

console.log(4 < 5 < 6);
console.log(6 > 5 > 4);
// Output
// true
// false

46. 如何在JavaScript中创建数组?
    使用数组文字:

const a = [1, 3, 7];

47. 如何在JavaScript中创建对象?
    使用对象文字:

let person = {
  name:"Neha Singh",
  age: 25,
  gender: 'Female'
}

使用new关键字:

var person=new Object();
person.name='Shikhar Gupta';
person.age='24';
console.log(person);

48. JavaScript有哪些框架? React, Angular和Vue是一些JavaScript框架。
49. 在JavaScript中，使用什么方法从特定对象上移除焦点? 在JavaScript中，Blur函数用于从对象上移除焦点。
50. 预测两个函数的输出。

function fun1()
{
  return {
    message: "hello"
  };
}
 
function fun2()
{
  return
 {
    message: "hello"
  };
}
console.log(fun1());
console.log(fun2());
// Output
// {message: 'hello'}
// undefined