50个JavaScript面试题及笔试题题及解析

妖狐艹你老母 2023-01-18 14:23 10阅读 0赞

### 50个JavaScript面试题及笔试题题及解析 ###

*  初级阶段
 *   *  1、 java和javascript有什么区别？
     *  2、什么是JavaScript？
     *  3、JavaScript支持哪些数据类型？
     *  4、JavaScript有哪些特征？
     *  5、JavaScript是区分大小写的语言吗？
     *  6、JavaScript的优点是什么？
     *  7、如何在JavaScript中创建对象？
     *  8、如何在JavaScript中创建数组？
     *  9、在JavaScript中什么是命名函数，它如何创建？
     *  10、可以将匿名函数分配给变量，然后将其作为参数传递给另一个函数吗？
     *  11、JavaScript中的对象参数是什么？如何获取传递给函数的参数类型？
     *  12、JavaScript中变量的作用域是什么？
     *  13、JavaScript中“ this”的作用是什么？
     *  14、什么是回调？
     *  15、什么是闭包？
     *  16、JavaScript有哪些内置方法它们的返回值是什么？
     *  17、JavaScript中的变量命名约定是什么？
     *  18、typeof运算符如何工作？
     *  19、如何使用JavaScript创建Cookie？
     *  20、如何使用JavaScript读取Cookie？
     *  21、如何使用JavaScript删除Cookie？
 *  中级阶段
 *   *  22、Attributes and Property有什么区别？
     *  23、说说可以在JavaScript代码中访问HTML元素的不同方法？
     *  24、HTML文件可以以多种方式包含JavaScript代码吗？
     *  25、在JavaScript中定义变量的方式有哪些？
     *  26、什么是类型语言？
     *  27、Local storage 和 Session storage的区别？
     *  28、 运算符\`==\`和\`===\`有什么区别？
     *  29、null和undefined有什么区别？
     *  30、未声明和未定义之间有什么区别？
     *  31、JavaScript常用框架名称？
     *  32、JavaScript中的window和document有什么区别？
     *  33、innerHTML和innerText有什么区别？
     *  34、JavaScript的事件冒泡是什么？
     *  35、JavaScript中的NaN是什么？
     *  36、JavaScript基本类型/对象类型如何在函数中传递？
     *  37、如何在JavaScript中将任何基数的字符串转换为整数？
     *  38、2+5+“3”的结果为？
     *  39、什么是exports和imports？
 *  高级阶段
 *   *  40、JavaScript中的“Strict”模式是什么？如何启用？
     *  41、JavaScript中的提示框（prompt box）是什么？
     *  42、以下代码输出结果为？
     *  43、Call和Apply之间有什么不同？
     *  44、如何在JavaScript中清空数组？
     *  45、以下代码输出结果为？
     *  46、以下代码输出结果为？
     *  47、以下代码输出结果为？
     *  48、以下代码输出结果为？
     *  49、将JavaScript源文件的全部内容封装在function book中的原因是什么？
     *  50、什么是JavaScript中的转义字符？

# 初级阶段 #

## 1、 java和javascript有什么区别？ ##

**Java**

*  java是一种OOP编程语言
 *  它的创建和应用程序运行在在虚拟机或者浏览器中
 *  Java代码需要编译

**JavaScript**

*  JavaScript是描述性脚本语言
 *  代码仅在浏览器中运行
 *  JavaScript代码全部为文本形式

## 2、什么是JavaScript？ ##

JavaScript是一种轻量级的解释性的编程语言，具有面向对象的功能，使您可以交互性构建到其他静态HTML页面中。该语言的通用核心已经嵌入到Netscape，Internet Explorer 和其他Web浏览器中

## 3、JavaScript支持哪些数据类型？ ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzE4ODM1NTk5_size_16_color_FFFFFF_t_70]

*  Null
 *  Undefined
 *  Boolean
 *  String
 *  Symbol
 *  Number
 *  Object

## 4、JavaScript有哪些特征？ ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzE4ODM1NTk5_size_16_color_FFFFFF_t_70 1]

*  它是一种轻量级的解释性语言。
 *  它是专为创建以网络为中心的应用程序而设计的。
 *  它是一种开放和跨平台的脚本语言。

## 5、JavaScript是区分大小写的语言吗？ ##

是的，JavaScript是区分大小写的语言。关键字，变量，函数名称和任何其他标识符必须始终以一致的字母输入。

## 6、JavaScript的优点是什么？ ##

![在这里插入图片描述][20210506202306255.png]

*  更少的服务器交互—您可以在将页面发送给服务器之前验证用户输入。这样可以节省服务器流量，意味着服务器上的负载更少。
 *  立即向访问者反馈—他们不必等待页面重新加载就可以查看是否忘记了输入内容。
 *  增强的交互性—您可以创建界面，当用户将鼠标悬停在界面上或通过键盘激活界面时，界面会做出反应。
 *  丰富的界面—您可以使用JavaScript包含诸如拖放组件和滑动模块之类的项目，向您的网站访问者提供丰富的界面效果。

## 7、如何在JavaScript中创建对象？ ##

JavaScript很好地支持对象概念。您可以使用对象字面量来创建对象，如下所示：

var obj = { 
    	name:"管乐明",
    	age:'22'
    };

## 8、如何在JavaScript中创建数组？ ##

您可以使用数组字面量来定义数组，如下所示：

var a = [];
    var b = [1,2,3];

## 9、在JavaScript中什么是命名函数，它如何创建？ ##

命名函数在定义后便立即声明名称。可以使用function关键字将其定义为：

function uname(){ 
    	return 1;
    }

## 10、可以将匿名函数分配给变量，然后将其作为参数传递给另一个函数吗？ ##

是可以的！匿名函数可以分配给变量，也可以将其作为参数传递给另一个函数。

## 11、JavaScript中的对象参数是什么？如何获取传递给函数的参数类型？ ##

JavaScript变量参数表示传递给函数的参数。使用typeof运算符可以获取传递给函数的参数类型。  
例如：

function fn(x){ 
    	console.log(typeof x, arguments.length);
    }
    fn(); //==> "undefined", 0
    fn(7); //==> "number", 1
    fn("1", "2", "3"); //==> "string", 3

## 12、JavaScript中变量的作用域是什么？ ##

一个变量的范围是区域内的应用程序所定义，JavaScript变量只有两个作用域。

*  全局变量-全局变量具有全局作用域，这意味着它在JavaScript代码中的任何位置都是可见的。
 *  局部变量-局部变量仅在定义它的函数中可见。

## 13、JavaScript中“ this”的作用是什么？ ##

JavaScript的this关键字引用了它所属的对象。根据使用位置的不同，它具有不同的值。在方法中，这是指所有者对象，在函数中，是指全局对象。

## 14、什么是回调？ ##

回调是指一个普通的JavaScript函数传递一些方法作为参数或可选项。一个函数要等执行另一项函数完成后才执行，因此而得名“回调”。在JavaScript中，函数是对象。因此，函数可以将函数作为参数，并可以由其他函数返回。

## 15、什么是闭包？ ##

每当从某个内部范围内访问在当前范围之外定义的变量时，都会创建闭包。它使您可以从内部函数访问外部函数的范围。在JavaScript中，每次创建函数时都会创建闭包。要使用闭包，只需在另一个函数中定义一个函数并将其公开即可。

## 16、JavaScript有哪些内置方法它们的返回值是什么？ ##

<table> 
 <thead> 
  <tr> 
   <th>内置方法</th> 
   <th>返回自</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>CharAt()</td> 
   <td>返回指定索引的位置的字符</td> 
  </tr> 
  <tr> 
   <td>Concat()</td> 
   <td>表示把几个数组合并成一个数组</td> 
  </tr> 
  <tr> 
   <td>forEach()</td> 
   <td>用于调用数组的每个元素，并将元素传递给回调函数。</td> 
  </tr> 
  <tr> 
   <td>indexOf()</td> 
   <td>从前向后检索字符串，看是否含有指定字符串</td> 
  </tr> 
  <tr> 
   <td>length</td> 
   <td>表示取得当前数组长度 （常用）</td> 
  </tr> 
  <tr> 
   <td>pop()</td> 
   <td>移除数组最后一个元素</td> 
  </tr> 
  <tr> 
   <td>push()</td> 
   <td>往数组中新添加一个元素，返回最新长度</td> 
  </tr> 
  <tr> 
   <td>reverse()</td> 
   <td>反转数组的顺序</td> 
  </tr> 
 </tbody> 
</table>

## 17、JavaScript中的变量命名约定是什么？ ##

1.  不应将任何JavaScript保留关键字用作变量名。例如，break或boolean变量名称无效。
2.  JavaScript变量名称不应以数字（0-9）开头。它们必须以字母或下划线字符开头。例如，12age是无效的变量名，而\_12me或me12是有效的变量名。
3.  JavaScript变量名称区分大小写。例如，Test和test是两个不同的变量。

## 18、typeof运算符如何工作？ ##

typeof运算符用于获取其操作数的数据类型。操作数可以是文字或数据结构，例如变量，函数或对象。它是一元运算符，返回的结果 始终是一个字符串，对不同的操作数，它返回不同的结果。

## 19、如何使用JavaScript创建Cookie？ ##

创建cookie的最简单方法是将字符串值分配给document.cookie对象，如下所示：

document.cookie = "key1 = value1; key2 = value2; expires = date";

## 20、如何使用JavaScript读取Cookie？ ##

读取cookie就像编写cookie一样简单，因为document.cookie对象的值就是cookie。因此，只要您想访问cookie，就可以使用此字符串。

## 21、如何使用JavaScript删除Cookie？ ##

如果要删除cookie，以便随后在JavaScript中读取cookie都不会返回任何值，则只需将过期日期设置为过去的某个时间。您应该定义cookie路径，以确保删除正确的cookie。如果未指定路径，某些浏览器将不允许您删除cookie。

# 中级阶段 #

## 22、Attributes and Property有什么区别？ ##

1.  Attributes- 提供有关元素（例如ID，类型，值等）的更多详细信息。
2.  Property -是分配给属性的值，例如type =“ text”，value ='Name’等。

## 23、说说可以在JavaScript代码中访问HTML元素的不同方法？ ##

*  getElementById（‘idname’）：通过其ID名称获取元素
 *  getElementsByClass（‘classname’）：获取具有以下内容的所有元素给定的类名。
 *  getElementsByTagName（‘tagname’）：获取所有具有给定标签名称的元素。
 *  querySelector（）：此函数使用css样式选择器并返回第一个选定的元素。

## 24、HTML文件可以以多种方式包含JavaScript代码吗？ ##

在HTML文件中可以使用3种不同的方式来包含JavaScript代码：  
内联  
内部的  
外部的

## 25、在JavaScript中定义变量的方式有哪些？ ##

*  Var – JavaScript变量语句用于声明变量，我们可以初始化该变量的值。示例：var b = 1; 变量声明在执行代码之前进行处理。
 *  const – const函数的概念不允许它们修改调用它们的对象。当函数声明为const时，可以在任何类型的对象上调用它。
 *  Let –表示可以重新分配变量，例如循环中的计数器或算法中的值交换。它还表明该变量将仅在其定义的块中使用。

## 26、什么是类型语言？ ##

类型语言中，值与值关联，而不与变量关联。它有两种类型：

*  动态地：在这种情况下，变量可以容纳多种类型；就像在JS中，变量可以采用数字，字符。
 *  静态地：在这种情况下，变量只能容纳一种类型，就像在Java中声明为string的变量只能接受一组字符，而不能执行其他任何操作。

## 27、Local storage 和 Session storage的区别？ ##

*  Local storage–不会针对每个HTTP请求（HTML，图像，JavaScript，CSS等）将数据发送回服务器–减少了客户端与服务器之间的通信量。它将一直保留，直到通过设置或程序手动将其清除。
 *  Session storage–它类似于本地存储；唯一的区别是，存储在本地存储中的数据没有到期时间，而存储在会话存储中的数据则在页面会话结束时被清除。关闭浏览器后，会话存储将退出。

## 28、 运算符`==`和`===`有什么区别？ ##

`==`和`===`运算符之间的主要区别在于，通过进行类型校正来比较变量，例如，如果将数字与带有数字文字的字符串进行比较，则`==`允许，但`===`不允许那是因为它不仅检查值，而且还检查两个变量的类型，如果两个变量的类型不同，则“`===`返回false，而“`==`返回true。

## 29、null和undefined有什么区别？ ##

undefined表示已声明变量，但尚未分配值。另一方面，null是赋值。可以将其分配给变量，以表示没有值。同样，undefined和null是两种不同的类型：undefined是类型本身（未定义），而null是对象。

## 30、未声明和未定义之间有什么区别？ ##

未声明的变量是程序中不存在且未声明的变量。如果程序尝试读取未声明变量的值，则会遇到运行时错误。未定义的变量是在程序中声明但未赋予任何值的变量。如果程序尝试读取未定义变量的值，则返回值为undefined。

## 31、JavaScript常用框架名称？ ##

JavaScript框架是用JavaScript编写的应用程序框架。它的控制流程与JavaScript库不同。有许多可用的JavaScript框架，最常用的框架是：

*  Angular
 *  React
 *  Vue

## 32、JavaScript中的window和document有什么区别？ ##

<table> 
 <thead> 
  <tr> 
   <th>window</th> 
   <th>document</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>JavaScript 的window是一个全局对象，其中包含变量，函数，历史记录，位置。</td> 
   <td>document包含于window当中，可以视作为window的属性。</td> 
  </tr> 
 </tbody> 
</table>

## 33、innerHTML和innerText有什么区别？ ##

*  innerHTML –如果在字符串中找到，它将处理HTML标记
 *  innerText –如果在字符串中找到，它将不处理HTML标记

## 34、JavaScript的事件冒泡是什么？ ##

事件冒泡是HTML DOM API中事件传播的一种方式，当一个事件发生在另一个元素内的一个元素中，并且两个元素都注册了该事件的句柄时。冒泡时，事件首先由最里面的元素捕获和处理，然后传播到外面的元素。执行从该事件开始，并转到其父元素，然后执行传递到其父元素，依此类推，直到body元素。

## 35、JavaScript中的NaN是什么？ ##

NaN是Not Number的缩写。 由于NaN总是比较不等于任何数字，因此它通常用于指示应返回有效数字的函数的错误情况。当将字符串或其他内容转换为数字而无法完成操作时，我们将看到NaN。

## 36、JavaScript基本类型/对象类型如何在函数中传递？ ##

两者之间的区别之一是原始数据类型按值传递，而对象按引用传递。

*  按值表示创建原始副本。像双胞胎一样：他们天生就一样，但是当双胞胎等第二个人在战争中受伤的时候，另一个人并不会有影响。
 *  “按引用”是指为原始文件创建ALIAS。当称呼某个人为“小张”时，尽管小张的名字叫张三，但并不会突然产生出一个和张三一样的克隆人：小张和张三仍然是同一个人，但是可以用这两个截然不同的名字来称呼。

## 37、如何在JavaScript中将任何基数的字符串转换为整数？ ##

parseInt（）函数用于不同的基数之间的数字转换。它以要转换的字符串为第一个参数，第二个参数为给定字符串的基数。  
例如：

parseInt("4F", 16)

## 38、2+5+“3”的结果为？ ##

由于2和5是整数，因此将对其进行数字加法。并且由于3是字符串，因此将完成串联。因此结果将是73。""在此处有所区别，3表示为字符串而不是数字。

## 39、什么是exports和imports？ ##

exports和imports可帮助我们编写模块化的JavaScript代码。使用导入和导出，我们可以将代码分成多个文件。  
  例如-

//------ lib.js ------</span>
    export const sqrt = Math.sqrt;</span>
    export function square(x) { </span>
    return x * x;</span>
    }
    export function diag(x, y) { 
    return sqrt(square(x) + square(y));
    }
     
    //------ main.js ------</span>
     {  square, diag } from 'lib';
    console.log(square(5)); // 25
    console.log(diag(4, 3)); // 5

# 高级阶段 #

## 40、JavaScript中的“Strict”模式是什么？如何启用？ ##

严格模式是一种将更好的错误检查引入代码的方法。

*  使用严格模式时，不能使用隐式声明的变量，也不能将值分配给只读属性，也不能将属性添加到不可扩展的对象。
 *  可以通过在文件，程序或函数的开头添加“ use strict”来启用严格模式。

## 41、JavaScript中的提示框（prompt box）是什么？ ##

提示框是允许用户通过提供文本框输入。hint（）方法显示一个对话框，提示访问者输入信息。如果希望用户在进入页面之前输入值，则通常使用提示框。当弹出提示框时，用户必须在输入输入值后单击“确定”或“取消”才能继续。

## 42、以下代码输出结果为？ ##

var Y = 1;
    if (function F(){ })
    { 
    y += Typeof F;</span>
    }
    console.log(y);

输出将是1undefined。if条件语句使用eval进行求值，因此eval（function f（）\{\}）返回函数f（）\{\}（这是正确的）。因此，在if语句内部，执行typeof f返回未定义，因为if语句代码在运行时执行，并且if条件内部的语句在运行时求值。

## 43、Call和Apply之间有什么不同？ ##

call（） 方法调用给定单独设置这个值和参数的函数。  
   例如：

fun.call(thisArg[, arg1[, arg2[, ...]]])

apply（） 方法调用给定该值的一个函数和参数作为数组提供。  
   例如：

fun.apply(thisArg, [argsArray])

## 44、如何在JavaScript中清空数组？ ##

*  方法一

arrayList = []

*  方法二

arrayList.length = 0;

*  方法三

arrayList.splice(0, arrayList.length);

*  方法四

while(arrayList.length)
    { 
    arrayList.pop();
    }

## 45、以下代码输出结果为？ ##

var Output = (function(x)
    { 
    Delete X;
    return X;
    }
    )(0);
    console.log(output);

输出为0。delete运算符用于从对象中删除属性。这里x不是对象而是局部变量。删除运算符不会影响局部变量

## 46、以下代码输出结果为？ ##

var X = {  Foo : 1}; 
    var Output = (function() 
    {  
    delete X.foo; 
    return X.foo; 
    } 
    )(); 
    console.log(output);

输出为undefined。delete运算符用于删除对象的属性。在此，x是一个具有foo属性的对象，并且由于它是一个自调用函数，因此我们将从对象x中删除foo属性。这样做之后，当我们尝试引用已删除的属性foo时，结果是undefined的。

## 47、以下代码输出结果为？ ##

var Employee =
    { 
    company: 'xyz'
    }
    var Emp1 = Object.create(employee);
    delete Emp1.company 
    Console.log(emp1.company);

输出将为xyz。在这里，emp1对象以company为原型属性。delete运算符不会删除原型属性。emp1对象没有company作为自己的财产。但是，我们可以使用delete Employee.company直接从Employee对象中删除company属性。

## 48、以下代码输出结果为？ ##

//nfe (named function expression)
    var Foo = Function Bar()
    { 
    return 7;
    };
    typeof Bar();

输出将是Reference Error。一个定义函数只能有一个参考变量作为其函数名称。

## 49、将JavaScript源文件的全部内容封装在function book中的原因是什么？ ##

这是一种越来越普遍的做法，被许多流行的JavaScript库采用。这项技术会围绕文件的整个内容创建一个闭合符，最重要的是创建一个私有命名空间，从而有助于避免不同的JavaScript模块和库之间可能发生的名称冲突。

## 50、什么是JavaScript中的转义字符？ ##

JavaScript转义字符使您可以编写特殊字符而不会破坏您的应用程序。当使用特殊字符（例如单引号，双引号，撇号和与号）时，使用转义符（反斜杠），将反斜杠放在字符之前以使其显示。

document.write "I am a \"good\" boy"

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzE4ODM1NTk5_size_16_color_FFFFFF_t_70]: /images/20221021/0ead727b84204944b90424ec5746851b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzE4ODM1NTk5_size_16_color_FFFFFF_t_70 1]: /images/20221021/4df39c679a4145e98532f47e92492994.png
[20210506202306255.png]: /images/20221021/2e79f83f07694a7dbb1e58bad030afe8.png