10 个最多见的 Javascript 问题

做者：Duomly
译者：前端小智
来源：dev

点赞再看，微信搜索【大迁世界】,B站关注【前端小智】这个没有大厂背景，但有着一股向上积极心态人。本文 GitHub https://github.com/qq44924588... 上已经收录，文章的已分类，也整理了不少个人文档，和教程资料。

为初学者介绍一下这 10 个最常被问到的 JavaScript 问题

在本文中，我收集了关于Javascript 最常被问到的 10 个问题及其答案。

这10 个问题大多涉及 Javascript 的基础知识，因此若是你刚刚开始学习 JS，最好理解并掌握它们并。

这个 10 问题涉及 JS 中闭包、promise，变量提高、类等等。尽管这些知识不是很难，可是知道答案是一件好事，由于其中一些常常在面试中会被问到。

Javascript 中的闭包是什么？

闭包是封闭在一块儿的函数的组合，其中内部函数能够访问其变量和外部函数的变量。

最简单的解释方法就是上例子：

function outer() {
  var name = 'Maria';
  function inner() {
    console.log(name);
  }
  inner();
}
outer();
// 'Maria'

在上面的代码中，你能够看到inner()函数能够访问其父函数变量name。 所以，若是调用outer()函数，那么inner()函数的console.log()将返回name的值Maria。

内部函数能够访问外部函数参数对象，可是内部函数参数与外部同样，则内部的参数对象会覆盖外部的参数对象。以下所示：

function outer(a, b) {
  const inner = (a, b) => console.log(a, b);
  inner(1, 2);
}
outer('Alice', 'Mark');
// returns 1, 2

咱们使用闭包的主要缘由是返回能够返回其余函数的函数。

Javascript中的 DOM 是什么

DOM 是文档对象模型，它是网站的面向对象的表示形，可使用 Javascript 进行修改。

使用 JS 能够操纵 DOM 元素，例如颜色，位置，大小。 为了选择页面的特定元素，Javascript 提供了一些方法：

• getElementById() - 经过id属性选择一个元素
• getElementsByName() - 经过name属性选择一个元素
• getElementsByTagName() - 选择所选标签的全部元素，
• getElementsbyClassName() - 选择特定类名的全部元素

*　querySelector()　-　经过CSS选择器选择元素。

Javascript　还提供了其余操做元素的方法，而不只仅是获取元素，好比appendChild()或innerHTML()。

Javascript 的 Promise 是什么

Promise 是异步编程的一种解决方案，能够替代传统的解决方案--回调函数和事件。ES6统一了用法，并原生提供了Promise对象。做为对象，Promise 有一下两个特色： （1）对象的状态不受外界影响。 （2）一旦状态改变了就不会在变，也就是说任什么时候候 Promise 都只有一种状态。

Promise 有三种状态，分别是：Pending （进行中）， Resolved (已完成)， Rejected (已失败)。Promise 从 Pending 状态开始，若是成功就转到成功态，并执行resolve回调函数；若是失败就转到失败状态并执行reject回调函数。

若是 Promise 被解析(resolved)，咱们能够调用then()方法并使用返回值执行操做。若是被拒绝(rejected)，咱们可使用catch()方法来处理错误。

处理异步编程的其余方法还有async/await和callbacks。

Javascript 中的原型是什么?

原型一般指的是prototype和__proto__这两个原型对象，其中前者叫作显式原型对象,后者叫作隐式原型对象。

Javascript对象从原型继承方法和属性，而Object.prototype在继承链的顶部。Javascript prototype关键字还能够用于向构造函数添加新值和方法。

来看看事例：

function Animal(name, kind, age) {
  this.name = name;
  this.kind = kind;
  this.age = age;
}

Animal.prototype.ownerName('Mark');

能够看到，经过使用原型，咱们可以将ownerName属性添加到Animal()构造函数中。

Javascript 的 变量提高 是什么

提高是一种机制，它将全部声明的变量和函数提高到它们局部做用域的顶部，若是变量和函数被放置在全局做用域，则会被提高到全局做用域的顶部。

Javascript中，能够在变量被使用后在声明它。

提高用于避免在变量或函数有在没有定义以前就执行致使的 undefined 错误。

name = 'Ted';
console.log(name);
var name;
// 'Ted'


