කාර්යයන් නිර්මාණය කරන සම්මත ආකෘතිවල අඩු කිරීම මෙන්න: (මුලින් වෙනත් ප්‍රශ්නයක් සඳහා ලියා ඇත, නමුත් කැනොනිකල් ප්‍රශ්නයට මාරු කිරීමෙන් පසුව අනුවර්තනය කරන ලදි.)
කොන්දේසි:
ඉක්මන් ලැයිස්තුව:
කාර්ය ප්රකාශනය
"නිර්නාමික" functionප්රකාශනය (මෙම පදය තිබියදීත්, සමහර විට නම් සහිත කාර්යයන් නිර්මාණය කරයි)
functionප්රකාශනය ලෙස නම් කර ඇත
ප්රවේශ කාරක ආරම්භක (ES5 +)
ඊතල ශ්‍රිත ප්රකාශනය (ES2015 +) (නිර්නාමික ශ්‍රිත ප්රකාශන මෙන්, පැහැදිලි නමක් ඇතුළත් නොවන අතර තවමත් නම් සමඟ ශ්‍රිත නිර්මාණය කළ හැකිය)
වස්තු ආරම්භකයේ ක්‍රම ප්‍රකාශය (ES2015 +)
class(ES2015 +) හි ඉදිකිරීම්කරු සහ ක්‍රම ප්රකාශන
කාර්ය ප්රකාශනය
පළමු පෝරමය ශ්‍රිත ප්‍රකාශයකි , එය මේ ආකාරයෙන් පෙනේ:
function x() {
console.log('x');
}
ශ්‍රිත ප්‍රකාශයක් යනු ප්‍රකාශයකි ; එය ප්‍රකාශයක් හෝ ප්‍රකාශනයක් නොවේ. එනිසා ඔබ එය අනුගමනය නොකරන්නේ ;(එසේ කිරීම හානිකර නොවන නමුත්).
ඕනෑම පියවරෙන් පියවර කේතයක් ක්‍රියාත්මක කිරීමට පෙර , එය ක්‍රියාත්මක වන සන්දර්භය තුළට ක්‍රියාත්මක වන විට ශ්‍රිත ප්‍රකාශයක් සකසනු ලැබේ. එය නිර්මාණය කරන ශ්‍රිතයට නිසි නමක් ලබා දී ඇත ( xඉහත උදාහරණයේ), එම නම ප්‍රකාශය දිස්වන විෂය පථයට ඇතුළත් කර ඇත.
එකම සන්දර්භය තුළ ඕනෑම පියවරෙන් පියවර කේතයකට පෙර එය සකසා ඇති නිසා, ඔබට මෙවැනි දේ කළ හැකිය:
x(); // Works even though it's above the declaration
function x() {
console.log('x');
}
ES2015 තෙක්, පිරිවිතර ජාවාස්ක්රිප්ට් එන්ජිම ඔබ වැනි පාලන ව්යුහය තුල උත්සවයකට ප්රකාශ දෙනවා නම් ඔබ කළ යුතු දේ ආවරණය කළේ නැත try, if, switch, whileමේ වගේ, ආදිය,:
if (someCondition) {
function foo() { // <===== HERE THERE
} // <===== BE DRAGONS
}
පියවරෙන් පියවර කේතය ක්‍රියාත්මක කිරීමට පෙර ඒවා සකසන බැවින්, ඒවා පාලන ව්‍යුහයක සිටින විට කුමක් කළ යුතු දැයි දැන ගැනීම උපක්‍රමශීලී ය.
මෙය සිදු කිරීම ES2015 වන තෙක් නිශ්චිතව දක්වා නොතිබුණද, එය කොටස්වල ක්රියාකාරී ප්රකාශන සඳහා සහය දැක්වීමට ඉඩ දිය හැකි දිගුවකි . අවාසනාවට (හා නොවැළැක්විය හැකි ලෙස) විවිධ එන්ජින් විවිධ දේ කළේය.
ES2015 වන විට, පිරිවිතරයන් කුමක් කළ යුතු දැයි පවසයි. ඇත්ත වශයෙන්ම, එය කිරීමට වෙනම කරුණු තුනක් ලබා දෙයි:
- වෙබ් බ්‍රව්සරයක නොව ලිහිල් ප්‍රකාරයේදී නම් , ජාවාස්ක්රිප්ට් එන්ජිම එක් දෙයක් කළ යුතුය
- වෙබ් බ්‍රව්සරයක ලිහිල් ප්‍රකාරයේදී නම්, ජාවාස්ක්රිප්ට් එන්ජිම වෙනත් දෙයක් කිරීමට බලාපොරොත්තු වේ
- දී නම් දැඩි මාදිලිය (බ්රව්සරය හෝ නැත), JavaScript එන්ජින් දෙයක් තවත් දෙයක් තවමත් ඉටු කළ යුතු වේ
ලිහිල් මාතයන් සඳහා වන නීති උපක්‍රමශීලී ය, නමුත් දැඩි ප්‍රකාරයේදී, කුට්ටි වල ක්රියාකාරී ප්රකාශ කිරීම පහසු ය: ඒවා බ්ලොක් එකට දේශීය ය (ඒවාට බ්ලොක් විෂය පථය ඇත , එය ES2015 හි ද අළුත් ය), ඒවා ඉහළට ඔසවා ඇත බ්ලොක් එකේ. ඒ නිසා:
"use strict";
if (someCondition) {
foo(); // Works just fine
function foo() {
}
}
console.log(typeof foo); // "undefined" (`foo` is not in scope here
// because it's not in the same block)
"නිර්නාමික" functionප්රකාශනය
දෙවන පොදු ස්වරූපය නිර්නාමික ශ්‍රිත ප්‍රකාශනයක් ලෙස හැඳින්වේ :
var y = function () {
console.log('y');
};
සියලු ප්රකාශන මෙන්ම, එය පියවරෙන් පියවර කේතය ක්‍රියාත්මක කිරීමේදී ළඟා වේ.
ES5 හි, මෙය නිර්මාණය කරන ශ්‍රිතයට නමක් නොමැත (එය නිර්නාමිකයි). ES2015 දී, ශ්‍රිතයට හැකි නම් එය සන්දර්භයෙන් අනුමාන කිරීමෙන් නමක් පවරනු ලැබේ. ඉහත උදාහරණයේ දී, නම වනු ඇත y. ශ්රිතය දේපල ආරම්භකයකුගේ අගය වන විට සමාන දෙයක් සිදු වේ. (සහ නීති සිදුවූ විට මත විස්තර සඳහා, සෙවීමට SetFunctionNameතුළ ඇති පිරිවිතරයන් - එය පෙනී පුරා ස්ථානය.)
functionප්රකාශනය ලෙස නම් කර ඇත
තෙවන ස්වරූපය නම් කරන ලද ශ්‍රිත ප්‍රකාශනයකි ("NFE"):
var z = function w() {
console.log('zw')
};
මෙය නිර්මාණය කරන ශ්‍රිතයට නිසි නමක් ඇත ( wමෙම අවස්ථාවේ දී). සියලු ප්රකාශන මෙන්, මෙය කේතය පියවරෙන් පියවර ක්‍රියාත්මක කිරීමේදී ළඟා වේ. ප්රකාශනය දිස්වන විෂය පථයට ශ්‍රිතයේ නම එකතු නොවේ ; නම වන මෙම උත්සවය තුල ම විෂය පථය තුල:
var z = function w() {
console.log(typeof w); // "function"
};
console.log(typeof w); // "undefined"
ජාවාස්ක්රිප්ට් ක්‍රියාත්මක කිරීම සඳහා එන්එෆ්ඊ බොහෝ විට දෝෂ ප්‍රභවයක් වී ඇති බව සලකන්න. උදාහරණයක් ලෙස, IE8 සහ ඊට පෙර, NFEs සම්පූර්ණයෙන්ම වැරදි ලෙස හසුරුවන්න , වෙනස් වේලාවන් දෙකකදී වෙනස් කාර්යයන් දෙකක් නිර්මාණය කරයි. සෆාරි හි මුල් සංස්කරණවල ද ගැටළු ඇති විය. ශුභාරංචිය නම්, බ්‍රව්සර් වල වර්තමාන අනුවාදයන් (IE9 සහ ඉහළ, වත්මන් සෆාරි) තවදුරටත් එම ගැටළු නොමැති වීමයි. (නමුත් මෙම ලිවීම අනුව, කනගාටුවට කරුණක් නම්, IE8 පුළුල් ලෙස භාවිතයේ පවතින අතර, එබැවින් පොදුවේ වෙබය සඳහා කේත සමඟ NFE භාවිතා කිරීම තවමත් ගැටළු සහගතය.)
ප්රවේශ කාරක ආරම්භක (ES5 +)
සමහර විට කාර්යයන් බොහෝ දුරට නොදැනුවත්වම ගිලී යා හැකිය; සමග එසේ වන accessor කාර්යයන් . මෙන්න උදාහරණයක්:
var obj = {
value: 0,
get f() {
return this.value;
},
set f(v) {
this.value = v;
}
};
console.log(obj.f); // 0
console.log(typeof obj.f); // "number"
මම ශ්රිතය භාවිතා කරන විට, මම භාවිතා නොකළ බව සලකන්න ()! එයට හේතුව එය දේපලකට ප්‍රවේශවීමේ කාර්යයකි . අපි දේපල සාමාන්‍ය ආකාරයෙන් ලබා ගනිමු, නමුත් තිරය පිටුපස, ශ්රිතය හැඳින්වේ.
ඔබ ද සමග accessor කාර්යයන් නිර්මාණය කළ හැකි Object.defineProperty, Object.definePropertiesකිරීමට, හා අඩු ප්රකට දෙවන තර්කය Object.create.
ඊතල ක්රියාකාරී ප්රකාශනය (ES2015 +)
ES2015 අපට ඊතල ශ්රිතය ගෙන එයි . මෙන්න එක් උදාහරණයක්:
var a = [1, 2, 3];
var b = a.map(n => n * 2);
console.log(b.join(", ")); // 2, 4, 6
ඇමතුම තුළ n => n * 2සැඟවී ඇති දෙයක් බලන්න map()? ඒක ශ්රිතයක්.
ඊතල කාර්යයන් පිළිබඳ කරුණු කිහිපයක්:
ඔවුන්ට ඔවුන්ගේම දෑ නොමැත this. ඒ වෙනුවට, ඔවුන් සමීප පුරා ඇති thisඔවුන් අර්ථ කොහෙද සන්දර්භය ය. (ඔවුන් ද සමීප කට argumentsහා, කොහෙද අදාළ, super.) ඉන් අදහස් වන බව thisඔවුන් තුළ ඇති ලෙස එක ම ය thisඔවුන් නිර්මාණය කරන්නේ, සහ වෙනස් කළ නොහැකි.
ඉහත සඳහන් දෑ සමඟ ඔබ දැක ඇති පරිදි, ඔබ මූලික පදය භාවිතා නොකරයි function; ඒ වෙනුවට, ඔබ භාවිතා කරයි =>.
මෙම n => n * 2ඉහත සඳහන් උදාහරණය ඔවුන් එක් ආකාරයකි. ශ්රිතය සම්මත කිරීම සඳහා ඔබට විවිධ තර්ක තිබේ නම්, ඔබ පරෙන්ස් භාවිතා කරයි:
var a = [1, 2, 3];
var b = a.map((n, i) => n * i);
console.log(b.join(", ")); // 0, 2, 6
( Array#mapපළමු තර්කය ලෙස ඇතුළත් කිරීම සහ දෙවන දර්ශකය ලෙස දර්ශකය පසු කරන බව මතක තබා ගන්න .)
අවස්ථා දෙකේදීම, ශ්‍රිතයේ ශරීරය ප්‍රකාශනයක් පමණි; ශ්‍රිතයේ ප්‍රතිලාභ අගය ස්වයංක්‍රීයව එම ප්‍රකාශනයේ ප්‍රති result ලය වනු ඇත (ඔබ පැහැදිලිව භාවිතා නොකරයි return).
ඔබ තනි ප්‍රකාශනයකට වඩා වැඩි යමක් කරන්නේ නම්, භාවිතා කරන්න {}සහ පැහැදිලි කරන්න return(ඔබට වටිනාකමක් ආපසු ලබා දීමට අවශ්ය නම්), සාමාන්‍ය පරිදි:
var a = [
{first: "Joe", last: "Bloggs"},
{first: "Albert", last: "Bloggs"},
{first: "Mary", last: "Albright"}
];
a = a.sort((a, b) => {
var rv = a.last.localeCompare(b.last);
if (rv === 0) {
rv = a.first.localeCompare(b.first);
}
return rv;
});
console.log(JSON.stringify(a));
නැති අනුවාදය ප්රකාශන ශරීරයක් හෝ සංක්ෂිප්ත ශරීරයක්{ ... } සහිත ඊතල ශ්රිතයක් ලෙස හැඳින්වේ . (එසේම: සංක්ෂිප්ත ඊතල ශ්‍රිතයකි.) ශරීරය නිර්වචනය කරන තැනැත්තා ක්රියාකාරී ශරීරයක් සහිත ඊතල ශ්‍රිතයකි . (එසේම: වාචික ඊතල ශ්රිතයක්.){ ... }
වස්තු ආරම්භකයේ ක්‍රම ප්‍රකාශය (ES2015 +)
ක්‍රම නිර්වචනයක් ලෙස හැඳින්වෙන ශ්රිතයක් සඳහන් කරන දේපලක් ප්රකාශ කිරීමට කෙටි ආකාරයකට ES2015 ඉඩ දෙයි ; එය මේ වගේ ය:
var o = {
foo() {
}
};
ES5 හා ඊට පෙර සමාන වේ:
var o = {
foo: function foo() {
}
};
වෙනස (වාචිකතාව හැර) ක්‍රමයක් භාවිතා කළ හැකි superනමුත් ශ්‍රිතයකට එය කළ නොහැකිය. උදාහරණයක් ලෙස, ඔබට valueOfක්‍රම සින්ටැක්ස් භාවිතා කරමින් (කියන්න) අර්ථ දක්වා ඇති වස්තුවක් තිබේ නම් , එය super.valueOf()අගය ලබා ගැනීමට භාවිතා කළ හැකිය Object.prototype.valueOf(අනුමාන වශයෙන් එය සමඟ වෙනත් දෙයක් කිරීමට පෙර), නමුත් ඊඑස් 5 අනුවාදය ඒ Object.prototype.valueOf.call(this)වෙනුවට කළ යුතුව ඇත.
ද ක්රමය බව වස්තුව තාවකාලික, එසේ නම්, ඒ සඳහා අර්ථ විය වස්තුව වෙත යොමු කර ඇති අදහස් (උදාහරණයක් ලෙස, ඔබ එය තුලට ගමන් කරන්නේ ඒ Object.assignමූලාශ්රය වස්තූන් ලෙස), ක්රමය කාරක රීති හැකි වස්තුව රඳවා සිටින බව මින් අදහස් මතකයේ හැටියට එය කසළ එකතු කිරීමට ඉඩ තිබුණි (ජාවාස්ක්රිප්ට් එන්ජිම එම තත්වය හඳුනාගෙන එය භාවිතා නොකරන්නේ නම් එය හැසිරවිය හැක super).
class(ES2015 +) හි ඉදිකිරීම්කරු සහ ක්‍රම ප්රකාශන
classප්‍රකාශිත ඉදිකිරීම්කරුවන් සහ ක්‍රම ඇතුළුව ES2015 අපට සින්ටැක්ස් ගෙන එයි :
class Person {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
getFullName() {
return this.firstName + " " + this.lastName;
}
}
ඉහත ශ්‍රිත ප්රකාශන දෙකක් ඇත: එකක් ඉදිකිරීම්කරුට, නම ලැබෙන Person, සහ එකක් සඳහා getFullName, පවරා ඇති ශ්‍රිතයකි Person.prototype.
