Array和Array.prototype的区别以及方法和属性的不同

Array和Array.prototype的区别以及方法和属性的不同

前言

　　在学习JavaScript的过程中，我们会学到很多的方法和属性，如数组的 join方法，slice方法等等很多，但是是否有认真的思考和理解过一个问题，我们平常说的什么数组的方法，字符串的方法，数值的方法，在我们平常使用这些方法的时候，都是通过如 Array、String、Number 这些构造函数创建出它们对应的实例对象，然后再通过对象来使用这些方法。为什么不能直接以 Array.join() 的方式来使用呢？为什么数组对象的方法对 Array 这个构造函数本身不适用呢？我们平常用的数组的方法，真的是数组这个构造函数本身的方法吗？

　　所以，我想就此来总结一下JS内置的构造函数如 Array、Object 等和它们的原型（Array.prototype）的区别以及它们的方法和属性的不同。

 

Array 和 Array.prototype 的区别

　　Array 是 JS 内置的构造函数（内置对象），通俗地讲，它是创建数组的构造函数，它的本质是函数，所以它不是一个数组

　　Array.prototype 是 Array的一个属性，叫做原型，这个原型的值是一个对象，对象里面保存着数组对象的方法和属性。

 

JS内置的对象（构造函数）

　　String、Number、Boolean、Array、Object、Function 等等都是 JS 内置的构造函数。在 JS 中，由于一切皆接对象，所以它们也可以称为内置对象。

　　由于构造函数的特点，它们可以通过 new 关键字来创建对应的实例对象。所以创建出来的实例对象都有构造函数原型的属性和方法。

 

　　为什么不能 Array.join(），因为Array 不是一个数组对象，它是一个全局对象，一个构造函数，它本身并没有 join（）方法，而 join、slice、sort 等等相关的方法都是保存在 Array.prototype 这个属性值中的

　　下面，我们来看看实例

　　Object.getOwnPropertyNames(obj) 方法 返回一个由指定对象的所有自身属性的属性名（包括不可枚举属性但不包括Symbol值作为名称的属性）组成的数组
　　var res = Object.getOwnPropertyNames(Array)

　　console.log(res)　　//　["length", "name", "prototype", "isArray", "from", "of"]

　　var res1 = Object.getOwnPropertyNames(Array.prototype)

　　console.log(res1)　　//　 ["length", "constructor", "concat", "copyWithin", "fill", "find", "findIndex", "lastIndexOf", "pop", "push", "reverse", "shift", "unshift", "slice", "sort", "splice", "includes", "indexOf", "join", "keys", "entries", "values", "forEach", "filter", "flat", "flatMap", "map", "every", "some", "reduce", "reduceRight", "toLocaleString", "toString"]

 

　　根据上面的实例，我们可以看出

　　　　数组实例对象的所有方法都来自于 Array.prototype，而 Array 对象只有属性 length、name、prototype 和 方法 isArray、from、of。这些属性和方法才是 Array 对象（这个构造函数）自身的方法。

 

总结：

　　正确区分JS内置对象（构造函数）和它们对应的实例对象。

　　正确区分 String、Number、Boolean、Array、Object、Function 这些构造函数本身的属性和方法与它们对应的原型（prototype）的属性和方法！