🙂
JavaScript - 程式設計
  • JavaScript - 程式設計
  • 1. 簡介
    • 1.1 講者簡介
    • 1.2 課程簡介
    • 1.3 開發工具簡介
    • 1.4 第一個 JavaScript
  • 2. 網站技術簡介
    • 2.1 網站前端技術
    • 2.2 網站後端技術
    • 2.3 JavaScript 簡介
  • 3. JavaScript程式語言
    • 3.1 套用 JavaScript
    • 3.2 註解(Comment)
    • 3.3 變數(Variable)
    • 3.4 資料型態(Data Types)
    • 3.5 Strict 模式
    • 3.6 運算子(Operator)
    • 3.7 字串(String)
    • 3.8 數值(Number)
    • 3.9 陣列(Array)
    • 3.10 物件(Object)
    • 3.11 條件式(Conditional)
    • 3.12 迴圈(Loop)
    • 3.13 函式(Function)
    • 3.14 類別(Class)
    • 3.15 傳值呼叫、傳址呼叫
    • 3.16 變數可視範圍(scope)
    • 3.17 錯誤補捉(Errors)
    • 3.18 資料格式
  • 4. JavaScript常用函式及主題
    • 4.1 JSON
    • 4.2 時間間隔執行
    • 4.3 數學(Math)
    • 4.4 日期時間(Date)
    • 4.5 陣列迭代(Iteration)
    • 4.6 陣列排序(Sort)
    • 4.7 正規表達式(Regular Expression)
    • 4.8 效能測試
    • 4.9 this 關鍵字
  • 5. 參考資料
Powered by GitBook
On this page
  • 範例 1:傳值呼叫(Call by Value)
  • 範例 2:傳址呼叫(Call by Reference)
  • 範例 3:複製
  • 練習一:陣列
  • 練習二:物件
  1. 3. JavaScript程式語言

3.15 傳值呼叫、傳址呼叫

在 javascript/practice 資料夾下,建立 call_by_type.html 來練習。

將資料傳進參數時,要留意類型的部份,有分傳遞「值」、「址」兩種:

  • 傳值:傳遞變數的值。

  • 傳址:傳遞變數在記憶體中的「位址」。物件和陣列屬這類型。

範例 1:傳值呼叫(Call by Value)

在傳遞參數時,會複製其值至參數之中。

var a = 10;

function add_number(x){
  x = x + 10;
  alert(x); // 20
}

add_number(a);
alert(a); // 10
  • 第 8 行:將變數 a 的「值」傳給 add_number 函式,該函式用 x 來做承接。(下一節會提到變數的可視範圍)

範例 2:傳址呼叫(Call by Reference)

物件、陣列皆為傳址呼叫的類型,即在傳遞參數時,傳的是該變數在記憶體中的位址。

示意:

以陣列為例:

var a = [1, 2];
function add_number(x){
  x.push(3);
}
add_number(a);  // 傳的是記憶體中的位址

console.log(a); // [1, 2, 3]

概念示意圖:

以物件為例:

var a = {first: "123", second: "456"};
function add_key(x){
  x.third = "789";
}
add_key(a);    // 傳的是記憶體中的位址

console.log(a); // {first: "123", second: "456", third: "789"}

範例 3:複製

延續範例 2,如果我們希望傳進去的陣列、物件,不要影響原來的,做法:

將陣列或物件進行複製,然後再傳遞即可。

以陣列為例:

var a = [1, 2];
function add_number(x){
  x.push(3);
  console.log(x); // [1, 2, 3]
}

add_number(a.slice());  // a.slice() 會回傳新的陣列
console.log(a); // [1, 2]

以物件為例:

var a = {first: "1", second: "2"};
function add_key(x){
  x.third = "3";
  console.log(x); // {first: "1", second: "2", third: "3"}
}

add_key(JSON.parse(JSON.stringify(a)));  // 物件字串化,再轉成物件
console.log(a); // {first: "1", second: "2"}

練習一:陣列

先執行以下原始碼,以下第4行,也影響到了 arr1:

var arr1 = ["a", "b", "c"];
var arr2 = arr1;

arr2[2] = "d";

console.log(arr1); // ["a", "b", "d"]
console.log(arr2); // ["a", "b", "d"]

請改成 arr1 陣列不影響。(也就是要先進行複製)

參考作法:

練習二:物件

先執行以下原始碼,以下第4行,發現也影響到了 obj1:

var obj1 = { a: 10, b: 20, c: 30 };
var obj2 = obj1;

obj2.a = 50;

console.log(obj1); // {a: 50, b: 20, c: 30}
console.log(obj2); // {a: 50, b: 20, c: 30}

請改成 obj1 物件不影響。(也就是要先進行複製)

參考作法:

Previous3.14 類別(Class)Next3.16 變數可視範圍(scope)

Last updated 3 years ago