我不知道還可以用 JS 做的 6 件事
JS 是一種靈活的語(yǔ)言，這種特性讓我們經(jīng)常覺(jué)得它是一門(mén)最簡(jiǎn)單的語(yǔ)言，也是最難掌握的語(yǔ)言。我使用 JavaScript 已有很多年了，但我仍然偶然發(fā)現(xiàn)一些我不知道的隱藏語(yǔ)法或技巧。
我們來(lái)一直看看，我發(fā)現(xiàn)了哪些。
1. Function 構(gòu)造函數(shù)Function()構(gòu)造函數(shù)雖然不是很常用，但是了解一下還是很有必要的。
不管是通過(guò)函數(shù)定義語(yǔ)句還是函數(shù)直接量表達(dá)式，函數(shù)的定義都要使用 function()關(guān)鍵字。單函數(shù)還可以通過(guò)Function()構(gòu)造函數(shù)來(lái)定義，比如：
- const diff = new Function('a', 'b', 'return a - b');
- diff(20,13) // 7
這一行的實(shí)際效果和下面的一行代碼是等價(jià)的:
- const diff = function(a, b) {
- return a - b
- }
- diff(20, 13)
2. with 語(yǔ)句
JavaScript 有個(gè) with 關(guān)鍵字, with 語(yǔ)句的原本用意是為逐級(jí)的對(duì)象訪(fǎng)問(wèn)提供命名空間式的速寫(xiě)方式。也就是在指定的代碼區(qū)域, 直接通過(guò)節(jié)點(diǎn)名稱(chēng)調(diào)用對(duì)象。
我們已經(jīng)知道，用變量的作用域和作用域鏈(即一個(gè)按順序檢索的對(duì)象列表)來(lái)進(jìn)行變量名解析，而 with 語(yǔ)句就是用于暫修改作用域鏈的，其語(yǔ)法為：
- with(object)
該語(yǔ)句可以有效地將object添加到作用域鏈的頭部，然后執(zhí)行statement,再把作用域鏈恢復(fù)到原始狀態(tài)。
- const book = {
- author: '前端小智',
- title: '我不知道還可以用 JS 做的 6 件事'
- }
- with(book) {
- console.log(author); // 前端小智
- console.log(title); // 我不知道還可以用 JS 做的 6 件事
- }
使用 with語(yǔ)句的 JavaScript 代碼很難優(yōu)化，因此它的運(yùn)算速度比不使用with語(yǔ)句的等價(jià)代碼要慢得多。而且，在with語(yǔ)句中的函數(shù)定義和變量初始化可能會(huì)產(chǎn)生令人驚訝的、相抵觸的行為，因此我們避免使用with`語(yǔ)句。
3. + 操作符
我們可以使用+運(yùn)算符將字符串轉(zhuǎn)換為數(shù)字。除非你想解析為特定的數(shù)字類(lèi)型，否則不需要使用諸如 parseInt() 或 parseFloat() 之類(lèi)的函數(shù)。
- const nr = +'1.5';
- nr + 1; // 2.5
4. 給函數(shù)賦值屬性我們可以給函數(shù)賦屬性。接著，可以通過(guò)為函數(shù)分配特定的屬性來(lái)創(chuàng)建可配置的函數(shù)。
- 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 !');
外，我們可以使用這些函數(shù)屬性作為計(jì)數(shù)器或“靜態(tài)變量”。
5. arguments.callee.caller
我們可以使用arguments.callee.caller來(lái)查看哪個(gè)函數(shù)調(diào)用了當(dāng)前函數(shù)。argumentsJS 普通函數(shù)的默認(rèn)值。arguments.callee.caller告訴我們誰(shuí)調(diào)用了該函數(shù)。類(lèi)似于只有一層 console.trace()。
- function sayHello() {
- console.log(arguments.callee.caller) // [Function: start]
- }
- (function start() {
- sayHello()
- })()
另外arguments.callee表示引用當(dāng)前正在運(yùn)行的函數(shù)。
- function sayHello() {
- console.log(arguments.callee) // [Function: sayHello]
- }
- (function start() {
- sayHello()
- })()
6. void 操作符
void 運(yùn)算符 對(duì)給定的表達(dá)式進(jìn)行求值，然后返回 undefined。
- void(1); // undefined
- void(true); // undefined
- void(false); // undefined
- void({}); // undefined
如果你問(wèn)為什么只需要返回undefined而不是返回就需要一個(gè)特殊的關(guān)鍵字undefined：原因是在ES5之前，實(shí)際上可以命名一個(gè)全局變量undefined，就像這樣：var undefined = "hello"或var undefined = 23，大多數(shù)瀏覽器都可以接受它;undefined不會(huì)保證標(biāo)識(shí)符實(shí)際上是不確定的。因此，要返回實(shí)際的未定義值，請(qǐng)使用void運(yùn)算符。它不是一個(gè)非常流行的運(yùn)算符，并且很少使用。
人才們的 【三連】 就是小智不斷分享的最大動(dòng)力，如果本篇博客有任何錯(cuò)誤和建議，歡迎人才們留言，最后，謝謝大家的觀(guān)看。
作者：Daniel 譯者：前端小智 來(lái)源：js-craft
原文：http://www.js-craft.io/blog/6-things-i-didnt-know-you-can-do-in-javascript/
本文轉(zhuǎn)載自微信公眾號(hào)「大遷世界」，可以通過(guò)以下二維碼關(guān)注。轉(zhuǎn)載本文請(qǐng)聯(lián)系大遷世界公眾號(hào)。
