JavaScript相關函數的解說

在JavaScript的學習中有些常出現的函數，本篇就會詳解一部分函數。

.map

map 方法會迭代陣列中的每一個元素，並根據回呼函數來處理每一個元素，最後傳回一個新陣列。

用 map 方法來為 oldArray 中的每一項增加3，並且在 newArray 中保存它們。 oldArray 不應該被改變。

var oldArray = [1,2,3,4,5];var newArray = oldArray.map(function(val){  return val + 3;  });
.reduce

陣列中的元素進行運算 從左到右 依序進行 剩下最後一個元素為return值
其中 上次進行結果的累計值(previousVal) 和目前值 (currentVal）。

var array = [4,5,6,7,8];var singleVal = 0;singleVal = array.reduce(function(previousVal, currentVal){ return previousVal + currentVal;   });
.filter

filter 方法用來迭代一個數組，並且按給出的條件過濾出符合的元素。

用 filter 建立一個新數組，新數組的值是 oldArray 中值小於6的元素。不允許改變原數組 oldArray

var oldArray = [1,2,3,4,5,6,7,8,9,10];var newArray = oldArray.filter(function(val){    return val<6;   });
.sort

sort 方法將改變原始數組，並傳回被排序後的數組。 sort 可以把比較函數當作參數傳入。比較函數有回傳值，當 a 小於 b，回傳一個負數；當 a 大於 b ，傳回一個正數；相等時傳回0。如果沒有傳入比較函數，它將把值全部轉成字串，並按照字母順序進行排序。

用 sort 依照從小到大的順序排序 array 。

var array = [1, 12, 21, 2];array.sort(function(a, b) {  return a - b;});result: [1,2,12,21]
.reverse

用 reverse 來翻轉 array 陣列。並賦值給 newArray.

var array = [1,2,3,4,5,6,7];var newArray = [];newArray = array.reverse();
reverse_result.png
.concat

concat 方法的參數應該是一個陣列。參數中的陣列會拼接在原數組的後面，並作為一個新數組傳回。

用 .concat() 將 concatMe 拼接到 oldArray 後面，並且賦值給 newArray。

concat_result.png
.split

你可以使用 split 方法以指定分隔符號將字串分割為陣列。給 split 方法傳遞一個參數，這個參數將會作為一個分隔符號。

用 split 方法來把字串 string 分割成陣列 array。

無分隔符號。

<script type="text/javascript">
    var str="How are you doing today?";    var n=str.split();    document.write(n);</script>输出：
How are you doing today?

將字串的每個字元都分開。

   var str="How are you doing today?";    var n=str.split("");    document.write(n);</script>输出：
H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?

以字元 “o” 將字串分隔。 > ;輸出：

H,w are y,u d,ing t,day?
.join

join 方法來把陣列轉換成字串，裡面的每一個元素可以用你指定的連接符號來連接起來，這個連接符號就是你要傳入的參數。

用join 方法，連接符為' '把數組joinMe 轉化成字符串joinedString.

var veggies = ["Celery", "Radish", "Carrot", "Potato"];var salad = veggies.join(" and ");console.log(salad); // "Celery and Radish and Carrot and Potato" 
.replace

將替換

本篇詳細的講解一些常見的函數，更多相關知識請關注php中文網。

相關推薦：

關於jquery DOM&事件的解說

一些相關的模組化基礎

dom物件的innerText和innerHTML有什麼差別？

#

以上是JavaScript相關函數的解說的詳細內容。更多資訊請關注PHP中文網其他相關文章！