ജാവാസ്ക്രിപ്റ്റ് കോഡിലെ പാഠത്തിന്റെ മൂന്നാം ഭാഗം. ലളിതമായ ശുപാർശകൾഎളുപ്പത്തിൽ പരിപാലിക്കാവുന്ന ഒരു പ്രോജക്റ്റ് സൃഷ്ടിക്കാൻ.

സൂചിപ്പിച്ച തരത്തിലുള്ള പരിവർത്തനങ്ങൾ ഒഴിവാക്കുക

വേരിയബിൾ തരങ്ങളെ താരതമ്യം ചെയ്യുമ്പോൾ അവയെ പരിവർത്തനം ചെയ്യുന്നത് ജാവാസ്ക്രിപ്റ്റിൽ ഉൾപ്പെടുന്നു. അതിനാൽ, തെറ്റ് == 0 അല്ലെങ്കിൽ "" == 0 പോലുള്ള താരതമ്യങ്ങൾ ശരി എന്ന് നൽകുന്നു.

സൂചിപ്പിക്കപ്പെട്ട തരം പരിവർത്തനം മൂലമുണ്ടാകുന്ന പ്രശ്നങ്ങൾ ഒഴിവാക്കാൻ, താരതമ്യം ചെയ്യപ്പെടുന്ന എക്സ്പ്രഷനുകളുടെ മൂല്യങ്ങളും തരങ്ങളും പരിശോധിക്കാൻ എപ്പോഴും ===, !== ഓപ്പറേറ്റർമാർ ഉപയോഗിക്കുക:

== ഓപ്പറേറ്റർ മതിയാകുമ്പോൾ === ഓപ്പറേറ്ററുടെ അമിതമായ ഉപയോഗമായി കണക്കാക്കുന്ന മറ്റൊരു പ്രോഗ്രാമിംഗ് സ്കൂളുണ്ട്. ഉദാഹരണത്തിന്, ടൈപ്പ് ഓഫ് ഉപയോഗിക്കുമ്പോൾ, അത് ഒരു സ്ട്രിംഗ് നൽകുന്നു, കർശനമായ പൊരുത്തപ്പെടുത്തൽ ആവശ്യമില്ല. എന്നാൽ JSLint-ന് കർശനമായ അനുരൂപീകരണം ആവശ്യമാണ്. കൂടാതെ, കോഡ് കൂടുതൽ യോജിപ്പായി കാണുകയും വായിക്കുമ്പോൾ ചിന്തയുടെ അളവ് കുറയ്ക്കുകയും ചെയ്യും (" ഈ ഓപ്പറേറ്റർ== മനപ്പൂർവ്വമോ അബദ്ധത്തിൽ ഉപയോഗിച്ചതോ?").

eval() ഉപയോഗിക്കുന്നത് ഒഴിവാക്കുക

eval() ഫംഗ്ഷൻ ഒരു അനിയന്ത്രിതമായ സ്ട്രിംഗ് എടുത്ത് ജാവാസ്ക്രിപ്റ്റ് കോഡായി എക്സിക്യൂട്ട് ചെയ്യുന്നു. കോഡ് അറിയാമെങ്കിൽ (പ്രോസസ് എക്സിക്യൂഷൻ സമയത്ത് നിർണ്ണയിച്ചിട്ടില്ലെങ്കിൽ), eval() ഉപയോഗിക്കുന്നതിന് ഒരു കാരണവുമില്ല. റൺടൈമിൽ കോഡ് ചലനാത്മകമായി ജനറേറ്റുചെയ്യുകയാണെങ്കിൽ, ലക്ഷ്യം കൈവരിക്കാൻ പലപ്പോഴും സാധ്യമാണ് മികച്ച രീതി eval() ഉപയോഗിക്കുന്നതിനേക്കാൾ, ഉദാഹരണത്തിന്, പ്രോപ്പർട്ടികൾ ഡൈനാമിക് ആയി ആക്സസ് ചെയ്യാൻ ചതുര ബ്രാക്കറ്റ് നൊട്ടേഷൻ ഉപയോഗിക്കുന്നത് മികച്ചതും ലളിതവുമാണ്:

// മോശം var പ്രോപ്പർട്ടി = "പേര്"; മുന്നറിയിപ്പ് (eval("obj." + പ്രോപ്പർട്ടി)); // ഇത് ചെയ്യുന്നതാണ് അഭികാമ്യം var പ്രോപ്പർട്ടി = "പേര്"; മുന്നറിയിപ്പ് (obj);

നിങ്ങൾ ഹാനികരമായ കോഡ് (ഉദാഹരണത്തിന്, നെറ്റ്‌വർക്കിൽ നിന്ന് ലഭിച്ച) നിർവ്വഹിക്കുന്നതിനാൽ, eval() ഉപയോഗിക്കുന്നത് സുരക്ഷാ പ്രത്യാഘാതങ്ങൾ ഉണ്ടാക്കും. ഒരു JSON പ്രതികരണവുമായി പ്രവർത്തിക്കുമ്പോൾ വളരെ സാധാരണമായ ഒരു മോശം രീതി AJAX അഭ്യർത്ഥന. IN ഈ സാഹചര്യത്തിൽപ്രശ്നം പരിഹരിക്കാൻ JSON പ്രതികരണം പാഴ്‌സ് ചെയ്യാൻ ബ്രൗസറിന്റെ ബിൽറ്റ്-ഇൻ രീതികൾ ഉപയോഗിക്കുന്നതാണ് നല്ലത് സുരക്ഷിതമായ രീതിശരിയാണ്. JSON.parse() പിന്തുണയ്ക്കാത്ത ബ്രൗസറുകൾക്ക്, നിങ്ങൾക്ക് JSON.org-ൽ നിന്നുള്ള ലൈബ്രറി ഉപയോഗിക്കാം.

setInterval() , setTimeout() , ഫംഗ്ഷൻ() കൺസ്ട്രക്റ്റർ എന്നിവയിലേക്ക് സ്ട്രിംഗുകൾ കൈമാറുന്നത് മിക്ക കേസുകളിലും eval() ഉപയോഗിക്കുന്നതിന് സമാനമാണ് എന്നതും ഓർത്തിരിക്കേണ്ടത് പ്രധാനമാണ്. അതിനാൽ, അത്തരം പ്രവർത്തനങ്ങൾ ഒഴിവാക്കണം. പശ്ചാത്തലത്തിൽ, നിങ്ങൾ കടന്നുപോകുന്ന സ്ട്രിംഗുകളെ JavaScript വിലയിരുത്തുകയും നടപ്പിലാക്കുകയും ചെയ്യുന്നു പ്രോഗ്രാം കോഡ്:

// മോശം സെറ്റ് ടൈംഔട്ട് ("myFunc()", 1000); setTimeout("myFunc(1, 2, 3)", 1000); //വെയിലത്ത് setTimeout(myFunc, 1000); setTimeout(function () ( myFunc(1, 2, 3); ), 1000);

പുതിയ ഫംഗ്ഷൻ() കൺസ്ട്രക്റ്റർ ഉപയോഗിക്കുന്നത് eval() ന് സമാനമാണ്, അത് ജാഗ്രതയോടെ ഉപയോഗിക്കേണ്ടതാണ്. ഈ ശക്തമായ ഉപകരണം, എന്നാൽ പലപ്പോഴും തെറ്റായി ഉപയോഗിക്കുന്നു. നിങ്ങൾ തീർച്ചയായും eval() ഉപയോഗിക്കേണ്ടതുണ്ടെങ്കിൽ, പകരം പുതിയ ഫംഗ്ഷൻ() ഉപയോഗിക്കുന്നത് പരിഗണിക്കുക. പുതിയ ഫംഗ്‌ഷനിൽ () നിർവചിച്ചിരിക്കുന്ന കോഡ് ഫംഗ്‌ഷന്റെ ലോക്കൽ സ്‌പെയ്‌സിൽ പ്രവർത്തിക്കുമെന്നതിനാൽ ഒരു ചെറിയ സാധ്യതയുള്ള പ്രയോജനമുണ്ട്, അതിനാൽ നിർവചിച്ചിരിക്കുന്ന കോഡിലെ ഒരു var ഡയറക്‌ടീവ് ഉപയോഗിച്ച് നിർവചിച്ചിരിക്കുന്ന വേരിയബിളുകൾ സ്വയമേവ ആഗോളമാകില്ല. ഒഴിവാക്കാനുള്ള മറ്റൊരു വഴി യാന്ത്രിക കണ്ടെത്തൽഗ്ലോബൽ വേരിയബിളുകൾ - ഒരു ഫംഗ്ഷനിൽ eval() കോൾ പൊതിയുക.

ഇനിപ്പറയുന്ന ഉദാഹരണം പരിഗണിക്കുക. ഇവിടെ un മാത്രം ഒരു ആഗോള വേരിയബിളായി അവശേഷിക്കുന്നു, ഇത് നെയിംസ്പേസിനെ മലിനമാക്കുന്നു:

Console.log(typeof un); // "undefined" console.log(deux തരം); // "undefined" console.log(ട്രോയിസിന്റെ തരം); // "undefined" var jsstring = "var un = 1; console.log(un);"; eval (jsstring); // ലോഗുകൾ "1" jsstring = "var deux = 2; console.log(deux);"; പുതിയ പ്രവർത്തനം(jsstring)(); // ലോഗുകൾ "2" jsstring = "var trois = 3; console.log(trois);"; (ഫംഗ്ഷൻ () ( eval (jsstring); )()); // ലോഗുകൾ "3" console.log(typeof un); // നമ്പർ console.log(deux തരം); // undefined console.log(trois തരം); //നിർവചിക്കപ്പെട്ടിട്ടില്ല

eval() ഉം പുതിയ ഫംഗ്‌ഷൻ() കൺസ്ട്രക്‌ടറും തമ്മിലുള്ള മറ്റൊരു വ്യത്യാസം, eval() ന് നെയിംസ്‌പേസ് ശൃംഖലയെ ഓവർലാപ്പ് ചെയ്യാൻ കഴിയും എന്നതാണ്, അതേസമയം ഫംഗ്‌ഷൻ എക്‌സിക്യൂഷൻ ഒരു സാൻഡ്‌ബോക്‌സിൽ സംഭവിക്കുന്നു. നിങ്ങൾ ഫംഗ്‌ഷൻ എവിടെ എക്സിക്യൂട്ട് ചെയ്യുന്നു എന്നത് പ്രശ്നമല്ല, അത് മാത്രം ഉപയോഗിക്കുന്നു ആഗോള ഇടംപേരുകൾ അതിനാൽ ഇത് മലിനീകരിക്കുന്നത് കുറവാണ് പ്രാദേശിക ഇടംപേരുകൾ ഇനിപ്പറയുന്ന ഉദാഹരണത്തിൽ, eval() ന് അതിന്റെ ബാഹ്യ നെയിംസ്‌പേസിൽ വേരിയബിളുകൾ ആക്‌സസ് ചെയ്യാനും പരിഷ്‌ക്കരിക്കാനും കഴിയും, പക്ഷേ ഫംഗ്ഷന് കഴിയില്ല (ഫംഗ്ഷന്റെയും പുതിയ ഫംഗ്ഷന്റെയും ഉപയോഗം സമാനമാണ്):

