外文翻译-programming practices编程实践

长江大学工程技术学院毕业设计（论文）外文翻译外文题目PROGRAMMINGPRACTICES译文题目编程实践系部信息系专业班级计算机科学与技术61001班学生姓名指导教师辅导教师完成日期2014年4月18日PROGRAMMINGPRACTICES编程实践NICHOLASCZAKAS等著吴正尧译每种编程语言都有痛点，而且低效模式随着时间的推移不断发展。其原因在于，越来越多的人们开始使用这种语言，不断扩种它的边界。自2005年以来，当术语“AJAX”出现时，网页开发者对JAVASCRIPT和浏览器的推动作用远超过以往。其结果是出现了一些非常具体的模式，即有优秀的做法也有糟糕的做法。这些模式的出现，是因为网络上JAVASCRIPT的性质决定的。1避免二次评估JAVASCRIPT与许多脚本语言一样，允许你在程序中获取一个包含代码的字符串然后运行它。有四种标准方法可以实现EVAL_R，FUNCTION构造器，SETTIMEOUT和SETINTERVAL。每个函数允许你传入一串JAVASCRIPT代码，然后运行它。例如VARNUM15,NUM26,/EVAL_REVALUATINGASTRINGOFCODERESULTEVAL_R“NUM1NUM2“,/FUNCTIONEVALUATINGSTRINGSOFCODESUMNEWFUNCTION“ARG1“,“ARG2“,“RETURNARG1ARG2“/SETTIMEOUTEVALUATINGASTRINGOFCODESETTIMEOUT“SUMNUM1NUM2“,100/SETINTERVALEVALUATINGASTRINGOFCODESETINTERVAL“SUMNUM1NUM2“,100当你在JAVASCRIPT代码中执行（另一段）JAVASCRIPT代码时，你付出二次评估的代价。此代码首先被评估为正常代码，然后在执行过程中，运行字符串中的代码时发生另一次评估。二次评估是一项昂贵的操作，与直接包含相应代码相比将占用更长时间。作为一个比较点，不同浏览器上访问一个数组项所占用的时间各有不同，但如果使用EVAL_R访问其结果将大相径庭。例如/FASTERVARITEMARRAY0/SLOWERVARITEMEVAL_R“ARRAY0“如果使用EVAL_R代替直接代码访问10000个数组项，在不同浏览器上的差异非常巨大。访问数组项时间上的巨大差异，是因为每次调用EVAL_R时要创建一个新的解释/编译实例。同样的过程也发生在FUNCTION，SETTIMEOUT和SETINTERVAL上，自动使代码执行速度变慢。大多数情况下，没必要使用EVAL_R或FUNCTION，如果可能的话，尽量避免使用它们。至于另外两个函数，SETTIMEOUT和SETINTERVAL，建议第一个参数传入一个函数而不是一个字符串。例如SETTIMEOUTFUNCTIONSUMNUM1NUM2,100SETINTERVALFUNCTIONSUMNUM1NUM2,100避免二次评估是实现最优化的JAVASCRIPT运行时性能的关键。2使用对象/数组直接量在JAVASCRIPT中有多种方法创建对象和数组，但没有什么比创建对象和数组直接量更快了。如果不使用直接量，典型的对象创建和赋值是这样的/CREATEANOBJECTVARMYOBJECTNEWOBJECTMYOBJECTNAME“NICHOLAS“MYOBJECTCOUNT50MYOBJECTFLAGTRUEMYOBJECTPOINTERNULL/CREATEANARRAYVARMYARRAYNEWARRAYMYARRAY0“NICHOLAS“MYARRAY150MYARRAY2TRUEMYARRAY3NULL虽然在技术上这种做法没有什么不对，直接量赋值很快。作为一个额外的好处，直接量在你的代码中占用较少空间，所以整个文件尺寸可以更小。上面的代码可用直接量重写为下面的样式/CREATEANOBJECTVARMYOBJECTNAME“NICHOLAS“,COUNT50,FLAGTRUE,POINTERNULL/CREATEANARRAYVARMYARRAY“NICHOLAS“,50,TRUE,NULL此代码的效果与前面的版本相同，但在几乎所有浏览器上运行更快（在FIREFOX35上几乎没区别）。随着对象属性和数组项数的增加，使用直接量的好处也随之增加。3不要重复工作在计算机科学领域最重要的性能优化技术之一是避免工作。避免工作的概念实际上意味着两件事不要做不必要的工作，不要重复做已经完成的工作。第一部分通常认为代码应当重构。第二部分不要重复工作通常难以确定，因为工作可能因为各种原因而在很多地方被重复。也许最常见的重复工作类型是浏览器检测。大量代码依赖于浏览器的功能。以事件句柄的添加和删除为例，典型的跨浏览器代码如下FUNCTIONADDHANDLERTARGET,EVENTTYPE,HANDLERIFTARGETADDEVENTLISTENER/DOM2EVENTSTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IETARGETATTACHEVENT“ON“EVENTTYPE,HANDLERFUNCTIONREMOVEHANDLERTARGET,EVENTTYPE,HANDLERIFTARGETREMOVEEVENTLISTENER/DOM2EVENTSTARGETREMOVEEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IETARGETDETACHEVENT“ON“EVENTTYPE,HANDLER此代码通过测试ADDEVENTLISTENER和REMOVEEVENTLISTENER检查DOM级别2的事件支持情况，它能够被除INTERNETEXPLORER之外的所有现代浏览器所支持。如果这些方法不存在于TARGET中，那么就认为当前浏览器是IE，并使用IE特有的方法。乍一看，这些函数为实现它们的目的已经足够优化。隐藏的性能问题在于每次函数调用时都执行重复工作。每一次，都进行同样的检查，看看某种方法是否存在。如果你假设TARGET唯一的值就是DOM对象，而且用户不可能在页面加载时魔术般地改变浏览器，那么这种判断就是重复的。如果ADDHANDLER一上来就调用ADDEVENTLISTENER那么每个后续调用都要出现这句代码。在每次调用中重复同样的工作是一种浪费，有多种办法避免这一点。4延迟加载第一种消除函数中重复工作的方法称作延迟加载。延迟加载意味着在信息被使用之前不做任何工作。在前面的例子中，不需要判断使用哪种方法附加或分离事件句柄，直到有人调用此函数。使用延迟加载的函数如下FUNCTIONADDHANDLERTARGET,EVENTTYPE,HANDLER/OVERWRITETHEEXISTINGFUNCTIONIFTARGETADDEVENTLISTENER/DOM2EVENTSADDHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IEADDHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETATTACHEVENT“ON“EVENTTYPE,HANDLER/CALLTHENEWFUNCTIONADDHANDLERTARGET,EVENTTYPE,HANDLERFUNCTIONREMOVEHANDLERTARGET,EVENTTYPE,HANDLER/OVERWRITETHEEXISTINGFUNCTIONIFTARGETREMOVEEVENTLISTENER/DOM2EVENTSREMOVEHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IEREMOVEHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETDETACHEVENT“ON“EVENTTYPE,HANDLER/CALLTHENEWFUNCTIONREMOVEHANDLERTARGET,EVENTTYPE,HANDLER这两个函数依照延迟加载模式实现。这两个方法第一次被调用时，检查一次并决定使用哪种方法附加或分离事件句柄。然后，原始函数就被包含适当操作的新函数覆盖了。最后调用新函数并将原始参数传给它。以后再调用ADDHANDLER或者REMOVEHANDLER时不会再次检测，因为检测代码已经被新函数覆盖了。调用一个延迟加载函数总是在第一次使用较长时间，因为它必须运行检测然后调用另一个函数以完成任务。但是，后续调用同一函数将快很多，因为不再执行检测逻辑了。延迟加载适用于函数不会在页面上立即被用到的场合。5条件预加载除延迟加载之外的另一种方法称为条件预加载，它在脚本加载之前提前进行检查，而不等待函数调用。这样做检测仍只是一次，但在此过程中来的更早。例如VARADDHANDLERDOCUMENTBODYADDEVENTLISTENERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETATTACHEVENT“ON“EVENTTYPE,HANDLERVARREMOVEHANDLERDOCUMENTBODYREMOVEEVENTLISTENERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETREMOVEEVENTLISTENEREVENTTYPE,HANDLER,FALSEFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETDETACHEVENT“ON“EVENTTYPE,HANDLER这个例子检查ADDEVENTLISTENER和REMOVEEVENTLISTENER是否存在，然后根据此信息指定最合适的函数。三元操作符返回DOM级别2的函数，如果它们存在的话，否则返回IE特有的函数。然后，调用ADDHANDLER和REMOVEHANDLER同样很快，虽然检测功能提前了。条件预加载确保所有函数调用时间相同。其代价是在脚本加载时进行检测。预加载适用于一个函数马上就会被用到，而且在整个页面生命周期中经常使用的场合。6使用速度快的部分虽然JAVASCRIPT经常被指责缓慢，然而此语言的某些部分具有难以置信的快速。这不足为奇因为JAVASCRIPT引擎由低级语言构建。虽然JAVASCRIPT速度慢很容易被归咎于引擎，然而引擎通常是处理过程中最快的部分，实际上速度慢的是你的代码。引擎的某些部分比其它部分快很多，因为它们允许你绕过速度慢的部分。7位操作运算符位操作运算符是JAVASCRIPT中经常被误解的内容之一。一般的看法是，开发者不知道如何使用这些操作符，经常在布尔表达式中误用。结果导致JAVASCRIPT开发中不常用位操作运算符，尽管它们具有优势。JAVASCRIPT中的数字按照IEEE754标准64位格式存储。在位运算中，数字被转换为有符号32位格式。每种操作均直接操作在这个32位数上实现结果。尽管需要转换，这个过程与JAVASCRIPT中其他数学和布尔运算相比还是非常快。如果你对数字的二进制表示法不熟悉，JAVASCRIPT可以很容易地将数字转换为字符串形式的二进制表达式，通过使用TOSTRING方法并传入数字2（做参数）。例如VARNUM125,NUM23ALERTNUM1TOSTRING2/“11001“ALERTNUM2TOSTRING2/“11“请注意，该表达式消隐了数字高位的零。JAVASCRIPT中有四种位逻辑操作符位与两个操作数的位都是1，结果才是1位或有一个操作数的位是1，结果就是1位异或两个位中只有一个1，结果才是1位非遇0返回1，反之亦然这些操作符用法如下/BITWISEANDVARRESULT125/1ALERTRESULTTOSTRING2/“1“/BITWISEORVARRESULT225|3/27ALERTRESUL2TOSTRING2/“11011“/BITWISEXORVARRESULT3253/26ALERTRESUL3TOSTRING2/“11000“/BITWISENOTVARRESULT25/26ALERTRESUL2TOSTRING2/“11010“有许多方法可以使用位运算符提高JAVASCRIPT的速度。首先可以用位运算符替代纯数学操作。例如，通常采用对2取模运算实现表行颜色交替显示，例如FORVARI0,LENROWSLENGTHILENIIFI2CLASSNAME“EVEN“ELSECLASSNAME“ODD“/APPLYCLASS计算对2取模，需要用这个数除以2然后查看余数。如果你看到32位数字的底层（二进制）表示法，你会发现偶数的最低位是0，奇数的最低位是1。如果此数为偶数，那么它和1进行位与操作的结果就是0；如果此数为奇数，那么它和1进行位与操作的结果就是1。也就是说上面的代码可以重写如下FORVARI0,LENROWSLENGTHILENIIFIELSECLASSNAME“EVEN“/APPLYCLASS虽然代码改动不大，但位与版本比原始版本快了50（取决于浏览器）。第二种使用位操作的技术称作位掩码。位掩码在计算机科学中是一种常用的技术，可同时判断多个布尔选项，快速地将数字转换为布尔标志数组。掩码中每个选项的值都等于2的幂。例如VAROPTION_A1VAROPTION_B2VAROPTION_C4VAROPTION_D8VAROPTION_E16通过定义这些选项，你可以用位或操作创建一个数字来包含多个选项VAROPTIONSOPTION_A|OPTION_C|OPTION_D你可以使用位与操作检查一个给定的选项是否可用。如果该选项未设置则运算结果为0，如果设置了那么运算结果为1/ISOPTIONAINTHELISTIFOPTIONS/SETTIMEOUTEVALUATINGASTRINGOFCODESETTIMEOUT“SUMNUM1NUM2“,100/SETINTERVALEVALUATINGASTRINGOFCODESETINTERVAL“SUMNUM1NUM2“,100WHENEVERYOUREEVALUATINGJAVASCRIPTCODEFROMWITHINJAVASCRIPTCODE,YOUINCURADOUBLEEVALUATIONPENALTYTHISCODEISFIRSTEVALUATEDASNORMAL,ANDTHEN,WHILEEXECUTING,ANOTHEREVALUATIONHAPPENSTOEXECUTETHECODECONTAINEDINASTRINGDOUBLEEVALUATIONISACOSTLYOPERATIONANDTAKESMUCHLONGERTHANIFTHESAMECODEWEREINCLUDEDNATIVELYASAPOINTOFCOMPARISON,THETIMEITTAKESTOACCESSANARRAYITEMVARIESFROMBROWSERTOBROWSERBUTVARIESFARMOREDRAMATICALLYWHENTHEARRAYITEMISACCESSEDUSINGEVAL_RFOREXAMPLE/FASTERVARITEMARRAY0/SLOWERVARITEMEVAL_R“ARRAY0“THEDIFFERENCEACROSSBROWSERSBECOMESDRAMATICIF10,000ARRAYITEMSAREREADUSINGEVAL_RINSTEADOFNATIVECODETHISDRAMATICDIFFERENCEINARRAYITEMACCESSTIMEISDUETOTHECREATIONOFANEWINTERPRETER/COMPILERINSTANCEEACHTIMEEVAL_RISCALLEDTHESAMEPROCESSOCCURSFORFUNCTION,SETTIMEOUT,ANDSETINTERVAL,AUTOMATICALLYMAKINGCODEEXECUTIONSLOWERMOSTOFTHETIME,THEREISNONEEDTOUSEEVAL_RORFUNCTION,ANDITSBESTTOAVOIDTHEMWHENEVERPOSSIBLEFORTHEOTHERTWOFUNCTIONS,SETTIMEOUTANDSETINTERVAL,ITSRECOMMENDEDTOPASSINAFUNCTIONASTHEFIRSTARGUMENTINSTEADOFASTRINGFOREXAMPLESETTIMEOUTFUNCTIONSUMNUM1NUM2,100SETINTERVALFUNCTIONSUMNUM1NUM2,100AVOIDINGDOUBLEEVALUATIONISKEYTOACHIEVINGTHEMOSTOPTIMALJAVASCRIPTRUNTIMEPERFORMANCEPOSSIBLE2USEOBJECT/ARRAYLITERALSTHEREAREMULTIPLEWAYSTOCREATEOBJECTSANDARRAYSINJAVASCRIPT,BUTNOTHINGISFASTERTHANCREATINGOBJECTANDARRAYLITERALSWITHOUTUSINGLITERALS,TYPICALOBJECTCREATIONANDASSIGNMENTLOOKSLIKETHIS/CREATEANOBJECTVARMYOBJECTNEWOBJECTMYOBJECTNAME“NICHOLAS“MYOBJECTCOUNT50MYOBJECTFLAGTRUEMYOBJECTPOINTERNULL/CREATEANARRAYVARMYARRAYNEWARRAYMYARRAY0“NICHOLAS“MYARRAY150MYARRAY2TRUEMYARRAY3NULLALTHOUGHTHEREISTECHNICALLYNOTHINGWRONGWITHTHISAPPROACH,LITERALSAREEVALUATEDFASTERASANADDEDBONUS,LITERALSTAKEUPLESSSPACEINYOURCODE,SOTHEOVERALLFILESIZEISSMALLERTHEPREVIOUSCODECANBEREWRITTENUSINGLITERALSINTHEFOLLOWINGWAY/CREATEANOBJECTVARMYOBJECTNAME“NICHOLAS“,COUNT50,FLAGTRUE,POINTERNULL/CREATEANARRAYVARMYARRAY“NICHOLAS“,50,TRUE,NULLTHEENDRESULTOFTHISCODEISTHESAMEASTHEPREVIOUSVERSION,BUTITISEXECUTEDFASTERINALMOSTALLBROWSERSFIREFOX35SHOWSALMOSTNODIFFERENCEASTHENUMBEROFOBJECTPROPERTIESANDARRAYITEMSINCREASES,SOTOODOESTHEBENEFITOFUSINGLITERALS3DONTREPEATWORKONEOFTHEPRIMARYPERFORMANCEOPTIMIZATIONTECHNIQUESINCOMPUTERSCIENCEOVERALLISWORKAVOIDANCETHECONCEPTOFWORKAVOIDANCEREALLYMEANSTWOTHINGSDONTDOWORKTHATISNTREQUIRED,ANDDONTREPEATWORKTHATHASALREADYBEENCOMPLETEDTHEFIRSTPARTISUSUALLYEASYTOIDENTIFYASCODEISBEINGREFACTOREDTHESECONDPARTNOTREPEATINGWORKISUSUALLYMOREDIFFICULTTOIDENTIFYBECAUSEWORKMAYBEREPEATEDINANYNUMBEROFPLACESANDFORANYNUMBEROFREASONSPERHAPSTHEMOSTCOMMONTYPEOFREPEATEDWORKISBROWSERDETECTIONALOTOFCODEHASFORKSBASEDONTHEBROWSERSCAPABILITIESCONSIDEREVENTHANDLERADDITIONANDREMOVALASANEXAMPLETYPICALCROSSBROWSERCODEFORTHISPURPOSELOOKSLIKETHEFOLLOWINGFUNCTIONADDHANDLERTARGET,EVENTTYPE,HANDLERIFTARGETADDEVENTLISTENER/DOM2EVENTSTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IETARGETATTACHEVENT“ON“EVENTTYPE,HANDLERFUNCTIONREMOVEHANDLERTARGET,EVENTTYPE,HANDLERIFTARGETREMOVEEVENTLISTENER/DOM2EVENTSTARGETREMOVEEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IETARGETDETACHEVENT“ON“EVENTTYPE,HANDLERTHECODECHECKSFORDOMLEVEL2EVENTSSUPPORTBYTESTINGFORADDEVENTLISTENERANDREMOVEEVENTLISTENER,WHICHISSUPPORTEDBYALLMODERNBROWSERSEXCEPTINTERNETEXPLORERIFTHESEMETHODSDONTEXISTONTHETARGET,THENIEISASSUMEDANDTHEIESPECIFICMETHODSAREUSEDATFIRSTGLANCE,THESEFUNCTIONSLOOKFAIRLYOPTIMIZEDFORTHEIRPURPOSETHEHIDDENPERFORMANCEISSUEISINTHEREPEATEDWORKDONEEACHTIMEEITHERFUNCTIONISCALLEDEACHTIME,THESAMECHECKISMADETOSEEWHETHERACERTAINMETHODISPRESENTIFYOUASSUMETHATTHEONLYVALUESFORTARGETAREACTUALLYDOMOBJECTS,ANDTHATTHEUSERDOESNTMAGICALLYCHANGEHISBROWSERWHILETHEPAGEISLOADED,THENTHISEVALUATIONISREPETITIVEIFADDEVENTLISTENERWASPRESENTONTHEFIRSTCALLTOADDHANDLERTHENITSGOINGTOBEPRESENTFOREACHSUBSEQUENTCALLREPEATINGTHESAMEWORKWITHEVERYCALLTOAFUNCTIONISWASTEFUL,ANDTHEREAREACOUPLEOFWAYSTOAVOIDIT4LAZYLOADINGTHEFIRSTWAYTOELIMINATEWORKREPETITIONINFUNCTIONSISTHROUGHLAZYLOADINGLAZYLOADINGMEANSTHATNOWORKISDONEUNTILTHEINFORMATIONISNECESSARYINTHECASEOFTHEPREVIOUSEXAMPLE,THEREISNONEEDTODETERMINEWHICHWAYTOATTACHORDETACHEVENTHANDLERSUNTILSOMEONEMAKESACALLTOTHEFUNCTIONLAZYLOADEDVERSIONSOFTHEPREVIOUSFUNCTIONSLOOKLIKETHISFUNCTIONADDHANDLERTARGET,EVENTTYPE,HANDLER/OVERWRITETHEEXISTINGFUNCTIONIFTARGETADDEVENTLISTENER/DOM2EVENTSADDHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IEADDHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETATTACHEVENT“ON“EVENTTYPE,HANDLER/CALLTHENEWFUNCTIONADDHANDLERTARGET,EVENTTYPE,HANDLERFUNCTIONREMOVEHANDLERTARGET,EVENTTYPE,HANDLER/OVERWRITETHEEXISTINGFUNCTIONIFTARGETREMOVEEVENTLISTENER/DOM2EVENTSREMOVEHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEELSE/IEREMOVEHANDLERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETDETACHEVENT“ON“EVENTTYPE,HANDLER/CALLTHENEWFUNCTIONREMOVEHANDLERTARGET,EVENTTYPE,HANDLERTHESETWOFUNCTIONSIMPLEMENTALAZYLOADINGPATTERNTHEFIRSTTIMEEITHERMETHODISCALLED,ACHECKISMADETODETERMINETHEAPPROPRIATEWAYTOATTACHORDETACHTHEEVENTHANDLERTHEN,THEORIGINALFUNCTIONISOVERWRITTENWITHANEWFUNCTIONTHATCONTAINSJUSTTHEAPPROPRIATECOURSEOFACTIONTHELASTSTEPDURINGTHATFIRSTFUNCTIONCALLISTOEXECUTETHENEWFUNCTIONWITHTHEORIGINALARGUMENTSEACHSUBSEQUENTCALLTOADDHANDLERORREMOVEHANDLERAVOIDSFURTHERDETECTIONBECAUSETHEDETECTIONCODEWASOVERWRITTENBYANEWFUNCTIONCALLINGALAZYLOADINGFUNCTIONALWAYSTAKESLONGERTHEFIRSTTIMEBECAUSEITMUSTRUNTHEDETECTIONANDTHENMAKEACALLTOANOTHERFUNCTIONTOACCOMPLISHTHETASKSUBSEQUENTCALLSTOTHESAMEFUNCTION,HOWEVER,AREMUCHFASTERSINCETHEYHAVENODETECTIONLOGICLAZYLOADINGISBESTUSEDWHENTHEFUNCTIONWONTBEUSEDIMMEDIATELYONTHEPAGE5CONDITIONALADVANCELOADINGANALTERNATIVETOLAZYLOADINGFUNCTIONSISCONDITIONALADVANCELOADING,WHICHDOESTHEDETECTIONUPFRONT,WHILETHESCRIPTISLOADING,INSTEADOFWAITINGFORTHEFUNCTIONCALLTHEDETECTIONISSTILLDONEJUSTONCE,BUTITCOMESEARLIERINTHEPROCESSFOREXAMPLEVARADDHANDLERDOCUMENTBODYADDEVENTLISTENERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETADDEVENTLISTENEREVENTTYPE,HANDLER,FALSEFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETATTACHEVENT“ON“EVENTTYPE,HANDLERVARREMOVEHANDLERDOCUMENTBODYREMOVEEVENTLISTENERFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETREMOVEEVENTLISTENEREVENTTYPE,HANDLER,FALSEFUNCTIONTARGET,EVENTTYPE,HANDLERTARGETDETACHEVENT“ON“EVENTTYPE,HANDLERTHISEXAMPLECHECKSTOSEEWHETHERADDEVENTLISTENERANDREMOVEEVENTLISTENERAREPRESENTANDTHENUSESTHATINFORMATIONTOASSIGNTHEMOSTAPPROPRIATEFUNCTIONTHETERNARYOPERATORRETURNSTHEDOMLEVEL2FUNCTIONIFTHESEMETHODSAREPRESENTANDOTHERWISERETURNSTHEIESPECIFICFUNCTIONTHERESULTISTHATALLCALLSTOADDHANDLERANDREMOVEHANDLERAREEQUALLYFAST,ASTHEDETECTIONCOSTOCCURSUPFRONTCONDITIONALADVANCELOADINGENSURESTHATALLCALLSTOTHEFUNCTIONTAKETHESAMEAMOUNTOFTIMETHETRADEOFFISTHATTHEDETECTIONOCCURSASTHESCRIPTISLOADINGRATHERTHANLATERADVANCELOADINGISBESTTOUSEWHENAFUNCTIONISGOINGTOBEUSEDRIGHTAWAYANDTHENAGAINFREQUENTLYTHROUGHOUTTHELIFETIMEOFTHEPAGE6USETHEFASTPARTSEVENTHOUGHJAVASCRIPTISOFTENBLAMEDFORBEINGSLOW,THEREAREPARTSOFTHELANGUAGETHATAREINCREDIBLYFASTTHISSHOULDCOMEASNOSURPRISE,SINCEJAVASCRIPTENGINESAREBUILTINLOWERLEVELLANGUAGESANDARETHEREFORECOMPILEDTHOUGHITSEASYTOBLAMETHEENGINEWHENJAVASCRIPTAPPEARSSLOW,THEENGINEISTYPICALLYTHEFASTESTPARTOFTHEPROCESSITSYOURCODETHATISACTUALLYRUNNINGSLOWLYTHEREAREPARTSOFTHEENGINETHATAREMUCHFASTERTHANOTHERSBECAUSETHEYALLOWYOUTOBYPASSTHESLOWPARTS7BITWISEOPERATORSBITWISEOPERATORSAREONEOFTHEMOSTFREQUENTLYMISUNDERSTOODASPECTSOFJAVASCRIPTGENERALOPINIONISTHATDEVELOPERSDONTUNDERSTANDHOWTOUSETHESEOPERATORSANDFREQUENTLYMISTAKETHEMFORTHEIRBOOLEANEQUIVALENTSASARESULT,BITWISEOPERATORSAREUSEDINFREQUENTLYINJAVASCRIPTDEVELOPMENT,DESPITETHEIRADVANTAGESJAVASCRIPTNUMBERSAREALLSTOREDINIEEE75464BITFORMATFORBITWISEOPERATIONS,THOUGH,THENUMBERISCONVERTEDINTOASIGNED32BITREPRESENTATIONEACHOPERATORTHENWORKSDIRECTLYONTHIS32BITREPRESENTATIONTOACHIEVEARESULTDESPITETHECONVERSION,THISPROCESSISINCREDIBLYFASTWHENCOMPAREDTOOTHERMATHEMATICALANDBOOLEANOPERATIONSINJAVASCRIPTIFYOUREUNFAMILIARWITHBINARYREPRESENTATIONOFNUMBERS,JAVASCRIPTMAKESITEASYTOCONVERTANUMBERINTOASTRINGCONTAININGITSBINARYEQUIVALENTBYUSINGTHETOSTRINGMETHODANDPASSINGINTHENUMBER2FOREXAMPLEVARNUM125,NUM23ALERTNUM1TOSTRING2/“11001“ALERTNUM2TOSTRING2/“11“NOTETHATTHISREPRESENTATIONOMITSTHELEADINGZEROSOFANUMBERTHEREAREFOURBITWISELOGICOPERATORSINJAVASCRIPTBITWISEANDRETURNSANUMBERWITHA1INEACHBITWHEREBOTHNUMBERSHAVEA1BITWISEORRETURNSANUMBERWITHA1INEACHBITWHEREEITHERNUMBERHASA1BITWISEXORRETURNSANUMBERWITHA1INEACHBITWHEREEXACTLYONENUMBERHASA1BITWISENOTRETURNS1INEACHPOSITIONWHERETHENUMBERHASA0ANDVICEVERSATHESEOPERATORSAREUSEDASFOLLOWS/BITWISEANDVARRESULT125/1ALERTRESULTTOSTRING2/“1“/BITWISEORVARRESULT225|3/27ALERTRESUL2TOSTRING2/“11011“/BITWISEXORVARRESULT3253/26ALERTRESUL3TOSTRING2/“11000“/BITWISENOTVARRESULT25/26ALERTRESUL2TOSTRING2/“11010“THEREAREACOUPLEOFWAYSTOUSEBITWISEOPERATORSTOSPEEDUPYOURJAVASCRIPTTHEFIRSTISTOUSEBITWISEOPERATIONSINSTEADOFPUREMATHEMATICALOPERATIONSFOREXAMPLE,ITSCOMMONTOALTERNATETABLEROWCOLORSBYCALCULATINGTHEMODULUSOF2FORAGIVENNUMBER,SUCHASFORVARI0,LENROWSLENGTHILENIIFI2CLASSNAME“EVEN“ELSECLASSNAME“ODD“/APPLYCLASSCALCULATINGMOD2REQUIRESTHENUMBERTOBEDIVIDEDBY2TODETERMINETHEREMAINDERIFYOUWERETOLOOKATTHEUNDERLYING32BITREPRESENTATIONOFNUMBERS,ANUMBERISEVENIFITSFIRSTBITIS0ANDISODDIFITSFIRSTBITIS1THISCANEASILYBEDETERMINEDBYUSINGABITWISEANDOPERATIONONAGIVENNUMBERANDTHENUMBER1WHENTHENUMBERISEVEN,THERESULTOFBITWISEAND1IS0WHENTHENUMBERISODD,THERESULTOFBITWISEAND1IS1THATMEANSTHEPREVIOUSCODECANBEREWRITTENASFOLLOWSFORVARI0,LENROWSLENGTHILENIIFIELSECLASSNAME“EVEN“/APPLYCLASSALTHOUGHTHECODECHANGEISSMALL,THEBITWISEANDVERSIONISUPTO50FASTERTHANTHEORIGINALDEPENDINGONTHEBROWSERTHESECONDWAYTOUSEBITWISEOPERATORSISATECHNIQUEKNOWNASABITMASKBITMASKINGISAPOPULARTECHNIQUEINCOMPUTERSCIENCEWHENTHEREAREANUMBEROFBOOLEANOPTIONSTHATMAYBEPRESENTATTHESAMETIMETHEIDEAISTOUSEEACHBITOFASINGLENUMBERTOINDICATEWHETHERORNOTTHEOPTIONISPRESENT,EFFECTIVELYTURNINGTHENUMBERINTOANARRAYOFBOOLEANFLAGSEACHOPTIONISGIVENAVALUEEQUIVALENTTOAPOWEROF2SOTHATTHEMASKWORKSFOREXAMPLEVAROPTION_A1VAROPTION_B2VAROPTION_C4VAROPTION_D8VAROPTION_E16WITHTHEOPTIONSDEFINED,YOUCANCREATEASINGLENUMBERTHATCONTAINSMULTIPLESETTINGSUSINGTHEBITWISEOROPERATORVAROPTIONSOPTION_A|OPTION_C|OPTION_DYOUCANTHENCHECKWHETHERAGIVENOPTIONISAVAILABLEBYUSINGTHEBITWISEANDOPERATORTHEOPERATIONRETURNS0IFTHEOPTIONISNTSETAND1IFTHEOPTIONISSET/ISOPTIONAINTHELISTIFOPTIONSOPTION_A/DOSOMETHING/ISOPTIONBINTHELISTIFOPTIONSOPTION_B/DOSOMETHINGBITMASKOPERATIONSSUCHASTHISAREQUITEFASTBECAUSE,ASMENTIONEDPREVIOUSLY,THEWORKISHAPPENINGATALOWERLEVELOFTHESYSTEMIFTHEREAREANUMBEROFOPTIONSTHATAREBEINGSAVEDTOGETHERANDCHECKEDFREQUENTLY,BITMASKSCANHELPTOSPEEDUPTHEOVERALLAPPROACH8NATIVEMETHODSNOMATTERHOWOPTIMALYOURJAVASCRIPTCODEIS,ITWILLNEVERBEFASTERTHANTHENATIVEMETHODSPROVIDEDBYTHEJAVASCRIPTENGINETHEREASONFORTHISISSIMPLETHENATIVEPARTSOFJAVASCRIPTTHOSEALREADYPRESENTINTHEBROWSERBEFOREYOUWRITEALINEOFCODEAREALLWRITTENINALOWERLEVELLANGUAGESUCHASCTHATMEANSTHESEMETHODSARECOMPILEDDOWNTOMACHINECODEASPARTOFTHEBROWSERANDTHEREFOREDONTHAVETHESAMELIMITATIONSASYOURJAVASCRIPTCODEACOMMONMISTAKEOFINEXPERIENCEDJAVASCRIPTDEVELOPERSISTOPERFORMCOMPLEXMATHEMATICALOPERATIONSINCODEWHENTHEREAREBETTERPERFORMINGVERSIONSAVAILABLEONTHEBUILTINMATHOBJECTTHEMATHOBJECTCONTAINSPROPERTIESANDMETHODSDESIGNEDTOMAKEMATHEMATICALOPERATIONSEASIERTHEREARESEVERALMATHEMATICALCONSTANTSAVAILABLEEACHOFTHESEVALUESISPRECALCULATED,