CoffeeScript - 推導式



在上一章中,我們學習了 CoffeeScript 提供的各種迴圈,while 及其變體。除此之外,CoffeeScript 還提供了額外的迴圈結構,稱為推導式

如果我們新增可選的保護子句並顯式地指定當前陣列索引的值,這些推導式將替換其他程式語言中的for迴圈。使用推導式,我們可以迭代陣列和物件,迭代陣列的推導式是表示式,我們可以將其在函式中返回或賦值給變數。

序號 語句和描述
1 for..in 推導式

for..in 推導式是 CoffeeScript 中推導式的基本形式,我們可以用它來迭代列表或陣列的元素。

2 for..of 推導式

就像陣列一樣,CoffeeScript 提供了用於儲存鍵值對的容器,稱為物件。我們可以使用 CoffeeScript 提供的for..of 推導式來迭代物件。

3 列表推導式

CoffeeScript 中的列表推導式用於將物件陣列對映到另一個數組。

索引推導式

元素列表/陣列具有一個索引,可以在推導式中使用。您可以像下面所示那樣在推導式中使用變數。

for student,i in [element1, element2, element3]

示例

以下示例演示了在 CoffeeScript 中使用for…in 推導式索引的方法。將此程式碼儲存在名為for_in_index.coffee的檔案中。

for student,i in ['Ram', 'Mohammed', 'John']
   console.log "The name of the student with id "+i+" is: "+student 

開啟命令提示符並編譯 .coffee 檔案,如下所示。

c:\> coffee -c for_in_index.coffee

編譯後,它會生成以下 JavaScript 程式碼。

// Generated by CoffeeScript 1.10.0
(function() {
  var i, j, len, ref, student;

  ref = ['Ram', 'Mohammed', 'John'];
  for (i = j = 0, len = ref.length; j < len; i = ++j) {
    student = ref[i];
    console.log("The name of the student with id " + i + " is: " + student);
  }
}).call(this);

現在,再次開啟命令提示符並執行 CoffeeScript 檔案,如下所示。

c:\> coffee for_in_index.coffee

執行後,CoffeeScript 檔案會產生以下輸出。

The name of the student with id 0 is: Ram
The name of the student with id 1 is: Mohammed
The name of the student with id 2 is: John 

推導式的字尾形式

就像字尾ifunless一樣,CoffeeScript 提供了推導式的字尾形式,這在編寫程式碼時非常方便。使用它,我們可以將for..in 推導式寫成一行,如下所示。

#Postfix for..in comprehension
console.log student for student in ['Ram', 'Mohammed', 'John']

#postfix for..of comprehension
console.log key+"::"+value for key,value of { name: "Mohammed", age: 24, phone: 9848022338}
顯示示例

賦值給變數

我們用來迭代陣列的推導式可以賦值給變數,也可以由函式返回。

示例

考慮以下示例。在這裡,您可以看到我們使用for..in 推導式檢索了陣列的元素,並將其賦值給名為names的變數。我們還有一個函式,它使用return關鍵字顯式地返回一個推導式。將此程式碼儲存在名為example.coffee的檔案中。

my_function =->
   student = ['Ram', 'Mohammed', 'John']
   
   #Assigning comprehension to a variable
   names = (x for x in student )
   console.log "The contents of the variable names are ::"+names
   
   #Returning the comprehension
   return x for x in student
console.log "The value returned by the function is "+my_function() 

開啟命令提示符並編譯 .coffee 檔案,如下所示。

c:\> coffee -c example.coffee

編譯後,它會生成以下 JavaScript 程式碼。

// Generated by CoffeeScript 1.10.0
(function() {
  var my_function;

  my_function = function() {
    var i, len, names, student, x;
    student = ['Ram', 'Mohammed', 'John'];
    names = (function() {
      var i, len, results;
      results = [];
      for (i = 0, len = student.length; i < len; i++) {
        x = student[i];
        results.push(x);
      }
      return results;
    })();
    console.log("The contents of the variable names are ::" + names);
    for (i = 0, len = student.length; i < len; i++) {
      x = student[i];
      return x;
    }
  };

  console.log("The value returned by the function is " + my_function());

}).call(this);

現在,再次開啟命令提示符並執行 CoffeeScript 檔案,如下所示。

c:\> coffee example.coffee

執行後,CoffeeScript 檔案會產生以下輸出。

The contents of the variable names are ::Ram,Mohammed,John
The value returned by the function is Ram 

by 關鍵字

CoffeeScript 提供範圍來定義元素列表。例如,範圍 [1..10] 等效於 [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],其中每個元素都遞增 1。我們也可以使用推導式的by關鍵字來更改此增量。

示例

以下示例演示了 CoffeeScript 提供的for..in 推導式的by關鍵字的使用方法。將此程式碼儲存在名為by_keyword_example.coffee的檔案中。

array = (num for num in [1..10] by 2)
console.log array

開啟命令提示符並編譯 .coffee 檔案,如下所示。

c:\> coffee -c by_keyword_example.coffee

編譯後,它會生成以下 JavaScript 程式碼。

// Generated by CoffeeScript 1.10.0
(function() {
  var array, num;

  array = (function() {
    var i, results;
    results = [];
    for (num = i = 1; i <= 10; num = i += 2) {
      results.push(num);
    }
    return results;
  })();

  console.log(array);

}).call(this);

現在,再次開啟命令提示符並執行 CoffeeScript 檔案,如下所示。

c:\> coffee by_keyword_example.coffee

執行後,CoffeeScript 檔案會產生以下輸出。

[ 1, 3, 5, 7, 9 ] 
廣告
© . All rights reserved.