興味深いJavaScriptオリジナル配列関数
7416 ワード
JavaScriptでは、配列を作成するには、Aray構造関数を使用するか、配列の直接量を使用することができ、後者は優先的な方法である.ArayオブジェクトはObject.prototypeから継承され、配列に対してtypeofオペレータを実行し、アラーではなくobjectに戻る.しかし、[]instance of Arayもtrueに戻る.つまり、クラス配列オブジェクトの実装はより複雑であり、例えば、stingsオブジェクト、argmentsオブジェクト、argmentsオブジェクトはArayの例ではないが、length属性があり、インデックスによって値を取ることができるので、配列のように循環動作することができる.
本論文では,いくつかの配列プロトタイプの方法を復習し,これらの方法の使い方を探求する.サイクル:forEach 判断:someと.every 区分.joinと.concat スタックとキューの実現:.pop,push,shift,および.unshift モデルマッピング:map クエリ:filter 並べ替え:sort 計算:reduceと.reduceRight コピー:slice パワフル.splice 検索:indexOf オペレータ:in 接近.reverse サイクル:forEach
これはJavaScriptの中で最も簡単な方法ですが、IE 7とIE 8はこの方法をサポートしていません.
forEachパラメータとしてのフィードバック関数があります.配列を巡回すると、各配列要素はそれを呼び出します.コールバック関数は3つのパラメータを受け入れます. value:現在の要素 index:現在の要素のインデックス array:エルゴード配列 さらに、各関数として呼び出されるコンテキスト(this)として、オプションの第2のパラメータを渡すことができる.
中断できません.forEachサイクルで、異常を出すのも賢明ではありません.幸いなことに、私たちは別の方法で操作を中断します.
判断:someと.every
NETの中の列挙を使ったことがあるならば、この2つの方法は.Any(x=>x.IsAwesome)、All(x=>x.IsAwesome)と似ています.forEachのパラメータと同様に、value、index、arrayの3つのパラメータを含むコールバック関数が必要であり、オプションの第2のコンテキストパラメータもある.MDNペア.someの説明は以下の通りです.
そして、配列内の各要素に対して、チューニング関数がtrueに戻るまでの間、一回のコールバック関数を実行します.ターゲット要素を見つけたら、すぐにtrueに戻ります.そうでなければ、falseに戻ります.コールバック関数は、指定された値の配列インデックスに対してのみ実行されます.削除された要素または指定されていない要素には呼び出しません.
ジョンと.concatを区別する.
ジョインと.concatはよく混同します.join(separator)はセパレータを区切り記号として配列要素をつづり、文字列形式に戻ります.separatorが提供されていない場合は、デフォルトで使用されます.concatはソース配列の浅いコピーとして新しい配列を作成します..concat一般的な使い方:array.co ncat(val,val 2,val 3,valn) .concatは新しい配列 を返します. array.co ncat()は、パラメータなしでソース配列の浅いコピーを返す. 浅いコピーは、新しい配列と元の配列が同じオブジェクト参照を維持することを意味し、これは通常よいことである.たとえば:
みんな知っています.pushはもう配列の最後に元素を追加してもいいですが、[].push(‘a’,‘b’,‘c’,‘d’,‘z’)を使って一度に複数の元素を追加してもいいですか?
pop方法は.pushの逆動作で、削除された配列の最後の要素を返します.配列が空であれば、void 0(undefined)に戻り、使用してpopと.pushはLIFOスタックを作成することができる.
mapは、配列内の各要素に対してフィードバック方法を提供し、呼び出し結果からなる新しい配列を返します.コールバック関数は、指定された値の配列インデックスに対してのみ実行されます.削除された要素または指定されていない要素には呼び出しません.
Aray.prototype.mapと前述の.forEach、.someと.everyは同じパラメータフォーマットがあります.map(value、index、array)、thisAgment)
filterは、各配列要素に対して一回のコールバック関数を実行し、リセット関数によってtrueの要素からなる新しい配列を返します.コールバック関数は、指定された値の配列項目のみを呼び出します.
filter(fn(value,index,array)、thisAgment)は、C((zhi)のLINE表現とSQLのwhere文と類似しています.filterは、コールバック関数でtrue値の要素だけを返します.
compreFunctionが提供されていない場合、要素は文字列に変換され、辞書に従って並べ替えられます.例えば、「80」は「9」より前で、その後ではない.
ほとんどの並べ替え関数と同様に、Aray.prototype.sort(fn(a,b)は、2つのテストパラメータを含むコールバック関数が必要で、その戻り値は以下の通りである. aは、bより前の値が0 より小さい. aとbが等しい場合、戻り値は0 である. aは、bの後、戻り値が0 より小さい.
この二つの関数は分かりにくいです.reduceは左から右へ配列を遍歴します.reduceRightは右から左へ配列を遍歴します.二つの典型的な使い方はreduceです.
previous Valueは最終的にコールバック関数の戻り値であり、initial Valueはその初期値であり、currentValueは現在の要素値であり、indexは現在の要素インデックスであり、arrayは呼び出し・reduceの配列である.
典型的な用例として、reduceの求和関数を使用する.
concatと同様に、パラメータなしのsliceを呼び出す方法はソース配列の浅いコピーを返します.sliceには二つのパラメータがあります.一つは開始位置と終了位置です.Aray.prototype.sliceは、クラスの配列オブジェクトを本物の配列に変換するために使用されます.
spliceは私の一番好きな原生配列関数です.一回だけ呼んで、元素を削除し、新しい要素を挿入し、同時に削除、挿入操作ができます.注意したいのは、`concatと.sliceとは違って、この関数はソース配列を変えます.
indexOfを利用して、配列の中で1つの要素の位置を探すことができます.整合要素がない場合は-1を返します.私はよく使います.indexOfの場合は、比較がある場合、例えば、a========a'||a===b'𞓜a====c'だけ、または二つの比較がある場合に使用できます.indexOf:',b',c'.indexOf(=a=)!1です
なお、提供された参照が同じであれば、indexOfもオブジェクトを検索することができる.第二のオプションパラメータは、検索を開始する位置を指定します.
操作子:in
面接では初心者が犯しやすいミスは紛らわしいです.indexOfとin操作子:
この方法は配列中の要素を逆さまにする.
転載元:http://www.codeceo.com
本論文では,いくつかの配列プロトタイプの方法を復習し,これらの方法の使い方を探求する.
これはJavaScriptの中で最も簡単な方法ですが、IE 7とIE 8はこの方法をサポートしていません.
forEachパラメータとしてのフィードバック関数があります.配列を巡回すると、各配列要素はそれを呼び出します.コールバック関数は3つのパラメータを受け入れます.
['_', 't', 'a', 'n', 'i', 'f', ']'].forEach(function (value, index, array) {
this.push(String.fromCharCode(value.charCodeAt() + index + 2))
}, out = [])
out.join('')
//
後に言及します.joinは、この例では、配列内の異なる要素をつなぎ合わせて使用します.効果はout[0]+"+out[1]+"+out[2]+"+out[n]に似ています.中断できません.forEachサイクルで、異常を出すのも賢明ではありません.幸いなことに、私たちは別の方法で操作を中断します.
判断:someと.every
NETの中の列挙を使ったことがあるならば、この2つの方法は.Any(x=>x.IsAwesome)、All(x=>x.IsAwesome)と似ています.forEachのパラメータと同様に、value、index、arrayの3つのパラメータを含むコールバック関数が必要であり、オプションの第2のコンテキストパラメータもある.MDNペア.someの説明は以下の通りです.
そして、配列内の各要素に対して、チューニング関数がtrueに戻るまでの間、一回のコールバック関数を実行します.ターゲット要素を見つけたら、すぐにtrueに戻ります.そうでなければ、falseに戻ります.コールバック関数は、指定された値の配列インデックスに対してのみ実行されます.削除された要素または指定されていない要素には呼び出しません.
max = -Infinity
satisfied = [10, 12, 10, 8, 5, 23].some(function (value, index, array) {
if (value > max) max = value
return value < 10
})
console.log(max)
//
なお、コールバック関数のvalue<10の場合は、関数サイクルを中断します.everyの運行原理は.someと似ていますが、コールバック関数はtrueではなくfalseに戻ります.ジョンと.concatを区別する.
ジョインと.concatはよく混同します.join(separator)はセパレータを区切り記号として配列要素をつづり、文字列形式に戻ります.separatorが提供されていない場合は、デフォルトで使用されます.concatはソース配列の浅いコピーとして新しい配列を作成します.
var a = { foo: 'bar' }
var b = [1, 2, 3, a]
var c = b.concat()
console.log(b === c)
//
スタックとキューの実現:pop,push,shiftと.unshiftみんな知っています.pushはもう配列の最後に元素を追加してもいいですが、[].push(‘a’,‘b’,‘c’,‘d’,‘z’)を使って一度に複数の元素を追加してもいいですか?
pop方法は.pushの逆動作で、削除された配列の最後の要素を返します.配列が空であれば、void 0(undefined)に戻り、使用してpopと.pushはLIFOスタックを作成することができる.
function Stack () {
this._stack = []
}
Stack.prototype.next = function () {
return this._stack.pop()
}
Stack.prototype.add = function () {
return this._stack.push.apply(this._stack, arguments)
}
stack = new Stack()
stack.add(1,2,3)
stack.next()
//
モデルマップ:mapmapは、配列内の各要素に対してフィードバック方法を提供し、呼び出し結果からなる新しい配列を返します.コールバック関数は、指定された値の配列インデックスに対してのみ実行されます.削除された要素または指定されていない要素には呼び出しません.
Aray.prototype.mapと前述の.forEach、.someと.everyは同じパラメータフォーマットがあります.map(value、index、array)、thisAgment)
values = [void 0, null, false, '']
values[7] = void 0
result = values.map(function(value, index, array){
console.log(value)
return value
})
//
undefined× 3よく説明しました.mapは削除されたまたは指定されていない値の要素に対して呼び出すことはできませんが、結果の配列には依然として含まれます.mapは、配列を作成または変更する際に非常に有用であり、以下の例を参照してください.// casting
[1, '2', '30', '9'].map(function (value) {
return parseInt(value, 10)
})
// 1, 2, 30, 9
[97, 119, 101, 115, 111, 109, 101].map(String.fromCharCode).join('')
//
お問い合わせ:filterfilterは、各配列要素に対して一回のコールバック関数を実行し、リセット関数によってtrueの要素からなる新しい配列を返します.コールバック関数は、指定された値の配列項目のみを呼び出します.
filter(fn(value,index,array)、thisAgment)は、C((zhi)のLINE表現とSQLのwhere文と類似しています.filterは、コールバック関数でtrue値の要素だけを返します.
[void 0, null, false, '', 1].filter(function (value) {
return value
})
//
並べ替え:sort(compreFunction)compreFunctionが提供されていない場合、要素は文字列に変換され、辞書に従って並べ替えられます.例えば、「80」は「9」より前で、その後ではない.
ほとんどの並べ替え関数と同様に、Aray.prototype.sort(fn(a,b)は、2つのテストパラメータを含むコールバック関数が必要で、その戻り値は以下の通りである.
[9,80,3,10,5,6].sort()
//
計算:.reduceと.reduceRightこの二つの関数は分かりにくいです.reduceは左から右へ配列を遍歴します.reduceRightは右から左へ配列を遍歴します.二つの典型的な使い方はreduceです.
previous Valueは最終的にコールバック関数の戻り値であり、initial Valueはその初期値であり、currentValueは現在の要素値であり、indexは現在の要素インデックスであり、arrayは呼び出し・reduceの配列である.
典型的な用例として、reduceの求和関数を使用する.
Array.prototype.sum = function () {
return this.reduce(function (partial, value) {
return partial + value
}, 0)
};
[3,4,5,6,10].sum()
//
配列を文字列につなぎたいなら、ジョインで実現できます.しかし、配列値が対象であれば、ジョインは私たちの期待通りに値を返しません.対象が合理的なvalueOfまたはtostring方法がある場合を除いて、この場合には使用できます.function concat (input) {
return input.reduce(function (partial, value) {
if (partial) {
partial += ', '
}
return partial + value
}, '')
}
concat([
{ name: 'George' },
{ name: 'Sam' },
{ name: 'Pear' }
])
//
コピー:sliceconcatと同様に、パラメータなしのsliceを呼び出す方法はソース配列の浅いコピーを返します.sliceには二つのパラメータがあります.一つは開始位置と終了位置です.Aray.prototype.sliceは、クラスの配列オブジェクトを本物の配列に変換するために使用されます.
Array.prototype.slice.call({ 0: 'a', 1: 'b', length: 2 })
//
また、sliceのもう一つの一般的な使い方は一つのパラメータリストから一部の要素を削除することであり、これはクラスの配列オブジェクトを本物の配列に変換することができる.function format (text, bold) {
if (bold) {
text = '' + text + ''
}
var values = Array.prototype.slice.call(arguments, 2)
values.forEach(function (value) {
text = text.replace('%s', value)
})
return text
}
format('some%sthing%s %s', true, 'some', 'other', 'things')
パワフルspliceは私の一番好きな原生配列関数です.一回だけ呼んで、元素を削除し、新しい要素を挿入し、同時に削除、挿入操作ができます.注意したいのは、`concatと.sliceとは違って、この関数はソース配列を変えます.
var source = [1,2,3,8,8,8,8,8,9,10,11,12,13]
var spliced = source.splice(3, 4, 4, 5, 6, 7)
console.log(source)
//
ご覧のように、spliceは削除された要素を返します.削除された配列を遍歴したいなら、これはとても便利です.var source = [1,2,3,8,8,8,8,8,9,10,11,12,13]
var spliced = source.splice(9)
spliced.forEach(function (value) {
console.log('removed', value)
})
//
検索:indexOfindexOfを利用して、配列の中で1つの要素の位置を探すことができます.整合要素がない場合は-1を返します.私はよく使います.indexOfの場合は、比較がある場合、例えば、a========a'||a===b'𞓜a====c'だけ、または二つの比較がある場合に使用できます.indexOf:',b',c'.indexOf(=a=)!1です
なお、提供された参照が同じであれば、indexOfもオブジェクトを検索することができる.第二のオプションパラメータは、検索を開始する位置を指定します.
var a = { foo: 'bar' }
var b = [a, 2]
console.log(b.indexOf(1))
//
後ろから前に検索したいなら、使います.lastIndexOf.操作子:in
面接では初心者が犯しやすいミスは紛らわしいです.indexOfとin操作子:
var a = [1, 2, 5]
1 in a
//
問題は、in操作子は、値ではなく検索対象のキーです.もちろん、これは性能的にはindexOfよりずっと速いです.var a = [3, 7, 6]
1 in a === !!a[1]
//
近付くこの方法は配列中の要素を逆さまにする.
var a = [1, 1, 7, 8]
a.reverse()
// [8, 7, 1, 1]
reverseは配列自体を変更します.転載元:http://www.codeceo.com