underscore.js _.once()用法及代碼示例

Underscore.js 是一個 JavaScript 庫，即使不使用任何內置對象，它也提供了許多有用的函數，如Map、過濾器、調用等。

_.once 函數用於我們希望特定函數僅執行一次的情況。即使我們多次執行或調用此函數，它也將不起作用。原始函數的值隻會在每次調用時返回。它主要用於 initialize() 函數，用於隻為變量分配初始值。

用法:

_.once(function)

參數：
它隻需要一個參數，即隻需要調用一次的函數。

返回值：
每次迭代或重複調用函數時，它都會返回原始調用的值。

使用 _.once() 函數執行加法函數：
傳遞給 _.once() 函數的函數將 10 添加到最初具有 10 值的變量 10。然後將_.once() 函數分配給另一個函數“startFunc()”。那麽第一次調用'startFunc()'時，‘a’的值加10變為20。所以第一次調用的輸出是20。那麽下一次調用'startFunc()'時，‘a’的值又應該是增加 10 但這不會發生。這是因為“startFunc()”在其定義中有一個函數“_.once()”，可以防止它被執行多次。因此，第二次和第三次調用的輸出將與第一次相同，即 20。在第一行，在調用“startFunc()”之前打印 ‘a’ 的值，因此輸出為 10。
Examples:
```
<html>
  
<head>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
  </script>
</head>
  
<body>
    <script type="text/javascript">
        var a = 10;
  
        function add() {
            a += 10;
        }
        var startFunc = _.once(add);
        console.log(a);
        startFunc();
        console.log(a);
        startFunc();
        console.log(a);
        startFunc();
        console.log(a);
    </script>
</body>
  
</html>
```
輸出：
使用 _.once() 函數執行乘法運算：
傳遞給 _.once() 函數的函數將原來值為 10 的變量 ‘a’ 乘以 10。然後 _.once() 函數被分配給另一個函數“startFunc()”。第一次調用'startFunc()'時，‘a’的值乘以10變成100。所以第一次調用的輸出是100。那麽下一次調用'startFunc()'時，‘a’的值又應該是再次乘以 10，但這不會發生。這是因為“startFunc()”在其定義中有一個函數“_.once()”，可以防止它被執行多次。因此，第二次和第三次調用的輸出將與第一次相同，即 100。在第一行，在調用“startFunc()”之前打印 ‘a’ 的值，因此輸出為 10。
```
<html>
  
<head>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
  </script>
</head>
  
<body>
    <script type="text/javascript">
        var a = 10;
  
        function add() {
            a *= 10;
        }
        var startFunc = _.once(add);
        console.log(a);
        startFunc();
        console.log(a);
        startFunc();
        console.log(a);
        startFunc();
        console.log(a);
    </script>
</body>
  
</html>
```
輸出：
將字符串傳遞給 _.once() 函數：
傳遞給 _.once() 函數的函數將變量 ‘a’ 的原始字符串附加到另一個字符串。 _.once() 函數被分配給另一個函數“startFunc()”。第一次調用“startFunc()”時，‘a’ 的值由“附加”字符串附加，因此變為 “xyz appended”。所以第一次調用的輸出是“xyz appended”。然後下次調用“startFunc()”時，應該再次附加 ‘a’ 的值，但這不會發生。這是因為“startFunc()”在其定義中有一個函數“_.once()”，可以防止它被執行多次。因此，第二次和第三次調用的輸出將與第一次相同，即 “xyz appended”。在第一行，‘a’ 的值在調用“startFunc()”之前被打印出來，因此輸出是 “xyz”。
```
<html>
  
<head>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
  </script>
</head>
  
<body>
    <script type="text/javascript">
        var a = 'xyz';
  
        function add() {
            a += " appended ";
        }
        var startFunc = _.once(add);
        console.log(a);
        startFunc();
        console.log(a);
        startFunc();
        console.log(a);
        startFunc();
        console.log(a);
    </script>
</body>
  
</html>
```
輸出：

將數字和字符串都傳遞給 _.once() 函數：
在這裏，我們對一個函數執行 _.once() 函數，該函數既將字符串附加到原始值為 “xyz” 的變量 ‘a’ 上，也將 10 添加到原始值為 5 的變量 ‘b’ 上。在第一行，兩個變量 ‘a’ 的原始值並顯示 ‘b’。之後，當我們第一次調用“startFunc()”時，‘a’ 變量由“附加”字符串附加，‘b’ 變量的值增加 10。因此，‘a’ 變為 “xyz appended”，‘b’ 變為 15。現在每次使用“startFunc()” ‘a’ 和 ‘b’ 的值將保持不變，因為我們在“startFunc()”的定義中使用了 _.once() 函數。


<html>
  
<head>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
  </script>
</head>
  
<body>
    <script type="text/javascript">
        var a = 'xyz',
            b = 5;
  
        function add() {
            a += " appended ";
            b += 10;
        }
        var startFunc = _.once(add);
        console.log(a, b);
        startFunc();
        console.log(a, b);
        startFunc();
        console.log(a, b);
        startFunc();
        console.log(a, b);
    </script>
</body>
  
</html>

輸出：

筆記：
這些命令在 Google 控製台或 Firefox 中不起作用，因為需要添加他們沒有添加的這些附加文件。
因此，將給定的鏈接添加到您的 HTML 文件中，然後運行它們。
鏈接如下：


<script type="text/javascript" src =
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
</script>

相關用法

注：本文由純淨天空篩選整理自Sakshi98大神的英文原創作品 Underscore.js _.once() Function。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。