判断javaScript变量是Ojbect类型还是Array类型

  JavaScript是弱类型的语言，所以对变量的类型并没有强制控制类型。所以声明的变量可能会成为其他类型的变量， 所以在使用中经常会去判断变量的实际类型。 对于一般的变量我们会使用typeof来判断变量类型。

  例如：在下面codesandbox中声明一个变量a，并赋值一个字符串'love you forever'，然后使用typeof可以获得指定变量的类型，可以在web-preview看到结果是String类型，再次向变量a赋值数字123，则判断的类型为number，我再次向变量a赋值一个对象和一个数组，下面的web-preview结果显示却都是object，what。这是为什么？

  所以去MDN查阅相关资料，MDN对于typeof的参数描述内容为"一个表示对象或原始值的表达式"以及对typeof可能返回值如下表：

类型	结果
Undefined	"undefined"
Null	"object"
Boolean	"boolean"
Number	"number"
String	"string"
Symbol(es6)	"symbol"
宿主对象（BOM和DOM）	取决于具体实现
Function	"function"
其他对象	"object"

  从表中似乎没有看到Array的字样，说明可能包含在其他对象，所以typeof不适合做array的判断。有没有其他的方式呢？查阅资料发现四种方法.

• 构造方法判断

  let numbers = [1, 2, 3, 4, 5]
  let isArray = numbers.construstor === Array ? 'yes' : 'no'
  console.log(isArray)

• 原型判断

  let numbers = [1, 2, 3, 4, 5]
  let isArray = Object.prototype.toString.call(numbers) === '[object Array]' ? 'yes' : 'no'
  console.log(isArray)

• instanceof判断

  let numbers = [1, 2, 3, 4, 5]
  let isArray = numbers instanceof Array ? 'yes' : 'no'
  c

• Array内置的isArray方法判断

  let numbers = [1, 2, 3, 4, 5]
  let isArray = Array.isArray(numbers) ? 'yes' : 'no'
  console.log(isArray)

  下面是用codesandbox执行的结果

不知不觉又爬过了一个坑。编码路上没有捷径，没有代码量的积累，就没有值得飞跃。感谢各位看到这里，希望大家在不断地努力下能早日实现自己的前端梦。

.ipad { min-width: 930px; max-width: 930px; min-height: 588px; max-height: 600px; margin-top: 1.5rem; margin-bottom: 1.5rem; border: 1px solid rgba(255, 192, 203, 1); border-radius: 15px; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2); display: flex; flex-direction: column; align-items: center; position: relative }
.ipad::before { content: ""; width: 8px; height: 8px; background-color: rgba(0, 0, 0, 1); border-radius: 50%; position: absolute; top: 0.5rem }
.content { margin-top: 1.6rem; margin-bottom: 2.5rem; width: 94%; border: 2px solid rgba(211, 173, 226, 1); border-radius: 3px; overflow: hidden }
.content iframe { margin-bottom: -9px }
{ width: 4px; height: 4px }
{ background-color: rgba(218, 154, 180, 1); border-radius: 4px }
.content:hover { overflow: auto }
.ipad::after { content: ""; width: 24px; height: 24px; background-color: rgba(255, 255, 255, 1); border: 3px solid rgba(255, 165, 0, 1); border-radius: 50%; position: absolute; bottom: 0.3rem }