搜尋
首頁web前端前端問答javascript中大括號的用法是什麼

JavaScript中大括號的用法:1、用於組織複合語句;2、用於定義一個對象,大部分情況下要有成對的屬性和值;3、用於聲明函數或函數直接量;4、用作結構化異常處理的語法符號。

javascript中大括號的用法是什麼

本教學操作環境:windows10系統、javascript1.8.5版、Dell G3電腦。

javascript中大括號的用法是什麼

Javascript中大括號"{}"有四種語意作用:

語義1. 組織複合語句,這是最常見的:

if( condition ) {
  //...
}else {
  //...
}
for() {
  //...
}

語意2,物件直接量宣告:

var obj = {
    name : 'jack',
    age : 23
};

整個是個賦值語句,其中的{name:'jack' ,age:23}是個表達式。

語意3,宣告函數或函數直接量:

function f1(){
    //...
}
var f2 = function(){
    //...
}

f1與非f2的差異是前者在語法解釋期,後者在執行期間。差別在於:如果調用函數的程式碼在函數定義之後,則沒有區別;如果調用函數的程式碼在函數定義之前,則f1仍然可以調用,f2則會報錯,提示f2未定義。

語意4,結構化例外處理的語法符號:

try {
    //...
}catch( ex ){
    //...
}finally{
    //...
}

這裡的大括號與符合語句(語意1 )是有差別的,大括號中如果只有一條語句,在if/else/for等大括號是可以省略的,但try/catch/finally則不能省略。

以下程式碼糾結了偶N久:

function(){}() //匿名函数立即执行, 语法分析期报
{}.constructor //获取对象直接量的构造器,语法分析期报错

令人不解的是為何[].constructor這麼寫卻不報錯呢,一個是想取得物件直接量的建構器,一個是取得數組直接量的構造器而已。

當然加入變數接收也不會錯,var c = {}.constructor;

同樣的情況如:var fn = function(){}(),也不會錯誤。

其實是js的"語句優先"在作怪,也就是{}被理解成複合語句區塊(語意1 )而非物件直接量(語意2 )或宣告函數(語意3 )的語意。

function(){}(),大括號被理解成複合語句,自然前面的function()宣告函數的語法不完整導致語法分析期出錯。 {}.constructor,大括號被理解成複合語句,大括號後面是點運算符,點運算子前沒有合理的物件自然也報錯。

修復方式眾所周知:加個強制運算子()

(function(){})(),(function(){});//強制其理解為函數(語意3 ),"函數()"表示執行函數,即宣告後立即執行了。 ({}).constructor //({})強制把大括號理解成物件直接量(語意2 ),"物件.xx"表示取得物件的成員,自然後面的點運算子可以正常執行了。

function(){}(); 語法錯誤的原因和 ();函數呼叫運算子無關。

本質原因是, function(){} ,根據詞法分析期間將token的有效分組。 function被看成這個ExpressionStatement 的start 位置的第一個token元素。這是EMCA262所不允許的。不允許的原因很明確,就是怕引起函數表達式和函數宣告的歧義。你可以理解為 function 關鍵字永遠不能在一個ExpressionStaement的第一位。

來看看賦值語句f = function(){};

f : LeftHandSideExpression
= : AssignmentOperator

function(){};此時被看做是整個語句的賦值表達式部分即 AssignmentExpression。 所以他合理合法的通過了語法檢查,成為了一個函數表達式.FunctionExpression.

所以這時候,即使你 f = function(){}(); 在語法上也是合法的。

相關推薦:javascript學習教學

以上是javascript中大括號的用法是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
了解usestate():綜合反應國家管理指南了解usestate():綜合反應國家管理指南Apr 25, 2025 am 12:21 AM

useState()isaReacthookusedtomanagestateinfunctionalcomponents.1)Itinitializesandupdatesstate,2)shouldbecalledatthetoplevelofcomponents,3)canleadto'stalestate'ifnotusedcorrectly,and4)performancecanbeoptimizedusinguseCallbackandproperstateupdates.

使用React的優點是什麼?使用React的優點是什麼?Apr 25, 2025 am 12:16 AM

ReactispupularduetoItsOmpontement,基於虛擬,虛擬詞,Richecosystem和declarativedation.1)基於組件的harchitectureallowslowsforreusableuipieces。

在React中調試:識別和解決共同問題在React中調試:識別和解決共同問題Apr 25, 2025 am 12:09 AM

todebugreactapplicationsefectefectionfection,usethestertate:1)proppropdrillingwithcontextapiorredux.2)使用babortControllerToptopRollerTopRollerTopRollerTopRollerTopRollerTopRollerTopRollerTopRollerTopRollerTopRaceeDitions.3)intleleassynChronOusOperations.3)

反應中的usestate()是什麼?反應中的usestate()是什麼?Apr 25, 2025 am 12:08 AM

usestate()inrectallowsStateMagementionInfunctionalComponents.1)ITSIMPLIFIESSTATEMAGEMENT,MACHECODEMORECONCONCISE.2)usetheprevcountfunctionToupdateStateBasedonitspReviousViousViousvalue,deveingingStaleStateissues.3)

usestate()與用戶ducer():為您的狀態需求選擇正確的掛鉤usestate()與用戶ducer():為您的狀態需求選擇正確的掛鉤Apr 24, 2025 pm 05:13 PM

selectUsestate()forsimple,獨立的variables; useusereducer()forcomplexstateLogicorWhenStatedIppedsonPreviousState.1)usestate()isidealForsImpleupDatesLikeToggGlikGlingaBglingAboolAboolAupDatingacount.2

使用usestate()管理狀態:實用教程使用usestate()管理狀態:實用教程Apr 24, 2025 pm 05:05 PM

useState優於類組件和其它狀態管理方案,因為它簡化了狀態管理,使代碼更清晰、更易讀,並與React的聲明性本質一致。 1)useState允許在函數組件中直接聲明狀態變量,2)它通過鉤子機制在重新渲染間記住狀態,3)使用useState可以利用React的優化如備忘錄化,提升性能,4)但需注意只能在組件頂層或自定義鉤子中調用,避免在循環、條件或嵌套函數中使用。

何時使用usestate()以及何時考慮替代狀態管理解決方案何時使用usestate()以及何時考慮替代狀態管理解決方案Apr 24, 2025 pm 04:49 PM

useUsestate()forlocalComponentStateMangementighatighation; 1)usestate()isidealforsimple,localforsimple.2)useglobalstate.2)useglobalstateSolutionsLikErcontExtforsharedState.3)

React的可重複使用的組件:增強代碼可維護性和效率React的可重複使用的組件:增強代碼可維護性和效率Apr 24, 2025 pm 04:45 PM

ReusableComponentsInrectenHanceCodainainability and效率byallowingDevelostEsteSeTheseTheseThesAmeCompOntionActActRossDifferentPartSofanApplicationorprojects.1)heSredunceRedUndenceNandSimplifyUpdates.2)yensureconsistencyInuserexperience.3)

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

Dreamweaver Mac版

Dreamweaver Mac版

視覺化網頁開發工具

VSCode Windows 64位元 下載

VSCode Windows 64位元 下載

微軟推出的免費、功能強大的一款IDE編輯器

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具