JS語句為什么不能以“function”與大括號開頭

ermaoL 發布于2019-08-21 18:39 / 1205人閱讀

摘要：語句之間使用作為結尾，其中主要包括表達式語句塊語句空語句和聲明語句，這里不細講。對于這句話，只能說對錯一半吧先來說一下為什么語句不能以開始，這里涉及到函數聲明的概念。

前言

前段時間調試代碼，查看對象的toString的返回數據，由于比較簡單，直接在瀏覽器的控制臺輸出代碼

{}.toString();    // Uncaught SyntaxError: Unexpected token .

“.”不是期待的表達式，{}在JS中不是一個再正常不過的對象么,于是試了一下其他對象類型數據。

[].toString();    // ""
function(){}.toString();    // Uncaught SyntaxError: Unexpected token (
/^.$/.toString();    // "/^.$/"

查資料看了一下，總的來說涉及到JS這門語言設計的幾個概念：語句、函數聲明、語句塊等

語句

JS中，應用程序是由許多語法正確的語句組成的，語句的作用就是告訴瀏覽器應該怎樣執行程序。語句之間使用“；”作為結尾，其中主要包括表達式語句、塊語句、空語句和聲明語句，這里不細講。

注意上面一段話中的語法正確一詞，在前言的demo代碼中，數組和正則表達式可以正常調用的，但是對象和方法類型調用卻是失敗的，網上大部分答案回答都比較淺顯：”JS中語句不能以function或者大括號作為開始，會報錯“。對于這句話，只能說對錯一半吧！

先來說一下為什么語句不能以”function“開始，這里涉及到函數聲明的概念。

函數聲明

函數聲明：定義一個具有指定參數的函數，以function開頭， 其中包括函數名，參數名，和函數語句塊

舉個栗子?:

function funcName(arg1, arg2) {
    // 語句塊
}

我們代碼中調用toString方法”function(){}.toString“,是以”function“開頭的， JS中會將以”function“ 開頭的語句認定為函數聲明語句，那么代碼必須符合函數聲明語句規范，很明顯”function“后未包括函數名，這條函數聲明語句明顯不符合規范。

正確的做法：

// 以”(“開頭的語句JS并不會將其視作函數聲明
(function(){}).toString();
// 匿名函數
(function(){})()
// 匿名函數裝B一點的寫法
void function(){}()

非函數申明代碼不可以“function”作為語句開頭，那大括號又是怎么回事呢。

語句塊

將零個或多個語句聯合在一起，形成一條復合語句，用大括號將其包括

有的文檔上叫“塊語句”，也有人的文檔上叫復合語句，舉個栗子?，我們可以這樣寫代碼：

{
    console.info("輸出一個語句");
    console.info("不出錯，是不是很神奇");
};

也就是說如果我們以大括號開頭，瀏覽器會理解將其視作一個語句塊，語句塊中的代碼和外面的代碼并沒有本質的區別，也是從上至下而執行。再看個栗子?：

{};    // undefined
{a: "a"};    // "a";
{a: "a"}.a;    // Uncaught SyntaxError: Unexpected token .

第一行很好理解，沒有任何執行語句，當然輸出undefined
第二行代碼呢，輸出“a”，這里不要被“:”給蒙蔽了，這里的的冒號是一個標識符，類似于C語言中的標記符，不同的是JS中通過“break”與“continue”跳轉到標記符，二C語言中是通過“goto”，關于標記符
第三行代碼等同于：“a: "a"; .a;” 沒有通過對象主體獲取屬性“a”，所以報錯。

綜上所述，“{}.toString();” 等同于: “; .toString();” 未通過對象主體調用“toString”方法，不符合JS中期待的表達式

說了這么多，用語句塊有什么好處呢，我能想到的唯一好處只有“裝B耍酷”...

總結在最后

JS語句為什么不能以“function”和大括號開頭呢？

以function開頭，但必須是一個函數聲明語句

以大括號開頭，但該大括號不再被當做一個對象處理，而是當做一個語句塊處理

綜上兩條說明，JS語句可以以function，也可以以大括號作為開頭，前提是必須符合JS中的語法規范

參考資料

MDN 語句
MDN 語句塊
MDN 標記符
MDN Unexpected token
expressions-vs-statements
MDN Expressions_and_Operators

GPU云服務器云服務器 js 以什么開頭以a開頭的編程語言 js數據類型function js_function_apply

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/90687.html

編寫高質量JavaScript代碼的基本技巧

摘要：五不要增加內置的原型增加內置構造函數如，和等的原型屬性是一個增強功能性的強大的方法，但這可能會嚴重影響可維護性，因為這種做法將使代碼變得更加不可預測。推薦使用后者，這樣根據名字就能明顯地區分出變量函數和基本常量等。一、盡量少用全局變量減少全局名字空間污染，最理想的情況是一個應用程序僅有一個全局變量。二、單一var模式 var a = 1, b = 2, sum =...

Alex 2019-08-19 17:20 評論0 收藏0
我的前端編碼習慣 —— js篇

摘要：文件中的代碼塊可用以下代碼塊包裹，以減少全局污染。命名規則原則盡量避免潛在命名沖突，避免過于精簡，應見名知意。必須與共同使用的構造函數名應以大寫字母開頭。變量所有的變量必須在使用前進行聲明。僅在函數和構造器內使，以明確的上下指向。代碼格式規范 1.html中外部腳本引入盡量放在尾部。 2.一個html文件中只寫一個代碼塊。 3.JS文件中的代碼塊可用以下代碼塊包裹，以減少全局污染。 ...

LancerComet 2019-08-20 14:34 評論0 收藏0
前端代碼編寫規范

摘要：前端代碼規范代碼編寫規范縮進每一層級由個空格組成，避免使用制表符進行縮進。單目運算符的操作數之間不應該用空白隔開語句中的表達式之間應當用空格隔開代碼編寫規范頭部文檔類型建議使用格式的。內聯元素寫在一行內，塊狀元素還有列表和表格要另起一行。前端代碼規范 JavaScript代碼編寫規范縮進每一層級由4個空格組成，避免使用制表符（Tab）進行縮進。行的長度每行長度不應該超過80個...

liangdas 2019-08-23 11:49 評論0 收藏0
JS學習系列 07 - 標簽聲明（Label Statement）

摘要：上面這段代碼，在中的執行結果是什么呢大家思考分鐘好，分鐘已過，大家有結果了嗎千萬不要在瀏覽器的控制臺中去寫這段代碼，雖然結果和你開始想的結果一樣，但是，它是錯誤的。這是在控制臺中執行的結果這是在中的執行結果可以看到兩個結果是不一樣的。 1. 引言假設有這么一道題： for (var i = 0; i < 10; i++) { console.log(i); for (...

ormsf 2019-08-22 15:57 評論0 收藏0