前端面试题之JavaScript第一篇(持续更新)

一、JavaScript第一篇

JavaScript在1995年由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。

1.1什么是JavaScript

JavaScript是客户端和服务端脚本语言，可以插入到HTML中，同时JavaScript也是面向对象的编程语言。

1.2 JavaScript和ASP脚本相比，哪个更快

JavaScript更快。JavaScript是一种客户端语言，因为他不需要web服务器的协助来执行。

另一方面，ASP是服务端语言，因此总是比JavaScript更慢。

JavaScript现在可用于服务端语言(node.js)

1.3 什么是负无穷大

负无穷大是JavaScript中的一个数字，可以通过负数除以零来得到。

let res = -1
console.log(-1 / 0) //Infinity

1.4 什么是未声明和未定义的变量

**未声明的变量是程序中不存在且未声明的变量。**如果程序尝试读取未声明变量的值，则会遇到运行时错误。

**未定义的变量是在程序中声明但尚未给出任何值的变量。**如果程序尝试读取未定义变量的值，则返回未定义的值。

console.log(res)  // res is not defined

let res
console.log(res) // undefined

1.5 如何动态添加元素

let li = document.createElement('li')
li.innerHTML = '我是新添加的标签'
document.querySelector('#box').appendChild(li)

let li = document.createElement('li')
li.innerHTML = '我是新插入的节点'
document.querySelector('#box').insertAdjacentElement('beforeBegin', li)

1.6 什么是全局变量 如何声明 有哪些问题

全局变量是整个代码长度可用的变量，也就是说这些变量没有任何作用域。var关键字用于声明局部变量或对象。如果省略var关键字，则声明一个全局变量。

 // 方法一
 test = 5
 console.log(test)
 window.test2 = 10
 // 方法二
 console.log(test2)

使用全局变量所面临的问题是本地和全局变量名称的冲突。此外，很难调试和测试依赖于全局变量的代码。

1.7 什么是=== 运算符

===被称为严格等式运算符，当两个操作数具有相同的值而没有任何类型转换时，该运算符返回true。

let arr = '5'
let int = 5
console.log(arr == int)  // true
console.log(arr === int)  // false

1.8 如何使用JavaScript提交表单

<div id="box">
  <form action="http://www.baidu.com">
  </form>
  <button type="button" id="btn">JS提交表单</button>
</div>

<script>
    document.querySelector('#btn').addEventListener('click', () => {
      document.querySelector('form').submit()
    })
</script>

1.9 JavaScript如何改变元素的样式/类

行内样式

document.querySelector('#box p').style.color = 'red'

设置类

document.querySelector('#box p').className = 'p1'

1.10 JavaScript循环结构都有什么

for循环

for (let i = 0; i < 5; i++) {
  console.log(i)
}

while循环

let i = 0
while (i < 5) {
  if (i == 2) {
    break
  }
  i++
}
console.log(i)

do…while

let i = 0
  do {
    console.log('当前i的值为:' + i)
    i++
  } while (i <= 5)

1.11 3 +2 + ‘7’ 的结果是很么

console.log(3 + 2 + '7')  // 7

由于3和2是整数，它们将直接相加。由于7是一个字符串，它将会被直接连接，所以结果将是57。

1.12 JavaScript中有哪些类型的弹出框

alert('1')
confirm('1')
prompt('1')

1.13 如何强制页面加载JavaScript中的页面

  <script language="JavaScript" type="text/javascript">
    location.href = "http://baidu.com"
  </script>

1.14 escape字符是用来做什么的

使用特殊字符（如单引号，双引号，撇号和＆符号）时，将使用转义字符（反斜杠）。在字符前放置反斜杠，使其显示。

document.write("I \'m\ a \*boy\*")  // I 'm a *boy*

1.15 什么是JavaScript Cookie

Cookie是用来存储计算机中的小型测试文件，当用户访问网站以存储他们需要的信息时，它将被创建。

创建cookie

document.cookie = 'username' + '=' + 'web_chicken'

1.16 解释JavaScript中的pop()方法

pop()方法与shift()方法类似，但不同之处在于shift()方法在数组开头工作

pop()的方法将最后一个元素从给定的数组中删除

const arr = ['javascript', 'Vue', 'React', 'Element ui']
let res = arr.pop()
console.log(res)    // Element ui
console.log(arr)    // ["javascript", "Vue", "React"]

1.17 在JavaScript中使用innerHTML的缺点是什么

• 内容随处可见
• 不能像“追加到innerHTML”一样使用
• 即使你使用+ = like“innerHTML = innerHTML +‘html’”旧的内容仍然会被html替换
• 整个innerHTML内容被重新解析并构建成元素，因此它的速度要慢得多
• innerHTML不提供验证，因此可能会在文档中插入有效的和破坏性的HTML并将其中断

document.querySelector('p').innerHTML += '新添加的'

1.18 break和continue语句的作用

• break语句从当前循环中退出
• continue语句结束本次循环继续下一个循环语句

    for (var i = 0; i < 5; i++) {
      if (i === 2) break
        console.log(i)  //  0 1
    }

    for (var i = 0; i < 5; i++) {
      if (i === 2) continue
      	console.log(i) // 0 1 3 4
    }

1.19 在JavaScript中，data types的两个基本组是什么

• Primitive 原始类型
• Reference types 引用类型

原始类型是保存在栈内存中的简单的数据。基本类型的数据操作的是实际保存的值。

原始类型是数字和布尔数据类型。引用类型是更复杂的类型，如字符串和日期。

1.20 如何创建通用对象

 var I = new Object();