CoffeeScript - 範圍

上一頁
下一頁

在上一章中，我們已經看到了 CoffeeScript 中的陣列，在程式設計過程中，我們會遇到一些需要在陣列中儲存一系列數值的情況，如下所示。

numbers =[1,2,3,4,5,6,7,8,9,10]

CoffeeScript 提供了一種更簡潔的方式來表達包含一系列數值的陣列，稱為 **範圍**。CoffeeScript 的此功能受到 Ruby 的啟發。

語法

範圍由兩個數值建立，即範圍的第一個和最後一個位置，用 .. 或 ... 分隔。用兩個點 (1..4)，範圍是包含的 (1, 2, 3, 4)；用三個點 (1...4)，範圍不包括結束 (1, 2, 3)。

以下是 CoffeeScript 中範圍的語法。我們將像陣列一樣在方括號 **[ ]** 中定義範圍內的值。在範圍內，儲存一系列數值時，無需提供整個序列的值，只需指定其 **開始** 和 **結束** 值，並用兩個點 (**..**) 分隔，如下所示。

range =[Begin..End]

示例

以下是在 CoffeeScript 中使用範圍的示例。將此程式碼儲存在名為 **ranges_example.coffee** 的檔案中。

numbers =[0..9]
console.log "The contents of the range are: "+ numbers

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

c:\> coffee -c ranges_example.coffee

編譯後，它會生成以下 JavaScript 程式碼。在這裡，您可以觀察到範圍被轉換為完整的 CoffeeScript 陣列。

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

  numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];

  console.log("The contents of the range are:: " + numbers);

}).call(this);

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

c:\> coffee ranges_example.coffee

執行後，CoffeeScript 檔案會生成以下輸出。

The contents of the range are:: 0,1,2,3,4,5,6,7,8,9

排除結束值

範圍被編譯成包含所有數字的完整陣列。如果我們想排除 **結束** 值，則必須使用三個點 (**...**) 分隔範圍的 **開始** 和 **結束** 元素，如下所示。

range =[Begin...End]

示例

我們可以透過排除 **結束** 值來重寫上述示例，如下所示。將以下內容儲存到名為 **range_excluding_end.coffee** 的檔案中

numbers =[0...9]
console.log "The contents of the range are:: "+ numbers

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

c:\> coffee -c ranges_example.coffee

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

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

  numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8];

  console.log("The contents of the range are:: " + numbers);

}).call(this);

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

c:\> coffee ranges_example.coffee

執行後，CoffeeScript 檔案會生成以下輸出。在這裡，您可以觀察到結束值 **9** 被排除了。

The contents of the range are:: 0,1,2,3,4,5,6,7,8

將範圍與變數一起使用

我們還可以透過將開始值和結束值分配給變數來定義範圍。

示例

考慮以下示例。在這裡，我們使用變數定義了一個範圍。將此程式碼儲存在名為 **range_variables.coffee** 的檔案中

start=0
end=9
numbers =[start..end]
console.log "The contents of the range are: "+ numbers

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

c:\> coffee -c range_variables.coffee

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

// Generated by CoffeeScript 1.10.0
(function() {
  var end, i, numbers, results, start;

  start = 0;

  end = 9;

  numbers = (function() {
    results = [];
    for (var i = start; start <= end ? i <= end : i >= end; start <= end ? i++ : i--) {
      results.push(i);
    }
    return results;
  }).apply(this);

  console.log("The contents of the range are:: " + numbers);

}).call(this);

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

c:\> coffee range_variables.coffee

執行後，CoffeeScript 檔案會生成以下輸出。在這裡，您可以觀察到結束值 **9** 被排除了。

The contents of the range are:: 0,1,2,3,4,5,6,7,8,9

帶有陣列的範圍

我們可以使用範圍來切片陣列。每當我們在陣列（變數）之後立即指定範圍時，CoffeeScript 編譯器就會將其轉換為 JavaScript 的 **slice()** 方法呼叫。

假設我們有一個包含數值的陣列，例如 0 到 9，那麼我們可以檢索其前 4 個元素，如下所示。

num  = [1, 2, 3, 4, 5, 6, 7, 8, 9]
data = num[0..5]