var name;
name = 'Ted';
console.log(name);
// 'Ted';

使用 var 声明的变量，若是没有赋值，则默认会被初始化为 undefined, let 和 const 则不会。另外，须要注意的是，在声明const时，必须同时初始化它，由于后面不可在更改它。

Javascript中的对象是什么

对象只是一种特殊的数据。对象拥有属性和方法。JavaScript 中的全部事物都是对象，如:字符串、数值、数组、函数等。

对象的属性：反映该对象某些特定的性质的，如：字符串的长度、图像的长宽等；

对象的方法：可以在对象上执行的动做。例如，表单的“提交”(Submit)，时间的“获取”(getYear)等；

属性只是简单的值，而方法是能够在对象上执行的操做。

var student = {
  firstName: 'Alice',
  lastName: 'Jones',
  age: 21,
  sayHi: () => {
    return 'Hi, I am ' + this.firstName;
  }
}

在上面的代码中，你能够看到Student对象，其中包含三个属性和一个方法。

Javascript 中的函数是什么

在javascript中函数是一段能够被执行或调用任意次数的JavasScript代码,在数据类型中属于"function"。函数也拥有属性和方法，所以函数也是对象。

在Javascript中函数定义函数声明或函数表达式由关键字function开始。在定义函数时，能够在函数名后面的括号中添加一些参数。当咱们调用函数时，括号中传递的值称为参数。

function calculate(x, y) {
  return x * y;
}

calculate(2, 5);

Javascript中的纯函数是什么

若是函数的调用参数相同，则永远返回相同的结果。它不依赖于程序执行期间函数外部任何状态或数据的变化，必须只依赖于其输入参数。

顾名思义，纯函数跟咱们初中数学的基本函数同样，遵循必定的映射关系，输入决定输出，一个输入只能对应一个输出。不一样的输入能够有相同的输出，可是相同的输入不能有不一样的输出

一个函数，若是符合如下两个特色，那么它就能够称之为 纯函数：

• 对于相同的输入，永远获得相同的输出
• 没有任何可观察到的反作用

Javascript中的构造函数是什么

构造函数是一种特殊的方法，用于初始化和建立 Javascript 类中的对象。

JavaScript 中的构造函数和其它语言中的构造函数是不一样的。 经过 new 关键字方式调用的函数都被认为是构造函数。

在构造函数内部，this 指向新建立的对象 Object。 这个新建立的对象的 prototype 被指向到构造函数的 prototype。

若是被调用的函数没有显式的 return 表达式，则隐式的会返回 this 对象，也就是新建立的对象。

const Person = (name, age) => {
  this.name = name;
  this.age = age;
}

var man = new Person('Mark', 23);
console.log(man);
// { name: 'Mark', age: 23 }

在上面的代码中，我建立了一个Person构造函数，在下面的代码中，建立了一个名为man的新变量，并基于Person构造函数建立了一个新对象。

Javascript类是什么？

自从 ES6 引入以来，咱们能够在Javascript中使用类。 类是一种函数，咱们使用关键字class代替function 关键字来初始化它。

除此以外，咱们还必须在类内部添加constructor()方法，该方法在每次初始化类时都会调用。

在constructor()方法内部，咱们添加了类的属性。 要基于现有的类建立另外一个类，咱们可使用extends关键字。

在JavaScript中使用类的一个很好的例子是 React 框架，它是类的组件。

总结

在本文中，我收集了开发者常常问的 10 个Javascript问题，并给出答案，答案不是惟一，这里只是本身的一些看法，但愿本文能给初始化者带来一些帮助。

人才们的 【三连】 就是小智不断分享的最大动力，若是本篇博客有任何错误和建议，欢迎人才们留言，最后，谢谢你们的观看。

---

原文：https://dev.to/duomly/10-most...

代码部署后可能存在的BUG无法实时知道，过后为了解决这些BUG，花了大量的时间进行log 调试，这边顺便给你们推荐一个好用的BUG监控工具 Fundebug。

交流

文章每周持续更新，能够微信搜索「 大迁世界 」第一时间阅读和催更（比博客早一到两篇哟），本文 GitHub https://github.com/qq449245884/xiaozhi 已经收录，整理了不少个人文档，欢迎Star和完善，你们面试能够参照考点复习，另外关注公众号，后台回复福利，便可看到福利，你懂的。