我不知道還可以用 JS 做的 6 件事

作者：Daniel

譯者：前端小智

來源：js-craft

JS 是一種靈活的語言，這種特性讓我們經常覺得它是一門最簡單的語言，也是最難掌握的語言。 我使用 JavaScript 已有很多年了，但我仍然偶然發現一些我不知道的隐藏文法或技巧。

我們來一直看看，我發現了哪些。

1. Function 構造函數

Function()

構造函數雖然不是很常用，但是了解一下還是很有必要的。

不管是通過函數定義語句還是函數直接量表達式，函數的定義都要使用

function()

關鍵字。單函數還可以通過

Function()

構造函數來定義，比如：

const diff = new Function('a', 'b', 'return a - b');
diff(20,13) // 7           

複制

這一行的實際效果和下面的一行代碼是等價的:

const diff = function(a, b) {
   return a - b
}

diff(20, 13)           

複制

2. with 語句

JavaScript 有個

with

關鍵字,

with

語句的原本用意是為逐級的對象通路提供命名空間式的速寫方式。也就是在指定的代碼區域, 直接通過節點名稱調用對象。

我們已經知道，用變量的作用域和作用域鍊（即一個按順序檢索的對象清單）來進行變量名解析，而

with

語句就是用于暫修改作用域鍊的，其文法為：

with(object)

該語句可以有效地将

object

添加到作用域鍊的頭部，然後執行

statement

,再把作用域鍊恢複到原始狀态。

const book = {
    author: '前端小智',
    title: '我不知道還可以用 JS 做的 6 件事'
}
with(book) {
    console.log(author); // 前端小智
    console.log(title); // 我不知道還可以用 JS 做的 6 件事
}           

複制

使用 with

語句的 JavaScript 代碼很難優化，是以它的運算速度比不使用

with

語句的等價代碼要慢得多。而且，在with語句中的函數定義和變量初始化可能會産生令人驚訝的、相抵觸的行為，是以我們避免使用

with`語句。

3. + 操作符

我們可以使用

+

運算符将字元串轉換為數字。 除非你想解析為特定的數字類型，否則不需要使用諸如

parseInt()

或

parseFloat()

之類的函數。

const nr = +'1.5';
nr + 1; // 2.5           

複制

4. 給函數指派屬性

我們可以給函數賦屬性。接着，可以通過為函數配置設定特定的屬性來建立可配置的函數。

function sayHello() {
    if (sayHello.country = 'US') {
        return alert('Hi there!');
    }
    if (sayHello.country = 'FR') {
        return alert('Bonjour !');
    }
    if (sayHello.country = 'GR') {
            return alert('Guten Tag !');
        }
    return alert('Hi');
}
sayHello.country =  'FR';
sayHello(); // alert('Bonjour !');           

複制

外，我們可以使用這些函數屬性作為計數器或“靜态變量”。

5. arguments.callee.caller

我們可以使用arguments.callee.caller來檢視哪個函數調用了目前函數。

arguments

JS 普通函數的預設值。

arguments.callee.caller

告訴我們誰調用了該函數。 類似于隻有一層

console.trace()

。

function sayHello() {
  console.log(arguments.callee.caller) // [Function: start]
}

(function start() {
  sayHello()
})()           

複制

另外

arguments.callee

表示引用目前正在運作的函數。

function sayHello() {
  console.log(arguments.callee) // [Function: sayHello]
}

(function start() {
  sayHello()
})()           

複制

6. void 操作符

void

運算符 對給定的表達式進行求值，然後傳回

undefined

。

void(1); // undefined
void(true); // undefined
void(false); // undefined
void({}); // undefined           

複制

如果你問為什麼隻需要傳回

undefined

而不是傳回就需要一個特殊的關鍵字

undefined

：原因是在ES5之前，實際上可以命名一個全局變量

undefined

，就像這樣：

var undefined = "hello"

或

var undefined = 23

，大多數浏覽器都可以接受它；

undefined

不會保證辨別符實際上是不确定的。是以，要傳回實際的未定義值，請使用

void

運算符。它不是一個非常流行的運算符，并且很少使用。

原文：http://www.js-craft.io/blog/6...