(ഫംഗ്ഷൻ () ( var ലോക്കൽ = 1; eval ("local = 3; console.log(local)"); // ലോഗുകൾ "3" console.log(local); // ലോഗുകൾ "3" )()); (ഫംഗ്ഷൻ () ( var ലോക്കൽ = 1; ഫംഗ്ഷൻ("console.log(ടൈപ്പ് ലോക്കൽ);")(); // ലോഗുകൾ "നിർവചിക്കാത്തത്" )());

parseInt() ഉപയോഗിച്ച് ഒരു നമ്പർ പരിവർത്തനം ചെയ്യുന്നു

parseInt() ഉപയോഗിച്ച് നിങ്ങൾക്ക് ഒരു സ്ട്രിംഗിൽ നിന്ന് ഒരു നമ്പർ ലഭിക്കും. ഫംഗ്ഷൻ രണ്ടാമത്തെ പാരാമീറ്റർ എടുക്കുന്നു - നമ്പർ സിസ്റ്റത്തിന്റെ അടിസ്ഥാനം, അത് പലപ്പോഴും ഒഴിവാക്കപ്പെടുന്നു. പക്ഷേ വെറുതെ. 0-ൽ ആരംഭിക്കുന്ന ഒരു സ്‌ട്രിംഗ് പാഴ്‌സ് ചെയ്യേണ്ടിവരുമ്പോൾ പ്രശ്‌നം സംഭവിക്കുന്നു: ഉദാഹരണത്തിന്, ഒരു ഫോം ഫീൽഡിൽ നൽകിയ തീയതിയുടെ ഭാഗം. 0-ൽ ആരംഭിക്കുന്ന ഒരു സ്ട്രിംഗ് ഇതായി കണക്കാക്കുന്നു അഷ്ടസംഖ്യ(radix 8), ഇത് ECMAScript 3-ൽ നിർവചിച്ചിരിക്കുന്നു (എന്നാൽ ECMAScript 5-ൽ മാറ്റി). പൊരുത്തക്കേടുകളും അപ്രതീക്ഷിത ഫലങ്ങളും ഒഴിവാക്കാൻ, നിങ്ങൾ എല്ലായ്പ്പോഴും റാഡിക്സ് പാരാമീറ്റർ ഉപയോഗിക്കണം:

വർഷം = "06", വർഷം = "09"; മാസം = parseInt(മാസം, 10); വർഷം = parseInt(വർഷം, 10);

IN ഈ ഉദാഹരണത്തിൽ, നിങ്ങൾ radix പാരാമീറ്റർ ഒഴിവാക്കുകയാണെങ്കിൽ (ഫംഗ്‌ഷനെ parseInt(വർഷം) എന്ന് വിളിക്കുക), നിങ്ങൾക്ക് മൂല്യം 0 ലഭിക്കും, കാരണം “09” ഒരു ഒക്ടൽ സംഖ്യയാണ് (നിങ്ങൾ parseInt(വർഷം, 8) എന്ന് വിളിക്കുന്നത് പോലെ) കൂടാതെ 09 ആണ് അടിസ്ഥാന 8-ൽ തെറ്റായ സംഖ്യ.

ഇതര രീതികൾഒരു സ്ട്രിംഗ് ഒരു സംഖ്യയിലേക്ക് പരിവർത്തനം ചെയ്യുന്നു:

+"08" // ഫലം 8 നമ്പർ("08") // 8

ഈ രീതികൾ പലപ്പോഴും parseInt() നേക്കാൾ വേഗതയുള്ളതാണ്, കാരണം parseInt() ലളിതമായ പരിവർത്തനത്തേക്കാൾ സ്ട്രിംഗ് പാഴ്‌സിംഗ് ചെയ്യുന്നു. എന്നാൽ ഇൻപുട്ട് "08 ഹലോ" എന്ന രൂപത്തിൽ ആയിരിക്കാമെന്ന് നിങ്ങൾ അനുമാനിക്കുകയാണെങ്കിൽ, parseInt() ഒരു നമ്പർ നൽകും, മറ്റ് രീതികൾ പരാജയപ്പെടുകയും NaN നൽകുകയും ചെയ്യും.

കോഡ് ആവശ്യകതകൾ

കോഡ് ആവശ്യകതകൾ തയ്യാറാക്കുകയും അവ പിന്തുടരുകയും ചെയ്യേണ്ടത് പ്രധാനമാണ് - അത്തരമൊരു ഘട്ടം കോഡ് സ്ഥിരതയുള്ളതും പ്രവചിക്കാവുന്നതും ഗണ്യമായി എളുപ്പവും മനസ്സിലാക്കാവുന്നതുമാക്കും. കോഡ് ആവശ്യകതകൾ പിന്തുടരുന്ന നിങ്ങളുടെ ടീമിലെ ഒരു പുതിയ ഡെവലപ്പർ, മറ്റ് പ്രോജക്റ്റ് പങ്കാളികൾ എഴുതിയ കോഡ് സ്വീകരിച്ച് വളരെ വേഗത്തിൽ പ്രവർത്തന താളത്തിലേക്ക് പ്രവേശിക്കും.

ചർച്ച ചെയ്യുമ്പോൾ ഗുരുതരമായ ഏറ്റുമുട്ടലുകളും ഏറ്റുമുട്ടലുകളും ഉണ്ടാകുന്നു വിവിധ വശങ്ങൾകോഡ് ആവശ്യകതകൾ (ഉദാഹരണത്തിന്, സ്‌പെയ്‌സുകളോ ടാബുകളോ ഉപയോഗിച്ച് ഇൻഡന്റ് ചെയ്യണോ എന്ന്). അതിനാൽ, കോഡ് ആവശ്യകതകൾ അവതരിപ്പിക്കുമ്പോൾ, നിങ്ങൾ ചർച്ചകൾക്ക് ഗൗരവമായി തയ്യാറാകേണ്ടതുണ്ട്. എന്നാൽ പദ്ധതിയുടെ നിലനിൽപ്പിനും വിജയകരമായ വികസനത്തിനും കോഡ് ആവശ്യകതകളും അവ കർശനമായി പാലിക്കുന്നതും വളരെ പ്രധാനമാണ്.

ഇൻഡന്റേഷനുകൾ

ചില ഡെവലപ്പർമാർ ഇൻഡന്റേഷനായി ടാബുകൾ ഉപയോഗിക്കാൻ ഇഷ്ടപ്പെടുന്നു, കാരണം എല്ലാവർക്കും അവരുടെ മുൻഗണനകൾ അനുസരിച്ച് ടാബുകൾക്ക് പകരം നിശ്ചിത എണ്ണം സ്‌പെയ്‌സുകൾ ഔട്ട്‌പുട്ട് ചെയ്യുന്നതിന് അവരുടെ എഡിറ്റർ കോൺഫിഗർ ചെയ്യാൻ കഴിയും. മറ്റുള്ളവർ ഇടങ്ങൾ ഉപയോഗിക്കാൻ ഇഷ്ടപ്പെടുന്നു. പ്രശ്നത്തിന്റെ സാരാംശത്തിന്, ഇത് പ്രധാനമല്ല, പ്രധാന കാര്യം നിലവിലെ കോഡ് ആവശ്യകതകളിൽ ഇൻഡന്റേഷനുകൾ നിർവചിച്ചിരിക്കുന്നു എന്നതാണ്.

ഇൻഡന്റേഷനുകൾ എവിടെയാണ് നിർമ്മിക്കേണ്ടത്? നിയമം ലളിതമാണ് - എവിടെയാണെങ്കിലും ബ്രേസുകൾ. അതായത്, ഫംഗ്‌ഷനുകളുടെ ബോഡിയിൽ, ലൂപ്പുകൾ (do, while, for, for-in), if and switch Statements, object properties. ഇൻഡന്റേഷൻ ഉപയോഗിക്കുന്നതിനുള്ള ഉദാഹരണങ്ങൾ ഇനിപ്പറയുന്ന കോഡ് കാണിക്കുന്നു:

ഫംഗ്ഷൻ ബാഹ്യ(a, b) (var c = 1, d = 2, ആന്തരികം; എങ്കിൽ (a > b) (ആന്തരികം = പ്രവർത്തനം () (റിട്ടേൺ ( r: c - d ); ) ) else ( അകം = പ്രവർത്തനം ( ) (റിട്ടേൺ (r: c + d); ) അകത്തേക്ക് മടങ്ങുക; )

ബ്രേസുകൾ

ചുരുണ്ട ബ്രേസുകൾ എപ്പോഴും ഉപയോഗിക്കേണ്ടതാണ്, അവ ഓപ്‌ഷനുകളാണെങ്കിൽ പോലും. സാങ്കേതികമായി, if അല്ലെങ്കിൽ for സ്റ്റേറ്റ്‌മെന്റിൽ നിങ്ങൾക്ക് ഒരു എക്‌സ്‌പ്രഷൻ മാത്രമേ ഉള്ളൂവെങ്കിൽ, ചുരുണ്ട ബ്രേസുകൾ ആവശ്യമില്ല, എന്നാൽ അവ എന്തായാലും ഉപയോഗിക്കേണ്ടതാണ്. അവർ കോഡ് കൂടുതൽ സ്ഥിരതയുള്ളതും വിപുലീകരിക്കാൻ എളുപ്പവുമാക്കുന്നു.

നിങ്ങൾക്ക് ഒരു എക്സ്പ്രഷൻ ഉള്ള ഒരു ലൂപ്പ് ഉണ്ടെന്ന് സങ്കൽപ്പിക്കുക. നിങ്ങൾക്ക് പരാൻതീസിസുകൾ ഒഴിവാക്കാം, അത് സംഭവിക്കില്ല വാക്യഘടന പിശക്:

// മോശം (var i = 0; i< 10; i += 1) alert(i);

എന്നാൽ നിങ്ങൾക്ക് പിന്നീട് ലൂപ്പിന്റെ ബോഡിയിലേക്ക് മറ്റൊരു വരി ചേർക്കേണ്ടി വന്നാലോ?

// മോശം (var i = 0; i< 10; i += 1) alert(i); alert(i + " is " + (i % 2 ? "odd" : "even"));

രണ്ടാമത് മുന്നറിയിപ്പ് പ്രവർത്തനംലൂപ്പിന് പുറത്താണ്, ഇൻഡന്റേഷൻ നിങ്ങളെ ഒരു മോശം തമാശ കളിക്കും. ഒറ്റവരി ബ്ലോക്കിന് പോലും എപ്പോഴും പരാൻതീസിസുകൾ ഉപയോഗിക്കുന്നതാണ് ഭാവിയിൽ നല്ലത്:

// വെയിലത്ത് (var i = 0; i< 10; i += 1) { alert(i); }

കൂടാതെ വ്യവസ്ഥകൾക്കായി:

// (ശരി) അലേർട്ട് (1) ആണെങ്കിൽ മോശം; മറ്റ് മുന്നറിയിപ്പ് (2); // വെയിലത്ത് (ശരി) (അലേർട്ട് (1); ) വേറെ (അലേർട്ട് (2); )

ബ്രാക്കറ്റ് സ്ഥാനം തുറക്കുക

ചോദ്യം പലപ്പോഴും ഉയർന്നുവരുന്നു: തുറന്ന പരാൻതീസിസ് എവിടെ സ്ഥാപിക്കണം - അതേ വരിയിൽ അല്ലെങ്കിൽ അടുത്തത്?

(ശരി) ആണെങ്കിൽ (അലേർട്ട് ("സന്ദേശം!"); )

(ശരി) ആണെങ്കിൽ (അലേർട്ട് ("സന്ദേശം"); )

ഈ ഉദാഹരണത്തിൽ, ബ്രാക്കറ്റിന്റെ സ്ഥാനം മുൻഗണനയുടെ കാര്യമാണ്. എന്നാൽ ബ്രാക്കറ്റിന്റെ സ്ഥാനം അനുസരിച്ച് പ്രോഗ്രാം വ്യത്യസ്തമായി പെരുമാറുന്ന സന്ദർഭങ്ങളുണ്ട്. അർദ്ധവിരാമം ചേർക്കൽ സംവിധാനം കാരണം ഈ സാഹചര്യം സംഭവിക്കുന്നു - നിങ്ങൾ വരി ശരിയായി അവസാനിപ്പിക്കരുതെന്ന് തിരഞ്ഞെടുക്കുമ്പോൾ JavaScript മനസ്സിലാക്കുന്നില്ല, കൂടാതെ നിങ്ങൾക്കായി അർദ്ധവിരാമം ചേർക്കും. ഫംഗ്‌ഷൻ ഒരു അക്ഷരീയ ഒബ്‌ജക്‌റ്റ് തിരികെ നൽകുകയും ഓപ്പൺ പരാൻതീസിസ് ഇനിപ്പറയുന്ന വരിയിലായിരിക്കുകയും ചെയ്യുമ്പോൾ ഈ സ്വഭാവം പ്രശ്‌നങ്ങളുണ്ടാക്കാം:

// മുന്നറിയിപ്പ്: അപ്രതീക്ഷിത റിട്ടേൺ ഫംഗ്‌ഷൻ ഫങ്‌ക്() (റിട്ടേൺ // ഒരിക്കലും എക്‌സിക്യൂട്ട് ചെയ്യപ്പെടാത്ത കോഡിന്റെ ഒരു ബ്ലോക്ക് പിന്തുടരുന്നു (പേര്: "ബാറ്റ്മാൻ" ) )

നിങ്ങൾ അത് പ്രതീക്ഷിച്ചിരുന്നെങ്കിൽ ഈ പ്രവർത്തനംപ്രോപ്പർട്ടി എന്ന പേരുള്ള ഒരു വസ്തു തിരികെ നൽകുന്നു, നിങ്ങൾ അരോചകമായി ആശ്ചര്യപ്പെടും. സൂചിപ്പിക്കുന്ന അർദ്ധവിരാമം കാരണം, ഫംഗ്ഷൻ നിർവചിക്കാതെ മടങ്ങിവരും. മുമ്പത്തെ കോഡ് ഇനിപ്പറയുന്ന ബ്ലോക്കിന് തുല്യമാണ്:

// മുന്നറിയിപ്പ്: അപ്രതീക്ഷിത റിട്ടേൺ ഫംഗ്‌ഷൻ ഫങ്‌ക്() ( നിർവചിക്കാതെ മടങ്ങുക; // ഒരിക്കലും എക്‌സിക്യൂട്ട് ചെയ്യാത്ത കോഡിന്റെ ഒരു ബ്ലോക്ക് പിന്തുടരുന്നു (പേര്: "ബാറ്റ്മാൻ" ) )

ഫംഗ്ഷൻ ഫങ്‌ക്() (റിട്ടേൺ (പേര്: "ബാറ്റ്മാൻ" ); )

അർദ്ധവിരാമം ശ്രദ്ധിക്കുക. ചുരുണ്ട ബ്രേസുകൾ പോലെ, നിങ്ങൾ എല്ലായ്പ്പോഴും ഒരു അർദ്ധവിരാമം ഉപയോഗിക്കണം, അത് ഘടനയാൽ സൂചിപ്പിക്കുമ്പോൾ പോലും ജാവാസ്ക്രിപ്റ്റ് കോഡ്. ഇത് അച്ചടക്കം സൃഷ്ടിക്കുകയും കോഡിംഗിന് കൂടുതൽ കർശനമായ സമീപനം നൽകുകയും മാത്രമല്ല, മുകളിലുള്ള ഉദാഹരണം പോലെയുള്ള അവ്യക്തമായ സാഹചര്യങ്ങൾ ഒഴിവാക്കാനും ഇത് സഹായിക്കുന്നു.

JavaScript മനോഹരമാണ് ലളിതമായ ഭാഷയിൽഅത് പഠിക്കാൻ തുടങ്ങാൻ ആഗ്രഹിക്കുന്നവർക്ക്, എന്നാൽ അതിൽ വൈദഗ്ദ്ധ്യം നേടുന്നതിന്, നിങ്ങൾ വളരെയധികം പരിശ്രമിക്കേണ്ടതുണ്ട്.

തുടക്കക്കാർ പലപ്പോഴും ചില സാധാരണ തെറ്റുകൾ വരുത്തുന്നു, അത് അവർ പ്രതീക്ഷിക്കാത്ത സമയത്ത് അവരെ വേട്ടയാടുന്നു. ഈ പിശകുകൾ എന്താണെന്ന് മനസിലാക്കാൻ, ഈ ലേഖനം വായിക്കുക.

1. ചുരുണ്ട ബ്രേസുകൾ ഒഴിവാക്കുന്നു

JavaScript തുടക്കക്കാർ പലപ്പോഴും വരുത്തുന്ന തെറ്റുകളിലൊന്ന് if, else, while, and for തുടങ്ങിയ പ്രസ്താവനകൾക്ക് ശേഷം ചുരുണ്ട ബ്രേസുകൾ ഒഴിവാക്കുന്നതാണ്. ഇത് നിരോധിക്കപ്പെട്ടിട്ടില്ലെങ്കിലും, നിങ്ങൾ വളരെ ശ്രദ്ധാലുവായിരിക്കണം, കാരണം ഇത് ഒരു മറഞ്ഞിരിക്കുന്ന പ്രശ്നമുണ്ടാക്കുകയും പിന്നീട് ഒരു പിശകിലേക്ക് നയിക്കുകയും ചെയ്യും.

ചുവടെയുള്ള ഉദാഹരണം കാണുക:

ജെ.എസ്

// ഈ കോഡ് അത് ചെയ്യേണ്ടത് ചെയ്യുന്നില്ല! if(name === undefined) console.log("ദയവായി ഒരു ഉപയോക്തൃനാമം നൽകുക!"); പരാജയം (); // എക്സിക്യൂഷൻ ഒരിക്കലും ഈ ലൈനിൽ എത്തില്ല: വിജയം(പേര്); ) ഫംഗ്‌ഷൻ വിജയം(പേര്)( console.log("ഹലോ, " + പേര് + "!"); ) ഫംഗ്‌ഷൻ പരാജയം())( പുതിയ പിശക് എറിയുക("പേര് കാണുന്നില്ല. ഹലോ പറയാൻ കഴിയില്ല!"); )

fail() കോൾ ഇൻഡന്റ് ചെയ്‌ത് ഒരു if സ്റ്റേറ്റ്‌മെന്റിന്റേതാണെന്ന് തോന്നുമെങ്കിലും, അത് അങ്ങനെയല്ല. എന്നും വിളിക്കാറുണ്ട്. അപ്പോൾ അത് എന്താണ് ഉപയോഗപ്രദമായ പരിശീലനംകോഡിന്റെ എല്ലാ ബ്ലോക്കുകളും ചുരുണ്ട ബ്രേസുകൾ ഉപയോഗിച്ച് ചുറ്റുക, അവയിൽ ഒരു പ്രസ്താവന മാത്രമേ അടങ്ങിയിട്ടുള്ളൂ.

2. അർദ്ധവിരാമങ്ങൾ ഇല്ല

JavaScript പാഴ്‌സ് ചെയ്യുമ്പോൾ, ഓട്ടോമാറ്റിക് അർദ്ധവിരാമം എന്നറിയപ്പെടുന്ന ഒരു പ്രക്രിയ നടക്കുന്നു. പേര് സൂചിപ്പിക്കുന്നത് പോലെ, അനലൈസർ നിങ്ങൾക്കായി നഷ്‌ടമായ പ്രതീകങ്ങൾ പൂരിപ്പിക്കുന്നു.

തുടക്കക്കാർക്ക് JavaScript കൂടുതൽ ആക്സസ് ചെയ്യാവുന്നതും എഴുതാൻ എളുപ്പവുമാക്കുക എന്നതാണ് ഈ സവിശേഷതയുടെ ലക്ഷ്യം. എന്നിരുന്നാലും, നിങ്ങൾ എല്ലായ്പ്പോഴും അർദ്ധവിരാമം സ്വയം ചേർക്കണം, കാരണം അത് നഷ്‌ടപ്പെടാനുള്ള സാധ്യതയുണ്ട്.

ഒരു ഉദാഹരണം ഇതാ:

ജെ.എസ്

// ഈ കോഡ് പ്രോസസ്സ് ചെയ്യുന്നതിന്റെ ഫലം ഒരു പിശക് സന്ദേശമായിരിക്കും. ഒരു അർദ്ധവിരാമം ചേർക്കുന്നത് പ്രശ്നം പരിഹരിക്കും. console.log("ഫെലോഷിപ്പിന് സ്വാഗതം!") ["ഫ്രോഡോ", "ഗാൻഡാൽഫ്", "ലെഗോലസ്", "ഗിംലി"].forEach(function(name)( hello(name) )) ഫംഗ്‌ഷൻ hello(name)( console. ലോഗ്("ഹലോ, " + പേര് + "!") )

ലൈൻ 3-ൽ അർദ്ധവിരാമം ഇല്ലാത്തതിനാൽ, ലൈൻ 5-ലെ ഓപ്പണിംഗ് പരാന്തീസിസ് ഒരു പ്രത്യേക അറേയ്‌ക്ക് പകരം അറേ ആക്‌സസ്സർ സിന്റാക്‌സ് (ബഗ് #8 കാണുക) ഉപയോഗിച്ച് ഒരു പ്രോപ്പർട്ടി ആക്‌സസ് ചെയ്യാനുള്ള ശ്രമമാണെന്ന് പാഴ്‌സർ അനുമാനിക്കുന്നു, അത് അങ്ങനെയല്ല. ആകാൻ.

ഇത് ഒരു പിശകിന് കാരണമാകുന്നു. പരിഹാരം ലളിതമാണ് - എല്ലായ്പ്പോഴും ഒരു അർദ്ധവിരാമം ഇടുക.

ചിലർ അനുഭവിച്ചിട്ടുണ്ട് ജാവാസ്ക്രിപ്റ്റ് ഡെവലപ്പർമാർഅർദ്ധവിരാമങ്ങൾ ഉപയോഗിക്കാതിരിക്കാൻ താൽപ്പര്യപ്പെടുന്നു, പക്ഷേ അവർക്ക് നന്നായി അറിയാം സാധ്യമായ പിശകുകൾ, അവ എങ്ങനെ തടയാം.

3. തരം കാസ്റ്റുകളുടെ തെറ്റിദ്ധാരണ

JavaScript പിന്തുണയ്ക്കുന്നു ചലനാത്മക തരങ്ങൾ. ഇതിനർത്ഥം ഒരു പുതിയ വേരിയബിൾ പ്രഖ്യാപിക്കുമ്പോൾ നിങ്ങൾക്ക് തരം വ്യക്തമാക്കേണ്ടതില്ല, നിങ്ങൾക്ക് അതിന്റെ മൂല്യം സ്വതന്ത്രമായി പുനർനിർമ്മിക്കുകയോ പരിവർത്തനം ചെയ്യുകയോ ചെയ്യാം.

ഇത് C# അല്ലെങ്കിൽ Java എന്നതിനേക്കാൾ JavaScript വളരെ ലളിതമാക്കുന്നു. എന്നാൽ ഇത് പിശകുകളുടെ അപകടസാധ്യത നിറഞ്ഞതാണ്, ഇത് മറ്റ് ഭാഷകളിൽ സമാഹാര ഘട്ടത്തിൽ കണ്ടെത്തുന്നു.

ഒരു ഉദാഹരണം ഇതാ:

ജെ.എസ്

// ഒരു ടെക്സ്റ്റ് ബോക്സിൽ നിന്നുള്ള ഒരു ഇൻപുട്ട് ഇവന്റിനായി കാത്തിരിക്കുക var textBox = document.querySelector("input"); textBox.addEventListener("ഇൻപുട്ട്", ഫംഗ്‌ഷൻ())( // textBox.value-ൽ ഒരു സ്ട്രിംഗ് അടങ്ങിയിരിക്കുന്നു. 10-ൽ ചേർക്കുമ്പോൾ // "10" എന്ന സ്ട്രിംഗ് അടങ്ങിയിരിക്കുന്നു, പക്ഷേ അത് ചേർക്കുന്നില്ല. console.log(textBox.value + " + 10 = " + (textBox.value + 10)); );

HTML

10 ചേർക്കുന്നതിന് മുമ്പ് സ്ട്രിംഗ് ഒരു സംഖ്യയിലേക്ക് പരിവർത്തനം ചെയ്യാൻ parseInt(textBox.value, 10) ഉപയോഗിച്ച് പ്രശ്നം എളുപ്പത്തിൽ പരിഹരിക്കാനാകും.

നിങ്ങൾ വേരിയബിൾ ഉപയോഗിക്കുന്ന രീതിയെ ആശ്രയിച്ച്, റൺടൈം അത് ഒരു തരത്തിലേക്കോ മറ്റൊന്നിലേക്കോ പരിവർത്തനം ചെയ്യണമെന്ന് തീരുമാനിച്ചേക്കാം. ഇതിനെ ടൈപ്പ് കാസ്റ്റ് എന്ന് വിളിക്കുന്നു.

if സ്റ്റേറ്റ്‌മെന്റിലെ വേരിയബിളുകൾ താരതമ്യം ചെയ്യുമ്പോൾ തരം പരിവർത്തനം തടയുന്നതിന്, നിങ്ങൾക്ക് ഉപയോഗിക്കാം കർശനമായ സമത്വ പരിശോധന (=== ).

4. മറന്നുപോയ var

പുതുമുഖങ്ങൾ ചെയ്യുന്ന മറ്റൊരു തെറ്റ് അവർ ഉപയോഗിക്കാൻ മറക്കുന്നു എന്നതാണ് കീവേഡ്വേരിയബിളുകൾ പ്രഖ്യാപിക്കുമ്പോൾ var. ജാവാസ്ക്രിപ്റ്റ് വളരെ ലിബറൽ എഞ്ചിനാണ്.

ഒരു var ഓപ്പറേറ്റർ ഇല്ലാതെ നിങ്ങൾ ഒരു വേരിയബിൾ ഉപയോഗിച്ചതായി ആദ്യമായി കാണുമ്പോൾ, അത് ആഗോളതലത്തിൽ അത് സ്വയമേവ പ്രഖ്യാപിക്കും. ഇത് ചില പിശകുകളിലേക്ക് നയിച്ചേക്കാം.

മറ്റൊരു പിശക് വ്യക്തമാക്കുന്ന ഒരു ഉദാഹരണം ഇതാ - ഒരേസമയം നിരവധി വേരിയബിളുകൾ പ്രഖ്യാപിക്കുമ്പോൾ ഒരു കോമ കാണുന്നില്ല:

ജെ.എസ്

var a = 1, b = 2, c = 3; ഫംഗ്ഷൻ അക്ഷരമാല(str)( var a = "A", b = "B" // ശ്ശോ, കാണുന്നില്ല ","! c = "C", d = "D"; മടങ്ങുക str + "" + a + b + c + "..."; ) console.log(അക്ഷരമാല("അക്ഷരമാല" എന്ന് പറയാം!"));

പാഴ്‌സർ 4 വരിയിൽ എത്തുമ്പോൾ, അത് സ്വയമേവ ഒരു അർദ്ധവിരാമം ചേർക്കുകയും തുടർന്ന് വരി 5-ലെ c, d പ്രഖ്യാപനങ്ങൾ ഗ്ലോബൽ എന്ന് വ്യാഖ്യാനിക്കുകയും ചെയ്യും.

ഇത് മറ്റൊരു വേരിയബിളിന്റെ മൂല്യം മാറ്റും c. കുറിച്ച് കൂടുതൽ JavaScript അപകടങ്ങൾ ഇവിടെയുണ്ട്.

5. ഫ്ലോട്ടിംഗ് പോയിന്റ് കണക്ക്

JavaScript ഉൾപ്പെടെയുള്ള മിക്കവാറും എല്ലാ പ്രോഗ്രാമിംഗ് ഭാഷകൾക്കും ഈ പിശക് സാധാരണമാണ്. ആ വഴി കാരണം ഫ്ലോട്ടിംഗ് പോയിന്റ് നമ്പറുകൾ മെമ്മറിയിൽ പ്രതിനിധീകരിക്കുന്നു, ഗണിത പ്രവർത്തനങ്ങൾനിങ്ങൾ വിചാരിക്കുന്ന രീതിയിൽ പ്രവർത്തിക്കരുത്.

ഉദാഹരണത്തിന്:

ജെ.എസ്

var a = 0.1, b = 0.2; //ആശ്ചര്യം! ഇത് തെറ്റാണ്: console.log(a + b == 0.3); // കാരണം നിങ്ങൾ പ്രതീക്ഷിച്ചതിലേക്ക് 0.1 + 0.2 ചേർക്കുന്നില്ല: console.log("0.1 + 0.2 = ", a + b);

ഈ പ്രശ്നം പരിഹരിക്കാൻ, നിങ്ങൾ ഉപയോഗിക്കരുത് ദശാംശ സംഖ്യകൾ, നിങ്ങൾക്ക് കേവല കൃത്യത ആവശ്യമാണെങ്കിൽ, പൂർണ്ണസംഖ്യകൾ ഉപയോഗിക്കുക, അല്ലെങ്കിൽ നിങ്ങൾക്ക് പണ യൂണിറ്റുകളിൽ പ്രവർത്തിക്കണമെങ്കിൽ, bignumber.js പോലുള്ള ഒരു ലൈബ്രറി ഉപയോഗിക്കുക.

6. ഒറിജിനൽ നൊട്ടേഷനുപകരം കൺസ്ട്രക്റ്ററുകൾ ഉപയോഗിക്കുന്നു

എപ്പോൾ ജാവ പ്രോഗ്രാമർമാർകൂടാതെ C# ജാവാസ്ക്രിപ്റ്റ് എഴുതാൻ തുടങ്ങുന്നു, അവർ പലപ്പോഴും കൺസ്ട്രക്റ്ററുകൾ ഉപയോഗിച്ച് ഒബ്ജക്റ്റുകൾ സൃഷ്ടിക്കാൻ ഇഷ്ടപ്പെടുന്നു: പുതിയ അറേ(), പുതിയ ഒബ്‌ജക്റ്റ്(), പുതിയ സ്ട്രിംഗ്().

ജെ.എസ്

var elem4 = പുതിയ അറേ (1,2,3,4); console.log("നാല് മൂലക ശ്രേണി: " + elem4.length); // ഒരു ഘടകത്തിന്റെ ഒരു ശ്രേണി സൃഷ്ടിക്കുക. നിങ്ങൾ ചിന്തിക്കുന്ന രീതിയിൽ ഇത് പ്രവർത്തിക്കില്ല: var elem1 = new Array(23); console.log("ഒരു ഘടകം അറേ? " + elem1.length); /* സ്ട്രിംഗ് ഒബ്‌ജക്‌റ്റുകൾക്കും അതിന്റേതായ സവിശേഷതകളുണ്ട് */ var str1 = പുതിയ സ്ട്രിംഗ്("ജാവാസ്ക്രിപ്റ്റ്"), str2 = "ജാവാസ്ക്രിപ്റ്റ്"; // കർശനമായ സമത്വം നിരീക്ഷിക്കപ്പെടുന്നില്ല: console.log("str1 എന്നത് str2 ന് തുല്യമാണോ?", str1 === str2);

ഈ പ്രശ്നത്തിനുള്ള പരിഹാരം ലളിതമാണ്: എല്ലായ്പ്പോഴും അക്ഷരാർത്ഥത്തിലുള്ള ഒറിജിനൽ ഉപയോഗിക്കാൻ ശ്രമിക്കുക
പദവികൾ. കൂടാതെ, JS-ൽ അറേകളുടെ വലുപ്പം മുൻകൂട്ടി വ്യക്തമാക്കേണ്ടതില്ല.

7. ശ്രേണികൾ എങ്ങനെ വിഭജിക്കപ്പെടുന്നു എന്ന തെറ്റിദ്ധാരണ

JS പുതുമുഖങ്ങൾക്ക് മനസ്സിലാക്കാൻ ബുദ്ധിമുട്ടുള്ള കാര്യങ്ങളിലൊന്ന് പരിധികൾ പരിമിതപ്പെടുത്തുന്നതിനും അടയ്ക്കുന്നതിനുമുള്ള നിയമങ്ങളാണ്. ഇത് ശരിക്കും എളുപ്പമല്ല:

ജെ.എസ്

(var i = 0; i< 10; i++){ setTimeout(function(){ console.log(i+1); }, 100*i); } /* Чтобы исправить проблему, заключите код в выражение самовыполняющейся функции: for(var i = 0; i < 10; i++){ (function(i){ setTimeout(function(){ console.log(i+1); }, 100*i); })(i); } */

ഫംഗ്‌ഷനുകൾ അവയുടെ പാരന്റ് ശ്രേണിയിലെ വേരിയബിളുകളുമായി ബന്ധപ്പെട്ടിരിക്കുന്നു. എന്നാൽ ഞങ്ങൾ setTimeout വഴി നിർവ്വഹണം വൈകിപ്പിക്കുന്നതിനാൽ, ഫംഗ്‌ഷനുകൾ പ്രവർത്തിപ്പിക്കേണ്ട സമയമാകുമ്പോൾ, യഥാർത്ഥത്തിൽ ലൂപ്പ് പൂർത്തിയാകും, i വേരിയബിൾ 11 ആയി വർദ്ധിപ്പിക്കും.

അഭിപ്രായങ്ങളിലെ സെൽഫ് എക്‌സിക്യൂറ്റിംഗ് ഫംഗ്‌ഷൻ പ്രവർത്തിക്കുന്നു, കാരണം അത് വേരിയബിളിന്റെ i-യുടെ മൂല്യം പകർത്തുകയും ഫംഗ്‌ഷന്റെ എക്‌സിക്യൂഷനിലെ ഓരോ കാലതാമസത്തിനും അതിന്റെ ഒരു പകർപ്പ് സംഭരിക്കുകയും ചെയ്യുന്നു. നിങ്ങൾക്ക് ഇവിടെയും ഇവിടെയും ശ്രേണികളെക്കുറിച്ച് കൂടുതൽ കണ്ടെത്താനാകും.

8. Eval ഉപയോഗിക്കുന്നത്

ഏവൽ തിന്മയാണ്. ഇത് മോശം ശീലമായി കണക്കാക്കപ്പെടുന്നു, മിക്ക കേസുകളിലും നിങ്ങൾ ഇത് ചെയ്യാൻ ചിന്തിക്കുമ്പോൾ, മികച്ചതും വേഗതയേറിയതുമായ ഒരു മാർഗമുണ്ട്.

ജെ.എസ്

//ഇത് മോശം ശീലമാണ്. ദയവായി ഇത് ചെയ്യരുത്: console.log(eval("obj.name + " is a " + obj." + access)); // പകരം, പ്രോപ്പർട്ടികൾ ചലനാത്മകമായി ആക്‌സസ് ചെയ്യാൻ ഒരു വ്യാഖ്യാന ശ്രേണി ഉപയോഗിക്കുക: console.log(obj.name + "ഒരു " + obj); /* setTimout-ൽ eval ഉപയോഗിക്കുന്നത് */ // ഇതും ഒരു മോശം ശീലമാണ്. ഇത് പരീക്ഷിക്കാനും ഡീബഗ് ചെയ്യാനും സാവധാനവും ബുദ്ധിമുട്ടുമാണ്: setTimeout(" if(obj.age == 30) console.log("ഇത് eval-ed കോഡ് ആണ്, " + obj + "!");", 100); // ഇത് ഈ രീതിയിൽ മികച്ചതായിരിക്കും: setTimeout(function())( if(obj.age == 30)( console.log("ഈ കോഡ് eval-ed അല്ല, " + obj + "!"); ) ) , 100);

eval എന്നതിനുള്ളിലെ കോഡ് ഒരു സ്ട്രിംഗാണ്. Eval ബ്ലോക്കുകളുമായി ബന്ധപ്പെട്ട ഡീബഗ്ഗിംഗ് സന്ദേശങ്ങൾ ആശയക്കുഴപ്പമുണ്ടാക്കുന്നു, ഒറ്റ, ഇരട്ട ഉദ്ധരണികൾ ശരിയാക്കാൻ നിങ്ങളുടെ തലച്ചോറിനെ റാക്ക് ചെയ്യേണ്ടിവരും.

സാധാരണ ജാവാസ്ക്രിപ്റ്റിനേക്കാൾ വേഗത കുറവായിരിക്കുമെന്ന് പ്രത്യേകം പറയേണ്ടതില്ല. നിങ്ങൾ എന്താണ് ചെയ്യുന്നതെന്ന് കൃത്യമായി അറിയാത്തിടത്തോളം Eval ഉപയോഗിക്കരുത്.

9. അസിൻക്രണസ് കോഡിന്റെ തെറ്റിദ്ധാരണ

ജാവാസ്ക്രിപ്റ്റിനെ യഥാർത്ഥത്തിൽ വേറിട്ടുനിർത്തുന്നതും അതുല്യമാക്കുന്നതും, മിക്കവാറും എല്ലാം അസമന്വിതമായി പ്രവർത്തിക്കുന്നു, ഇവന്റുകൾ അറിയിക്കുന്നതിന് നിങ്ങൾ കോൾബാക്ക് ഫംഗ്ഷനുകൾ കൈമാറേണ്ടതുണ്ട് എന്നതാണ്.

തുടക്കക്കാർക്ക് ഇത് അവബോധപൂർവ്വം മനസ്സിലാക്കാൻ ഇപ്പോഴും ബുദ്ധിമുട്ടാണ്, മാത്രമല്ല മനസ്സിലാക്കാൻ ബുദ്ധിമുട്ടുള്ള പിശകുകൾ നേരിടുമ്പോൾ അവർ പെട്ടെന്ന് ഒരു അവസാനഘട്ടത്തിലെത്തുന്നു.

IP വിലാസം അനുസരിച്ച് നിങ്ങളുടെ സ്ഥാനം നിർണ്ണയിക്കാൻ ഞാൻ FreeGeoIP സേവനം ഉപയോഗിക്കുന്ന ഒരു ഉദാഹരണം ഇതാ:

ജെ.എസ്

// നിലവിലെ ഉപയോക്താവിന്റെ ലൊക്കേഷൻ ഡാറ്റ നിർണ്ണയിക്കുക. ലോഡ് (); // ഉപയോക്താവിന്റെ സ്ഥാനം പ്രദർശിപ്പിക്കുക. ക്ഷമിക്കണം, അത് പ്രവർത്തിക്കുന്നില്ല! എന്തുകൊണ്ട്? console.log("ഹലോ! നിങ്ങളുടെ IP വിലാസം " + userData.ip + " ആണ്, നിങ്ങളുടെ രാജ്യം " + userData.country_name ആണ്); // ലോഡ് ചെയ്ത ഫംഗ്‌ഷൻ നിലവിലെ ഉപയോക്താവിന്റെ ഐപിയും അതിന്റെ സ്ഥാനവും നിർണ്ണയിക്കും // ajax വഴി, freegeoip സേവനം ഉപയോഗിച്ച്. ഇത് പൂർത്തിയാകുമ്പോൾ, അത് തിരികെ ലഭിച്ച // ഡാറ്റയെ ഉപയോക്തൃ ഡാറ്റ വേരിയബിളിൽ സ്ഥാപിക്കും. ഫംഗ്‌ഷൻ ലോഡ്())( $.getJSON("http://freegeoip.net/json/?callback=?", function(response)( userData = പ്രതികരണം; // അഭിപ്രായങ്ങളിൽ നിന്നുള്ള ഔട്ട്‌പുട്ട് അടുത്ത വരിതിരികെ ലഭിച്ച // ഫലം കാണുന്നതിന്: // console.log(response); )); )

കോളിന് ശേഷം console.log സ്ഥിതി ചെയ്യുന്നുണ്ടെങ്കിലും ലോഡ് ഫംഗ്ഷനുകൾ(), ഡാറ്റ നിർവചിക്കുന്നതിന് മുമ്പ് ഇത് യഥാർത്ഥത്തിൽ നടപ്പിലാക്കുന്നു.

10. ഇവന്റ് ട്രാക്കിംഗിന്റെ ദുരുപയോഗം

നിങ്ങൾക്ക് ഒരു ബട്ടൺ ക്ലിക്ക് ട്രാക്ക് ചെയ്യണമെന്ന് അനുമാനിക്കാം, പക്ഷേ ചെക്കർ ഇൻസ്റ്റാൾ ചെയ്തിട്ടുണ്ടെങ്കിൽ മാത്രം.

ഞാൻ എപ്പോഴും അത്ഭുതപ്പെട്ടിട്ടുണ്ട് ജാവാസ്ക്രിപ്റ്റ്ഒന്നാമതായി, രണ്ട് മാതൃകകളെയും ഒരേസമയം പിന്തുണയ്ക്കുന്ന, വ്യാപകമായി ഉപയോഗിക്കപ്പെടുന്ന മറ്റേതൊരു ഭാഷയും പോലെയല്ല ഇത്: സാധാരണവും അസാധാരണവുമായ പ്രോഗ്രാമിംഗ്. മതിയായ മികച്ച സമ്പ്രദായങ്ങളെയും ടെംപ്ലേറ്റുകളെയും കുറിച്ച് നിങ്ങൾ മിക്കവാറും എല്ലാം വായിച്ചിട്ടുണ്ടെങ്കിൽ, അപ്പോൾ അത്ഭുതകരമായ ലോകംനിങ്ങൾക്ക് എങ്ങനെ കോഡ് എഴുതാൻ പാടില്ല, പക്ഷേ കഴിയും, ചെറുതായി അജർ ആയി തുടരുന്നു.

ഈ ലേഖനത്തിൽ, ഒരു സാധാരണ പരിഹാരത്തിന്റെ പൊറുക്കാനാവാത്ത ലംഘനം ആവശ്യമുള്ള മറ്റൊരു വിദൂര പ്രശ്നം ഞങ്ങൾ വിശകലനം ചെയ്യും.

മുമ്പത്തെ ചുമതല:

രൂപപ്പെടുത്തൽ

പാസായ ഫംഗ്‌ഷനിലേക്കുള്ള കോളുകളുടെ എണ്ണം കണക്കാക്കുകയും ആവശ്യാനുസരണം ആ നമ്പർ വീണ്ടെടുക്കാനുള്ള കഴിവ് നൽകുകയും ചെയ്യുന്ന ഒരു ഡെക്കറേറ്റർ ഫംഗ്‌ഷൻ നടപ്പിലാക്കുക. തീരുമാനത്തിൽ വിലക്കപ്പെട്ടചുരുണ്ട ബ്രേസുകളും ഗ്ലോബൽ വേരിയബിളുകളും ഉപയോഗിക്കുക.

കോൾ കൗണ്ടർ ഒരു ഒഴികഴിവ് മാത്രമാണ്, കാരണം console.count() . പൊതിഞ്ഞ ഫംഗ്‌ഷനെ വിളിക്കുമ്പോൾ ഞങ്ങളുടെ ഫംഗ്‌ഷൻ കുറച്ച് ഡാറ്റ ശേഖരിക്കുകയും അത് ആക്‌സസ് ചെയ്യുന്നതിന് ഒരുതരം ഇന്റർഫേസ് നൽകുകയും ചെയ്യുന്നു എന്നതാണ് കാര്യം. ഇത് കോളിന്റെ എല്ലാ ഫലങ്ങളും സംരക്ഷിക്കുകയോ ലോഗുകൾ ശേഖരിക്കുകയോ ഏതെങ്കിലും തരത്തിലുള്ള ഓർമ്മപ്പെടുത്തൽ നടത്തുകയോ ചെയ്യാം. കൌണ്ടർ പ്രാകൃതവും എല്ലാവർക്കും മനസ്സിലാക്കാവുന്നതുമാണെന്ന് മാത്രം.

മുഴുവൻ ബുദ്ധിമുട്ടും അസാധാരണമായ പരിമിതിയിലാണ്. നിങ്ങൾക്ക് ചുരുണ്ട ബ്രേസുകൾ ഉപയോഗിക്കാൻ കഴിയില്ല, അതിനർത്ഥം നിങ്ങൾ ദൈനംദിന പ്രവർത്തനങ്ങളും സാധാരണ വാക്യഘടനയും പുനർവിചിന്തനം ചെയ്യേണ്ടിവരും എന്നാണ്.

സാധാരണ പരിഹാരം

ആദ്യം നിങ്ങൾ ഒരു ആരംഭ പോയിന്റ് തിരഞ്ഞെടുക്കേണ്ടതുണ്ട്. സാധാരണയായി, ഭാഷയോ അതിന്റെ വിപുലീകരണമോ നൽകുന്നില്ലെങ്കിൽ ആവശ്യമായ പ്രവർത്തനംഅലങ്കാരം, ഞങ്ങൾ ഒരു പ്രത്യേക കണ്ടെയ്നർ സ്വയം നടപ്പിലാക്കുന്നു: ഒരു പൊതിഞ്ഞ പ്രവർത്തനം, ശേഖരിച്ച ഡാറ്റ, അത് ആക്സസ് ചെയ്യുന്നതിനുള്ള ഒരു ഇന്റർഫേസ്. മിക്കപ്പോഴും ഇതാണ് ക്ലാസ്:

ക്ലാസ് കൗണ്ട്ഫംഗ്ഷൻ ( കൺസ്ട്രക്റ്റർ(എഫ്) (ഇത്.കോൾസ് = 0; ദിസ്.എഫ് = എഫ്; ) ഇൻവോക്ക്() (ഇത്.കോൾസ് += 1; റിട്ടേൺ ദിസ്.എഫ്(...ആർഗ്യുമെന്റുകൾ); ) ((x, y) => x + y); csum.invoke(3, 7); // 10 csum.invoke(9, 6); // 15 csum.calls; // 2

ഇത് ഞങ്ങൾക്ക് ഉടനടി അനുയോജ്യമല്ല, കാരണം:

1. JavaScript-ൽ, നിങ്ങൾക്ക് ഈ രീതിയിൽ ഒരു സ്വകാര്യ സ്വത്ത് നടപ്പിലാക്കാൻ കഴിയില്ല: ഒന്നുകിൽ നമുക്ക് വായിക്കാം വിളിക്കുന്നുഉദാഹരണം (നമുക്ക് ആവശ്യമുള്ളത്), പുറത്ത് നിന്ന് അതിൽ ഒരു മൂല്യം എഴുതുക (ഇത് ഞങ്ങൾക്ക് ആവശ്യമില്ല). തീർച്ചയായും, കൺസ്ട്രക്റ്ററിൽ നമുക്ക് ഒരു ക്ലോഷർ ഉപയോഗിക്കാം, എന്നാൽ ക്ലാസിന്റെ കാര്യം എന്താണ്? ബേബൽ 7 ഇല്ലാതെ പുതിയ സ്വകാര്യ ഫീൽഡുകൾ ഉപയോഗിക്കുന്നതിൽ ഞാൻ ഇപ്പോഴും ജാഗ്രത പുലർത്തും.
2. ഭാഷ ഒരു പ്രവർത്തന മാതൃകയെയും തൽക്ഷണം വഴിയെയും പിന്തുണയ്ക്കുന്നു പുതിയത്അത് ഇവിടെ ഇല്ലെന്ന് തോന്നുന്നു മികച്ച പരിഹാരം. മറ്റൊരു ഫംഗ്‌ഷൻ നൽകുന്ന ഒരു ഫംഗ്‌ഷൻ എഴുതുന്നതാണ് നല്ലത്. അതെ!
3. ഒടുവിൽ, വാക്യഘടന ക്ലാസ് ഡിക്ലറേഷൻഒപ്പം രീതി നിർവ്വചനംഎല്ലാ ചുരുണ്ട ബ്രേസുകളും ഒഴിവാക്കാൻ ഞങ്ങൾ എത്ര ആഗ്രഹിച്ചാലും ഞങ്ങളെ അനുവദിക്കില്ല.

എന്നാൽ ഒരു ക്ലോഷർ ഉപയോഗിച്ച് സ്വകാര്യത നടപ്പിലാക്കുന്ന ഒരു മികച്ച ഒന്ന് ഞങ്ങളുടെ പക്കലുണ്ട്:

ഫംഗ്‌ഷൻ കൗണ്ട് (എഫ്) ( കോളുകൾ = 0; തിരികെ നൽകുക (അഭ്യർത്ഥിക്കുക: ഫംഗ്‌ഷൻ () (കോളുകൾ += 1; റിട്ടേൺ എഫ് (... ആർഗ്യുമെന്റുകൾ); ), getCalls: ഫംഗ്‌ഷൻ () (റിട്ടേൺ കോളുകൾ; ) ); ) const csum = കൗണ്ട് (((x, y) => x + y); csum.invoke(3, 7); // 10 csum.invoke(9, 6); // 15 csum.getCalls(); // 2

നിങ്ങൾക്ക് ഇതിനകം ഇത് ഉപയോഗിച്ച് പ്രവർത്തിക്കാൻ കഴിയും.

രസകരമായ പരിഹാരം

എന്തായാലും ഇവിടെ ചുരുണ്ട ബ്രേസുകൾ എന്തിനുവേണ്ടിയാണ് ഉപയോഗിക്കുന്നത്? ഇവ 4 വ്യത്യസ്ത കേസുകളാണ്:

1. ഫംഗ്‌ഷൻ എണ്ണത്തിന്റെ ബോഡി നിർവചിക്കുന്നു ( ഫംഗ്ഷൻ ഡിക്ലറേഷൻ)
2. മടങ്ങിയ ഒബ്ജക്റ്റ് ആരംഭിക്കുന്നു
3. ഫംഗ്‌ഷൻ ഇൻവോക്കിന്റെ ബോഡി നിർവചിക്കുന്നു ( ഫംഗ്ഷൻ എക്സ്പ്രഷൻ) രണ്ട് പദപ്രയോഗങ്ങളോടെ
4. ഫംഗ്ഷൻ ബോഡി നിർവചിക്കുന്നു getCalls( ഫംഗ്ഷൻ എക്സ്പ്രഷൻ) ഒരു പദപ്രയോഗത്തോടെ

നമുക്ക് തുടങ്ങാം രണ്ടാമത്തേത്പോയിന്റ്. വാസ്തവത്തിൽ, ഞങ്ങൾക്ക് മടങ്ങിവരേണ്ട ആവശ്യമില്ല പുതിയ വസ്തു, അവസാന ഫംഗ്‌ഷൻ വഴി വിളിക്കുന്നത് കൂടുതൽ ബുദ്ധിമുട്ടാക്കുമ്പോൾ അഭ്യർത്ഥിക്കുക. JavaScript-ലെ ഒരു ഫംഗ്‌ഷൻ ഒരു ഒബ്‌ജക്‌റ്റാണ് എന്ന വസ്തുത നമുക്ക് പ്രയോജനപ്പെടുത്താം, അതിനർത്ഥം അതിന് അതിന്റേതായ ഫീൽഡുകളും രീതികളും അടങ്ങിയിരിക്കാം എന്നാണ്. നമുക്ക് നമ്മുടെ റിട്ടേൺ ഫംഗ്‌ഷൻ സൃഷ്‌ടിക്കാം dfഅതിലേക്ക് ഒരു രീതി ചേർക്കുക കോളുകൾ, അടച്ചുപൂട്ടലിലൂടെ ആക്‌സസ് ഉണ്ടായിരിക്കും വിളിക്കുന്നുമുമ്പത്തെ പോലെ:

ഫംഗ്‌ഷൻ കൗണ്ട്(എഫ്) (കോളുകൾ = 0; ഫംഗ്‌ഷൻ df() (കോളുകൾ += 1; റിട്ടേൺ എഫ്(...ആർഗ്യുമെന്റുകൾ); ) df.getCalls = ഫംഗ്‌ഷൻ() (റിട്ടേൺ കോളുകൾ; ) df തിരികെ നൽകുക; )

ഇത് ഉപയോഗിച്ച് പ്രവർത്തിക്കുന്നത് കൂടുതൽ മനോഹരമാണ്:

const csum = കൗണ്ട് ((x, y) => x + y); csum(3, 7); // 10 csum(9, 6); // 15 csum.getCalls(); // 2

സി നാലാമത്തെഎല്ലാം വ്യക്തമാണ്: ഞങ്ങൾ മാറ്റിസ്ഥാപിക്കും ഫംഗ്ഷൻ എക്സ്പ്രഷൻഓൺ അമ്പ് ഫംഗ്ഷൻ. ചുരുണ്ട ബ്രേസുകളുടെ അഭാവം അത് ഉറപ്പാക്കും ചെറിയ കുറിപ്പ്അമ്പടയാളം അതിന്റെ ശരീരത്തിലെ ഒരൊറ്റ പദപ്രയോഗത്തിന്റെ കാര്യത്തിൽ:

ഫംഗ്‌ഷൻ കൗണ്ട്(എഫ്) (കോളുകൾ = 0; ഫംഗ്‌ഷൻ df() (കോളുകൾ += 1; റിട്ടേൺ എഫ്(...ആർഗ്യുമെന്റുകൾ); ) df.getCalls = () => കോളുകൾ; തിരികെ df; )

കൂടെ മൂന്നാമത്- എല്ലാം കൂടുതൽ സങ്കീർണ്ണമാണ്. ഞങ്ങൾ ആദ്യം ചെയ്തത് മാറ്റിസ്ഥാപിക്കുകയാണെന്ന് ഞങ്ങൾ ഓർക്കുന്നു ഫംഗ്ഷൻ എക്സ്പ്രഷൻപ്രവർത്തനങ്ങൾ അഭ്യർത്ഥിക്കുകഓൺ ഫംഗ്ഷൻ ഡിക്ലറേഷൻ df. ഇത് മാറ്റിയെഴുതാൻ അമ്പ് ഫംഗ്ഷൻനിങ്ങൾ രണ്ട് പ്രശ്‌നങ്ങൾ പരിഹരിക്കേണ്ടതുണ്ട്: ആർഗ്യുമെന്റുകളിലേക്കുള്ള ആക്‌സസ് നഷ്‌ടപ്പെടാതിരിക്കാൻ (നിലവിൽ ഇതൊരു വ്യാജ ശ്രേണിയാണ് വാദങ്ങൾ) കൂടാതെ രണ്ട് എക്സ്പ്രഷനുകളുടെ ഫംഗ്ഷൻ ബോഡി ഒഴിവാക്കുക.

ഫംഗ്‌ഷനായി വ്യക്തമായി പറഞ്ഞിരിക്കുന്ന പരാമീറ്റർ ആദ്യത്തെ പ്രശ്‌നം കൈകാര്യം ചെയ്യാൻ ഞങ്ങളെ സഹായിക്കും ആർഗ്സ്കൂടെ സ്പ്രെഡ് ഓപ്പറേറ്റർ. രണ്ട് പദപ്രയോഗങ്ങൾ ഒന്നായി സംയോജിപ്പിക്കാൻ, നിങ്ങൾക്ക് ഉപയോഗിക്കാം ലോജിക്കൽ AND. ക്ലാസിക്കിൽ നിന്ന് വ്യത്യസ്തമായി ലോജിക്കൽ ഓപ്പറേറ്റർഒരു ബൂളിയൻ നൽകുന്ന ഒരു സംയോജനത്തിൽ, അത് ഇടത്തുനിന്ന് വലത്തോട്ട് ആദ്യത്തെ "തെറ്റ്" വരെ ഓപ്പറണ്ടുകളെ വിലയിരുത്തുകയും അത് തിരികെ നൽകുകയും ചെയ്യുന്നു, എല്ലാം "ശരി" ആണെങ്കിൽ അവസാന മൂല്യം. കൌണ്ടറിന്റെ ആദ്യ ഇൻക്രിമെന്റ് നമുക്ക് 1 നൽകും, അതായത് ഈ ഉപ-എക്‌സ്‌പ്രഷൻ എല്ലായ്‌പ്പോഴും ശരിയായി കുറയും. രണ്ടാമത്തെ ഉപ-പ്രകടനത്തിലെ ഫംഗ്‌ഷൻ കോളിന്റെ ഫലം "സത്യം" എന്നതിലേക്ക് കുറയ്ക്കാൻ ഞങ്ങൾക്ക് താൽപ്പര്യമില്ല: മൂല്യനിർണ്ണയക്കാരൻ ഏത് സാഹചര്യത്തിലും അതിൽ നിർത്തും. ഇപ്പോൾ നമുക്ക് ഉപയോഗിക്കാം അമ്പ് ഫംഗ്ഷൻ:

ഫംഗ്‌ഷൻ കൗണ്ട്(എഫ്) ( കോളുകൾ = 0 എന്ന് അനുവദിക്കുക; df = (...args) => (കോളുകൾ += 1) && f(...args); df.getCalls = () => കോളുകൾ; df തിരികെ നൽകുക; )

നിങ്ങൾക്ക് റെക്കോർഡിംഗ് അൽപ്പം ഉപയോഗിച്ച് അലങ്കരിക്കാൻ കഴിയും പ്രിഫിക്സ് ഇൻക്രിമെന്റ്:

ഫംഗ്‌ഷൻ കൗണ്ട്(എഫ്) ( കോളുകൾ = 0 അനുവദിക്കുക; df = (...args) => ++കോളുകൾ && f(...args); df.getCalls = () => കോളുകൾ; df തിരികെ നൽകുക; )

പരിഹാരം ആദ്യംമാറ്റിസ്ഥാപിക്കുന്നതിലൂടെ ഏറ്റവും ബുദ്ധിമുട്ടുള്ള പോയിന്റിൽ നിന്ന് നമുക്ക് ആരംഭിക്കാം ഫംഗ്ഷൻ ഡിക്ലറേഷൻഓൺ അമ്പ് ഫംഗ്ഷൻ. എന്നാൽ ഇപ്പോൾ നമുക്ക് ശരീരം ചുരുണ്ട ബ്രേസുകളിൽ ഉണ്ടായിരിക്കും:

കോൺസ്റ്റ് കൗണ്ട് = f => ( കോളുകൾ = 0; അനുവദിക്കുക df = (...args) => ++കോളുകൾ && f(...args); df.getCalls = () => കോളുകൾ; df; തിരികെ നൽകുക; );

ഫംഗ്‌ഷന്റെ ബോഡിക്ക് ചുറ്റുമുള്ള ചുരുണ്ട ബ്രേസുകൾ ഒഴിവാക്കണമെങ്കിൽ, വേരിയബിളുകൾ പ്രഖ്യാപിക്കുന്നതും ആരംഭിക്കുന്നതും ഞങ്ങൾ ഒഴിവാക്കണം. അനുവദിക്കുക. നമുക്ക് രണ്ട് വേരിയബിളുകൾ ഉണ്ട്: വിളിക്കുന്നുഒപ്പം df.

ആദ്യം, നമുക്ക് കൗണ്ടറുമായി ഇടപെടാം. ഫംഗ്‌ഷൻ പാരാമീറ്റർ ലിസ്റ്റിൽ നിർവചിച്ചുകൊണ്ട് നമുക്ക് ഒരു ലോക്കൽ വേരിയബിൾ സൃഷ്‌ടിക്കാം, കൂടാതെ IIFE (ഉടൻ ഇൻവോക്ക്ഡ് ഫംഗ്‌ഷൻ എക്‌സ്‌പ്രഷൻ) ഉപയോഗിച്ച് അതിനെ വിളിച്ച് പ്രാരംഭ മൂല്യം കൈമാറാം:

const count = f => (കോളുകൾ => ( df = (...args) => ++കോളുകൾ && f(...args); df.getCalls = () => കോളുകൾ; തിരികെ df; ))( 0);

മൂന്ന് പദപ്രയോഗങ്ങൾ ഒന്നായി സംയോജിപ്പിക്കുക മാത്രമാണ് അവശേഷിക്കുന്നത്. മൂന്ന് എക്‌സ്‌പ്രഷനുകളും എല്ലായ്‌പ്പോഴും ശരി എന്ന് വിലയിരുത്തുന്ന ഫംഗ്‌ഷനുകൾ ആയതിനാൽ, നമുക്കും ഉപയോഗിക്കാം ലോജിക്കൽ AND:

const count = f => (കോളുകൾ => (df = (...args) => ++കോളുകൾ && f(...args)) && (df.getCalls = () => കോളുകൾ) && df)(0 );

എന്നാൽ എക്സ്പ്രഷനുകൾ സംയോജിപ്പിക്കുന്നതിന് മറ്റൊരു ഓപ്ഷൻ ഉണ്ട്: ഉപയോഗിക്കുന്നത് കോമ ഓപ്പറേറ്റർ. അനാവശ്യമായ ലോജിക്കൽ പരിവർത്തനങ്ങൾ ഉൾപ്പെടാത്തതിനാലും കുറച്ച് പരാൻതീസിസുകൾ ആവശ്യമുള്ളതിനാലും ഇത് അഭികാമ്യമാണ്. ഓപ്പറണ്ടുകൾ ഇടത്തുനിന്ന് വലത്തോട്ട് വിലയിരുത്തപ്പെടുന്നു, ഫലം രണ്ടാമത്തേതിന്റെ മൂല്യമാണ്:

const count = f => (കോളുകൾ => (df = (...args) => ++കോളുകൾ && f(...args), df.getCalls = () => കോളുകൾ, df))(0);

ഒരുപക്ഷേ എനിക്ക് നിങ്ങളെ വഞ്ചിക്കാൻ കഴിഞ്ഞോ? വേരിയബിൾ ഡിക്ലറേഷനിൽ നിന്ന് ഞങ്ങൾ സുരക്ഷിതമായി രക്ഷപ്പെട്ടു dfഞങ്ങളുടെ ആരോ ഫംഗ്‌ഷനിലേക്കുള്ള അസൈൻമെന്റ് മാത്രം വിട്ടു. ഈ സാഹചര്യത്തിൽ, ഈ വേരിയബിൾ ആഗോളതലത്തിൽ പ്രഖ്യാപിക്കപ്പെടും, അത് അസ്വീകാര്യമാണ്! വേണ്ടി ആവർത്തിക്കാം dfഞങ്ങളുടെ IIFE ഫംഗ്‌ഷന്റെ പാരാമീറ്ററുകളിൽ ഒരു ലോക്കൽ വേരിയബിൾ സമാരംഭിക്കുന്നു, പക്ഷേ ഞങ്ങൾ ഒരു പ്രാരംഭ മൂല്യവും നൽകില്ല:

const count = f => ((കോളുകൾ, df) => (df = (...args) => ++കോളുകൾ && f(...args), df.getCalls = () => കോളുകൾ, df)) (0);

അങ്ങനെ ലക്ഷ്യം കൈവരിച്ചു.

ഒരു തീമിലെ വ്യതിയാനങ്ങൾ

കൗതുകകരമെന്നു പറയട്ടെ, ലോക്കൽ വേരിയബിളുകൾ, ഫംഗ്‌ഷൻ ബ്ലോക്കുകളിൽ ഒന്നിലധികം എക്‌സ്‌പ്രഷനുകൾ, ഒരു ഒബ്‌ജക്റ്റ് ലിറ്ററൽ സൃഷ്‌ടിക്കുന്നത് എന്നിവ സൃഷ്‌ടിക്കുന്നതും ആരംഭിക്കുന്നതും ഒഴിവാക്കാൻ ഞങ്ങൾക്ക് കഴിഞ്ഞു. അതേ സമയം, യഥാർത്ഥ പരിഹാരത്തിന്റെ പരിശുദ്ധി സംരക്ഷിക്കപ്പെട്ടു: ആഗോള വേരിയബിളുകളുടെ അഭാവം, കൌണ്ടറിന്റെ സ്വകാര്യത, പൊതിഞ്ഞ പ്രവർത്തനത്തിന്റെ ആർഗ്യുമെന്റുകളിലേക്കുള്ള പ്രവേശനം.

പൊതുവേ, നിങ്ങൾക്ക് ഏതെങ്കിലും നടപ്പാക്കൽ എടുത്ത് സമാനമായ എന്തെങ്കിലും ചെയ്യാൻ ശ്രമിക്കാം. ഉദാഹരണത്തിന്, ഒരു ഫംഗ്ഷനുള്ള പോളിഫിൽ ബന്ധിക്കുകഇക്കാര്യത്തിൽ, ഇത് വളരെ ലളിതമാണ്:

const bind = (f, ctx, ...a) => (...args) => f.apply(ctx, a.concat(args));

എന്നിരുന്നാലും, വാദം ഉണ്ടെങ്കിൽ എഫ്ഒരു ഫംഗ്‌ഷൻ അല്ല, നല്ല രീതിയിൽ നമ്മൾ ഒരു അപവാദം എറിയണം. ഒപ്പം ഒഴിവാക്കലും എറിയുകഒരു പദപ്രയോഗത്തിന്റെ പശ്ചാത്തലത്തിൽ തള്ളിക്കളയാനാവില്ല. നിങ്ങൾക്ക് ത്രോ എക്സ്പ്രഷനുകൾക്കായി കാത്തിരിക്കാം (ഘട്ടം 2) വീണ്ടും ശ്രമിക്കുക. അല്ലെങ്കിൽ ആർക്കെങ്കിലും ഇതിനകം ചിന്തകളുണ്ടോ?

അല്ലെങ്കിൽ ഒരു നിശ്ചിത പോയിന്റിന്റെ കോർഡിനേറ്റുകൾ വിവരിക്കുന്ന ഒരു ക്ലാസ് പരിഗണിക്കുക:

ക്ലാസ് പോയിന്റ് ( കൺസ്ട്രക്റ്റർ(x, y) ( this.x = x; this.y = y; ) toString() ( മടങ്ങുക `($(this.x), $(this.y)`; ) )

ഒരു ഫംഗ്‌ഷൻ മുഖേന ഇവയെ പ്രതിനിധീകരിക്കാം:

കോൺസ്റ്റ് പോയിന്റ് = (x, y) => (p => (p.x = x, p.y = y, p.toString = () => ["(", x, ", ", y, ")"].ചേരുക (""), പി))(പുതിയ ഒബ്ജക്റ്റ്);

ഇവിടെ മാത്രം നമുക്ക് പ്രോട്ടോടൈപ്പിക്കൽ പാരമ്പര്യം നഷ്ടപ്പെട്ടു: toStringപ്രോട്ടോടൈപ്പ് ഒബ്ജക്റ്റിന്റെ ഒരു സ്വത്താണ് പോയിന്റ്, വെവ്വേറെ സൃഷ്ടിച്ച ഒരു വസ്തുവിനെക്കാൾ. വേണ്ടത്ര ശ്രമിച്ചാൽ ഇത് ഒഴിവാക്കാനാകുമോ?

പരിവർത്തനങ്ങളുടെ ഫലങ്ങൾ അനാരോഗ്യകരമായ മിശ്രിതത്തിലേക്ക് നയിക്കുന്നു ഫങ്ഷണൽ പ്രോഗ്രാമിംഗ്നിർബന്ധിത ഹാക്കുകളും ഭാഷയുടെ തന്നെ ചില സവിശേഷതകളും. നിങ്ങൾ അതിനെക്കുറിച്ച് ചിന്തിക്കുകയാണെങ്കിൽ, ഇത് രസകരമായ (എന്നാൽ പ്രായോഗികമല്ല) ഒരു അവ്യക്തത ഉണ്ടാക്കും സോഴ്സ് കോഡ്. നിങ്ങൾക്ക് "ബ്രാക്കറ്റ് ഒബ്ഫസ്‌കേറ്റർ" പ്രശ്നത്തിന്റെ നിങ്ങളുടെ സ്വന്തം പതിപ്പ് കൊണ്ടുവരാനും നിങ്ങളുടെ ഒഴിവുസമയങ്ങളിൽ JavaScripters-ന്റെ സഹപ്രവർത്തകരെയും സുഹൃത്തുക്കളെയും രസിപ്പിക്കാനും കഴിയും. ഉപയോഗപ്രദമായ പ്രവൃത്തിസമയം.

ഉപസംഹാരം

ചോദ്യം ഇതാണ്, ഇത് ആർക്ക് ഉപയോഗപ്രദമാണ്, എന്തുകൊണ്ട് ഇത് ആവശ്യമാണ്? തുടക്കക്കാർക്ക് ഇത് പൂർണ്ണമായും ദോഷകരമാണ്, കാരണം ഇത് ഭാഷയുടെ അമിതമായ സങ്കീർണ്ണതയുടെയും വ്യതിയാനത്തിന്റെയും തെറ്റായ ധാരണ സൃഷ്ടിക്കുന്നു. എന്നാൽ ഇത് പരിശീലകർക്ക് ഉപയോഗപ്രദമാകും, കാരണം ഭാഷയുടെ സവിശേഷതകൾ മറുവശത്ത് നിന്ന് നോക്കാൻ ഇത് നിങ്ങളെ അനുവദിക്കുന്നു: ഒഴിവാക്കാനുള്ള ഒരു കോൾ, പക്ഷേ ഭാവിയിൽ ഒഴിവാക്കാൻ ശ്രമിക്കാനുള്ള ഒരു കോൾ.

ടാഗുകൾ: ടാഗുകൾ ചേർക്കുക

പ്രോഗ്രാമിലെ പിശകുകൾ കണ്ടെത്തുന്നത് വളരെ ബുദ്ധിമുട്ടാണ്. നിങ്ങളുടെ ചുമതല എളുപ്പമാക്കുന്നതിന്, നിങ്ങൾ കോഡ് കൃത്യമായും മനോഹരമായും എഴുതേണ്ടതുണ്ട് (വായിക്കാൻ കഴിയുന്നത്). നല്ല കോഡ്ഇതായിരിക്കണം: വായിക്കാവുന്നതും സ്ഥിരതയുള്ളതും പ്രവചിക്കാവുന്നതും ശരിയായി ഫോർമാറ്റ് ചെയ്തതും കൂടാതെ അതിന് ഡോക്യുമെന്റേഷനും ഉണ്ടായിരിക്കണം.

കോഡ് ഫോർമാറ്റിംഗ് സംബന്ധിച്ച പ്രധാന പോയിന്റുകൾ

ഇൻഡന്റേഷനുകൾ

നിങ്ങൾ കോഡ് ഇൻഡന്റ് ചെയ്തില്ലെങ്കിൽ, അത് വായിക്കുന്നത് അസാധ്യമാണ്. സാധാരണയായി, ഒരു ടാബ് പ്രതീകം ഉപയോഗിച്ചാണ് ഇൻഡന്റേഷനുകൾ നിർമ്മിച്ചിരിക്കുന്നത്, എന്നാൽ സ്‌പെയ്‌സുകൾ ഉപയോഗിച്ച് ഇൻഡന്റ് ചെയ്യുന്നവരുമുണ്ട്, സാധാരണയായി 3-4 സ്‌പെയ്‌സുകൾ. ശരിയും തെറ്റും ഒരു ഉദാഹരണം ചുവടെയുണ്ട് ശരിയായ സ്ഥാനംഇൻഡന്റേഷൻ:

/* ശരിയായ ഇൻഡന്റേഷനുകൾ */

< max; i++) {
എങ്കിൽ (arr[i] % 2 === 0) (
ഉത്തരം = (
തുക: തുക += അർ[i]
};
}
}
/* ഇവിടെ എല്ലാം മോശമാണ് */
var ഉത്തരം, arr = , തുക = 0;
(var i = 0, max = arr.length; i< max; i++) {
എങ്കിൽ (arr[i] % 2 === 0) (
ഉത്തരം = (
തുക: തുക += അർ[i]
};
}
}

ബ്രേസുകൾ

ആവശ്യമില്ലെങ്കിൽപ്പോലും എപ്പോഴും ചുരുണ്ട ബ്രേസുകൾ ഉപയോഗിക്കുക. ഒരു സാങ്കേതിക വീക്ഷണകോണിൽ, if, while അല്ലെങ്കിൽ for construct എന്നതിന്റെ ബോഡി ഒരൊറ്റ പ്രസ്താവന ഉൾക്കൊള്ളുന്നുവെങ്കിൽ, ചുരുണ്ട ബ്രേസുകൾ ഒഴിവാക്കാവുന്നതാണ്. ചുരുണ്ട ബ്രേസുകൾ എപ്പോഴും എഴുതുന്നത് പിന്നീട് മാറ്റങ്ങൾ വരുത്തുന്നത് എളുപ്പമാക്കുന്നു. ഇത് എങ്ങനെ ശരിയായി ചെയ്യാം, എന്തുചെയ്യരുത് എന്നതിന്റെ ഒരു ഉദാഹരണം ചുവടെയുണ്ട്:

/* ശരിയായ എൻട്രി */
(var i = 0; i< 5; i++) {
മുന്നറിയിപ്പ് (i);
}
/* പക്ഷേ ഒന്നില്ല */
(var i = 0; i< 5; i++)
മുന്നറിയിപ്പ് (i);

ഓപ്പണിംഗ് ബ്രേസിന്റെ സ്ഥാനം

രണ്ട് തരത്തിലുള്ള പ്രോഗ്രാമർമാർ ഉണ്ട്:

എങ്കിൽ (a > b) (
...
}
എങ്കിൽ (a > b)
{
...
}

ഒരു ഓപ്പണിംഗ് ചുരുണ്ട ബ്രേസ് എങ്ങനെ എഴുതാം എന്നത് നിങ്ങളുടേതാണ്. JavaScript തന്നെ അർദ്ധവിരാമങ്ങൾ ചേർക്കുന്നുവെന്നും ഇവിടെ രണ്ടാമത്തെ രീതിയിലാണ് പ്രശ്നം ഉണ്ടാകുന്നത് എന്നും നമുക്കറിയാം. നിങ്ങൾ ഈ കോഡ് എഴുതുന്നു എന്ന് പറയാം:

മടങ്ങുക
{
ഐഡി: 1
};

പിന്നെ വ്യാഖ്യാതാവ് എന്ത് ചെയ്യും? മടങ്ങിയതിന് ശേഷം അവൻ ഒരു അർദ്ധവിരാമം ചേർക്കുന്നു, കൂടാതെ ഫംഗ്ഷൻ നിർവചിക്കാതെ മടങ്ങിവരുമെന്ന് ഇത് മാറുന്നു. അതായത്, വ്യാഖ്യാതാവ് ഈ കോഡിന്റെ ഭാഗം ഇതുപോലെ കാണുന്നു:

നിർവചിക്കാതെ മടങ്ങുക;
{
ഐഡി: 1
};

ഇടങ്ങൾ

ഇടങ്ങൾ ശരിയായി ഉപയോഗിക്കണം. നിങ്ങൾ പേപ്പറിൽ എഴുതുമ്പോൾ, കോമയ്ക്ക് ശേഷം നിങ്ങൾ ശൂന്യമായ ഇടം വിടുമോ? അതെ എന്ന് ഞാൻ ഊഹിക്കുന്നു. കൂടാതെ JavaScript-ൽ എന്തെങ്കിലും ലിസ്റ്റ് ചെയ്യുമ്പോൾ, നിങ്ങൾ കോമയ്ക്ക് ശേഷം ഒരു സ്പേസ് ഇടേണ്ടതുണ്ട്. കോഡ് വ്യക്തമാക്കുന്നതിന് ഞാൻ എവിടെയാണ് ഒരു സ്പേസ് ഇടേണ്ടത്?

1. ഫോർ സ്റ്റേറ്റ്മെന്റിലെ അർദ്ധവിരാമങ്ങൾക്ക് ശേഷം

ഇതിനായി (var i = 0; i< 100; i++) {...}

2. ഫോർ സ്റ്റേറ്റ്മെന്റിൽ ഒന്നിലധികം വേരിയബിളുകൾ പ്രഖ്യാപിക്കുമ്പോൾ

(var i = 0, max = arr.length; i< max; i++) {...}

3. കോമകൾക്ക് ശേഷം, അറേ ഘടകങ്ങൾക്കിടയിൽ