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

[[333890]]

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

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來查看哪個函數調用了當前函數。argumentsJS 普通函數的默認值。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運算符。它不是一個非常流行的運算符，并且很少使用。

人才們的 【三連】 就是小智不斷分享的最大動力，如果本篇博客有任何錯誤和建議，歡迎人才們留言，最后，謝謝大家的觀看。

作者：Daniel 譯者：前端小智 來源：js-craft

原文：http://www.js-craft.io/blog/6-things-i-didnt-know-you-can-do-in-javascript/

本文轉載自微信公眾號「大遷世界」，可以通過以下二維碼關注。轉載本文請聯系大遷世界公眾號。