JavaScript-----Array 对象 基础概念整理

数组属性

constructor

定义和用法

在JavaScript中,constructor属性返回对象的构造函数。

返回值是构造函数的引用,不是函数名:

JavaScript 数组 constructor 属性返回 function Array () { [ native code ] }

JavaScript 数字 constructor 属性返回 function Number () { [ native code ] }

JavaScript 字符串 constructor 属性返回 function String() { [ native code ] }

如果一个变量是数组你可以使用 constructor 属性来定义。

语法

array.constructor

实例

<p id="demo">点击按钮创建一个数组,并显示它的构造函数.=。</p>

<button onclick="myFunction()">点我</button>

<script>
function myFunction()
{
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    var x=document.getElementById("demo");
    x.innerHTML=fruits.constructor;
}
</script>

length

定义和用法

length 属性可设置或返回数组中元素的数目。

语法

//设置数组的数目
array.length=number
//Return the length of an array  返回一个数组的长度
array.length

实例

<p id="demo">点击按钮创建数组,并显示数组元素个数。</p>

<button onclick="myFunction()">点我</button>

<script>
function myFunction()
{
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x=document.getElementById("demo");
x.innerHTML=fruits.length;
}
</script>

prototype

定义和用法

prototype 属性可以向对象添加属性和方法。

当构建一个属性,所有的数组将被设置属性,它的默认值。

在构建一个方法时,所有的数组都可以使用该方法。

注意: Array.prototupe 单独不能引用数组,Array对象可以。

注意:在JavaScript对象中,Prototype是一个全局属性。

语法

Array.prototype.name=value

实例

<p id="demo">点击按钮创建数组,并调用新建的 ucase() 方法, 最后显示结果。</p>

<button onclick="myFunction()">点我</button>

<script>
Array.prototype.myUcase=function()
{
    for (i=0;i<this.length;i++)
    {
        this[i]=this[i].toUpperCase();
    }
}

function myFunction()
{
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    fruits.myUcase();
    var x=document.getElementById("demo");
    x.innerHTML=fruits;
}
</script>

Array对象属性

concat()

定义和用法

concat()方法用于连接两个或多个数组。

该方法不会改变现有数组,而仅仅会返回被连接数组的一个副本。

语法

array1.concat(array2,array3,...,arrayX)

实例

<script>
var hege = ["Cecilie", "Lone"];
var stale = ["Emil", "Tobias", "Linus"];
var children = hege.concat(stale);
document.write(children);
</script>

copyWithin()

定义和用法

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个位置中。

语法

array.copyWidthin(target,start,end)

//参数 描述
target 必需。复制到指定索引位置。
start 可选。元素复制的起始位置。
end 可选。停止复制的索引位置(默认为 array.length)。如果为负值,表示倒数。

//技术细节
JavaScript版本: ECMAScript 6

实例

<p>点击按钮复制数组的前面两个元素到第三和第四个位置上。</p>

<button onclick="myFunction()">点我</button>

<p id="demo"></p>

<p><strong>注意:</strong> IE 11 及更早版本不支持 copyWithin() 方法。</p>
    
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"];
document.getElementById("demo").innerHTML = fruits;

function myFunction() {  
    document.getElementById("demo").innerHTML = fruits.copyWithin(2,0,2);
}
</script>

entries()

定义和用法

entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对(key/value)。

迭代对象中数组的索引值为 Key,数组元素作为 value。

语法

array,entries()

//技术细节
JavaScript 版本: ECMAScript 6

实例

<h1>Array entries()</h1>

<p>从数组中创建一个可迭代的对象。</p>

<p>迭代对象的每个实体来自数组对应的元素。</p>

<p id="demo1"></p>
<p id="demo2"></p>
<p id="demo3"></p>
<p><strong>注意:</strong> IE11 及其更早的浏览器版本不支持 entries 方法。</p>

<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.entries();

document.getElementById("demo1").innerHTML = x.next().value;
document.getElementById("demo2").innerHTML = x.next().value;
document.getElementById("demo3").innerHTML = x.next().value;
</script>

every()

定义和用法

every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。

every() 方法使用指定函数检测数组中的所有元素:

  • 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
  • 如果所有元素都满足条件,则返回 true。

注意: every() 不会对空数组进行检测。

注意: every() 不会改变原始数组。

语法

array.every(function(currentValue,index,arr), thisValue)

//参数 描述

function(currentValue,index,arr) 必须。函数,数组中的每个元素都会执行这个函数
      
                       函数参数:
                       
                       参数 描述
                       currentValue 必须、当前元素的值。
                       index 可选。当前元素的索引值
                       arr     可选。当前元素属于的数组对象

thisValue 可选。对象作为该执行回调时使用,传递给函数,用作“this”的值。如果省略了thisValue , "this" 的值为 “undefined”

//技术细节

返回值: 布尔值。如果所有元素都通过检测返回true,否则返回false。

JavaScript版本:      1.6

实例

<p>点击按钮检测数组的所有元素是否都大于输入框中指定的数字。</p>
<p>最小年龄: <input type="number" id="ageToCheck" value="18"></p>
<button onclick="myFunction()">点我</button>
<p>是否所有年龄都符号条件? <span id="demo"></span></p>
<script>
var ages = [32, 33, 12, 40];
function checkAdult(age) {
    return age >= document.getElementById("ageToCheck").value;
}
function myFunction() {
    document.getElementById("demo").innerHTML = ages.every(checkAdult);
}
</script>

fill()

定义和用法

语法

实例

filter()

定义和用法

语法

实例

find()

定义和用法

语法

实例

findIndex()

定义和用法

语法

实例

forEach()

定义和用法

语法

实例

from()

定义和用法

语法

实例

includes()

定义和用法

语法

实例

indexOf()

定义和用法

语法

实例

isArray()

定义和用法

语法

实例

join()

定义和用法

语法

实例

keys()

定义和用法

语法

实例

lastIndexOf()

定义和用法

语法

实例

map()

定义和用法

语法

实例

pop()

定义和用法

语法

实例

push()

定义和用法

语法

实例

reduce()

定义和用法

语法

实例

reduceRight()

定义和用法

语法

实例

reverse()

定义和用法

语法

实例

shift()

定义和用法

语法

实例

slice()

定义和用法

语法

实例

some()

定义和用法

语法

实例

sort()

定义和用法

语法

实例

splice()

定义和用法

语法

实例

toString()

定义和用法

语法

实例

unshift()

定义和用法

语法

实例

valueOf()

定义和用法

语法

实例

猜你喜欢

转载自www.cnblogs.com/Millet-23/p/9392207.html