負值表示從末尾開始的元素，例如，-1 表示 9。如果我們指定一個負數 3 後跟兩個點，則將提取陣列的最後三個元素。

data = num[-3..]

如果我們在陣列的範圍內只指定兩個點，如 **num[..]**，則將提取整個陣列。我們還可以使用範圍將陣列段替換為其他元素，如下所示。

num[2..6] = [13,14,15,16,17]

示例

以下示例演示了將範圍與陣列一起使用的用法。將此程式碼儲存在名為 **range_arrays.coffee** 的檔案中

#slicing an array using ranges
num  = [1, 2, 3, 4, 5, 6, 7, 8, 9]
data = num[0..5]
console.log "The first four elements of the array : "+data


#Using negative values
data = num[-3..]
console.log "The last 3 elements of the array : "+data

#Extracting the whole array
console.log "Total elements of the array : "+num[..]


#Replacing the elements of an array
num[2..6] = [13,14,15,16,17]
console.log "New array : "+num

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

c:\> coffee -c range_arrays.coffee

編譯後，它會生成以下 JavaScript 程式碼。在這裡，您可以觀察到所有範圍都被轉換為 JavaScript 的 slice() 方法呼叫。

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

  num = [1, 2, 3, 4, 5, 6, 7, 8, 9];

  data = num.slice(0, 6);

  console.log("The first four elements of the array : " + data);

  data = num.slice(-3);

  console.log("The last 3 elements of the array : " + data);

  console.log("Total elements of the array : " + num.slice(0));

  [].splice.apply(num, [2, 5].concat(ref = [13, 14, 15, 16, 17])), ref;

  console.log("New array : " + num);

}).call(this);

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

c:\> coffee range_arrays.coffee

執行後，CoffeeScript 檔案會生成以下輸出。在這裡，您可以觀察到結束值 **9** 被排除了。

The first four elements of the array : 1,2,3,4,5,6
The last 3 elements of the array : 7,8,9
Total elements of the array : 1,2,3,4,5,6,7,8,9
New array : 1,2,13,14,15,16,17,8,9

帶有字串的範圍

我們也可以將範圍與字串一起使用。如果我們在字串之後指定範圍，則 CoffeeScript 會對其進行切片並返回一個新的字元子集。

示例

以下示例演示了將範圍與字串一起使用的用法。在這裡，我們建立了一個字串並使用範圍從中提取了一個子字串。將此程式碼儲存在名為 **ranges_with_strings.coffee** 的檔案中

my_string = "Welcome to tutorialspoint"
new_string = my_string[0..10]
console.log new_string

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

c:\> coffee -c ranges_with_strings.coffee

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

// Generated by CoffeeScript 1.10.0
(function() {
  var my_string, new_string;

  my_string = "Welcome to tutorialspoint";

  new_string = my_string.slice(0, 6);

  console.log(new_string);

}).call(this);

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

c:\> coffee ranges_with_strings.coffee

執行後，CoffeeScript 檔案會生成以下輸出。在這裡，您可以觀察到結束值 **9** 被排除了。

Welcome to

範圍上的推導式

與物件和陣列一樣，我們還可以使用推導式迭代範圍的元素。

示例

以下是使用範圍上的推導式的示例。在這裡，我們建立了一個範圍並使用推導式檢索其中的元素。將此程式碼儲存在名為 **comprehensions_over_ranges.coffee** 的檔案中

numbers =[0..9]
console.log "The elements of the range are: "
console.log num for num in numbers

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

c:\> coffee -c comprehensions_over_ranges.coffee

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

// Generated by CoffeeScript 1.10.0
(function() {
  var i, len, num, numbers;

  numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];

  console.log("The elements of the range are: ");

  for (i = 0, len = numbers.length; i < len; i++) {
    num = numbers[i];
    console.log(num);
  }

}).call(this);

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

c:\> coffee comprehensions_over_ranges.coffee

執行後，CoffeeScript 檔案會生成以下輸出。在這裡，您可以觀察到結束值 **9** 被排除了。

The elements of the range are:
0
1
2
3
4
5
6
7
8

同樣地，我們也可以使用推導式的 by 關鍵字更改此增量。

array = (num for num in [1..10] by 2)
console.log array
列印頁面
上一頁
下一頁
廣告