JavaScript ã®ãã©ã€ããŒããã£ãŒã«ãããã¹ã¿ãŒããå ç¢ãªã¯ã©ã¹ã¡ã³ããŒä¿è·ãå®çŸããã°ããŒãã«éçºè ã®ã»ãã¥ãªãã£ãšã«ãã»ã«åã匷åããŸãã
JavaScript ãã©ã€ããŒããã£ãŒã«ãã¢ã¯ã»ã¹ïŒå®å šãªã¯ã©ã¹ã¡ã³ããŒä¿è·
é²åãç¶ãããŠã§ãéçºã®äžçã§ã¯ãã³ãŒãããŒã¹ã®ä¿è·ã¯æåªå äºé ã§ããJavaScript ãæçããã«ã€ããŠãå ç¢ãªãªããžã§ã¯ãæåããã°ã©ãã³ã° (OOP) ã®ãã©ãã€ã ããŸããŸãåãå ¥ããããã«ãªãã广çãªã«ãã»ã«åãšããŒã¿ãã©ã€ãã·ãŒã®å¿ èŠæ§ãé«ãŸã£ãŠããŸãããã®åéã«ãããæãéèŠãªé²æ©ã® 1 ã€ã¯ãECMAScript ã§ã®ãã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ãã®å°å ¥ã§ãããã®æ©èœã«ãããéçºè ã¯ã¯ã©ã¹ã®å€éšããçã«ã¢ã¯ã»ã¹ã§ããªãã¯ã©ã¹ã¡ã³ããŒãäœæã§ããããã«ãªããå éšç¶æ ãä¿è·ããäºæž¬å¯èœãªåäœãä¿èšŒããããã®åŒ·åãªã¡ã«ããºã ãæäŸããŸãã
ã°ããŒãã«ãããžã§ã¯ãã§äœæ¥ããéçºè ã«ãšã£ãŠãã³ãŒãããŒã¹ã¯å€æ§ãªããŒã ã«ãã£ãŠå ±æããã³æ¡åŒµãããããšãå€ãããããã©ã€ããŒããã£ãŒã«ããçè§£ãå®è£ ããããšã¯éåžžã«éèŠã§ããã³ãŒãã®å質ãšä¿å®æ§ãåäžãããã ãã§ãªããã¢ããªã±ãŒã·ã§ã³ã®ã»ãã¥ãªãã£äœå¶ãå€§å¹ ã«åŒ·åããŸãããã®å æ¬çãªã¬ã€ãã§ã¯ãJavaScript ãã©ã€ããŒããã£ãŒã«ãã¢ã¯ã»ã¹ã®è€éãªç¹ã«ã€ããŠæãäžããããããäœã§ãããããªãéèŠãªã®ããããããã©ã®ããã«å®è£ ããã®ãããããŠéçºã¯ãŒã¯ãããŒã«ããããã¡ãªããã«ã€ããŠèª¬æããŸãã
ããã°ã©ãã³ã°ã«ãããã«ãã»ã«åãšããŒã¿ãã©ã€ãã·ãŒã®çè§£
JavaScript ãã©ã€ããŒããã£ãŒã«ãã®å ·äœäŸã«å ¥ãåã«ããªããžã§ã¯ãæåããã°ã©ãã³ã°ã«ãããã«ãã»ã«åãšããŒã¿ãã©ã€ãã·ãŒã®åºæ¬æŠå¿µãçè§£ããããšãäžå¯æ¬ ã§ãããããã®ååã¯ãã¢ãžã¥ãŒã«æ§ãä¿å®æ§ãã»ãã¥ãªãã£ãä¿é²ãããé©åã«èšèšããããœãããŠã§ã¢ã®ç€ç³ã§ãã
ã«ãã»ã«åãšã¯ïŒ
ã«ãã»ã«åãšã¯ãããŒã¿ïŒå±æ§ãŸãã¯ããããã£ïŒãšããã®ããŒã¿ãæäœããã¡ãœããããã¯ã©ã¹ãšããŠç¥ãããåäžã®ãŠãããã«ãã³ãã«ããããšã§ããããã¯ãé¢é£æ å ±ãšé¢æ°ããŸãšããŠä¿æããä¿è·ã«ãã»ã«ã®ãããªãã®ã§ããã«ãã»ã«åã®äž»ãªç®çã¯ããªããžã§ã¯ãã®å éšå®è£ ã®è©³çްãå€éšäžçããé ãããšã§ããããã¯ããªããžã§ã¯ããããŒã¿ãã©ã®ããã«æ ŒçŽããæäœãå®è¡ãããã¯å éšã§ããããªããžã§ã¯ãã®ãŠãŒã¶ãŒã¯å®çŸ©ãããã€ã³ã¿ãŒãã§ã€ã¹ïŒãã®ãããªãã¯ã¡ãœããïŒãéããŠããã«ã¢ã¯ã»ã¹ããããšãæå³ããŸãã
ãã¬ãã®ãªã¢ã³ã³ãèããŠã¿ãŠãã ãããããªãã¯ã黿ºãããé³éã¢ããããããã£ã³ãã«ããŠã³ãã®ãããªãã¿ã³ã䜿ã£ãŠãªã¢ã³ã³ã«ã¢ã¯ã»ã¹ããŸãããªã¢ã³ã³ã®å éšåè·¯ãã©ã®ããã«æ©èœããããä¿¡å·ãã©ã®ããã«éä¿¡ãããããŸãã¯ãã¬ããããããã©ã®ããã«ãã³ãŒãããããç¥ãå¿ èŠã¯ãããŸããããªã¢ã³ã³ã¯ãããã®è€éãªããã»ã¹ãã«ãã»ã«åãããŠãŒã¶ãŒã«ã·ã³ãã«ãªã€ã³ã¿ãŒãã§ã€ã¹ãæäŸããŸããåæ§ã«ãããã°ã©ãã³ã°ã§ã¯ãã«ãã»ã«åã«ããè€éããæœè±¡åã§ããŸãã
ããŒã¿ãã©ã€ãã·ãŒã¯ãªãéèŠãªã®ãïŒ
广çãªã«ãã»ã«åã®çŽæ¥çãªçµæã§ããããŒã¿ãã©ã€ãã·ãŒãšã¯ããªããžã§ã¯ãã®ããŒã¿ã«èª°ãã¢ã¯ã»ã¹ããŠå€æŽã§ããããå¶åŸ¡ããããšãæããŸããç¹å®ã®ããŒã¿ã¡ã³ããŒããã©ã€ããŒãã«ããããšã§ãå€éšã³ãŒãããã®å€ãçŽæ¥å€æŽããããšãé²ããŸããããã¯ããã€ãã®çç±ã§éèŠã§ãã
- å¶çºçãªå€æŽã®é²æ¢ïŒãã©ã€ããŒããã£ãŒã«ãããªããšãã¢ããªã±ãŒã·ã§ã³ã®ã©ã®éšåã§ããªããžã§ã¯ãã®å éšç¶æ ã倿Žããå¯èœæ§ããããäºæããªããã°ãããŒã¿ç Žæã«ã€ãªãããŸãã`UserProfile` ãªããžã§ã¯ãã§ `userRole` ãä»»æã®ã¹ã¯ãªããã«ãã£ãŠå€æŽã§ããå Žåãæ³åããŠãã ãããããã¯é倧ãªã»ãã¥ãªãã£äžã®è匱æ§ã«ãªããŸãã
- ããŒã¿æŽåæ§ã®ç¢ºä¿ïŒãã©ã€ããŒããã£ãŒã«ãã«ãããæ€èšŒã«ãŒã«ã匷å¶ãããªããžã§ã¯ãã®ç¶æ ã®äžè²«æ§ãç¶æã§ããŸããããšãã°ã`BankAccount` ã¯ã©ã¹ã«ã¯ãã©ã€ããŒã㪠`balance` ããããã£ãããå ŽåããããŸãããããã¯æå¹ãªéé¡ã®ãã§ãã¯ãå«ã `deposit()` ã `withdraw()` ã®ãããªãããªãã¯ã¡ãœãããéããŠã®ã¿å€æŽã§ããŸãã
- ä¿å®ã®ç°¡çŽ åïŒå éšããŒã¿æ§é ãå®è£ ã®è©³çްã倿Žããå¿ èŠãããå Žåããããªãã¯ã€ã³ã¿ãŒãã§ã€ã¹ãäžå®ã§ããéããã¯ã©ã¹ãæ¶è²»ããå€éšã³ãŒãã«åœ±é¿ãäžããããšãªããã¯ã©ã¹å ã§ãããã倿Žã§ããŸããããã«ããã倿Žã®æ³¢å广ãåçã«æžå°ããŸãã
- ã³ãŒãã®å¯èªæ§ãšçè§£ããããã®åäžïŒãããªãã¯ã€ã³ã¿ãŒãã§ã€ã¹ãšãã©ã€ããŒãå®è£ ã®è©³çްãæç¢ºã«åºå¥ããããšã«ãããéçºè ã¯ã¯ã©ã¹ã®ãã¹ãŠã®å éšåäœãåæããå¿ èŠãªããã¯ã©ã¹ã®äœ¿ç𿹿³ãããç°¡åã«çè§£ã§ããŸãã
- ã»ãã¥ãªãã£ã®åŒ·åïŒæ©å¯ããŒã¿ãäžæ£ãªã¢ã¯ã»ã¹ã倿Žããä¿è·ããããšã¯ããµã€ããŒã»ãã¥ãªãã£ã®åºæ¬çãªåŽé¢ã§ãããã©ã€ããŒããã£ãŒã«ãã¯ãç¹ã«ã³ãŒãããŒã¹ã®ç°ãªãéšåéã®ä¿¡é ŒãéãããŠããå¯èœæ§ã®ããç°å¢ã§ãå®å šãªã¢ããªã±ãŒã·ã§ã³ãæ§ç¯ããããã®éèŠãªããŒã«ã§ãã
JavaScript ã¯ã©ã¹ã«ããããã©ã€ãã·ãŒã®é²å
æŽå²çã«ãJavaScript ã®ãã©ã€ãã·ãŒãžã®ã¢ãããŒãã¯ãä»ã®å€ãã®ãªããžã§ã¯ãæåèšèªãããå³å¯ã§ã¯ãããŸããã§ãããçã®ãã©ã€ããŒããã£ãŒã«ããåºçŸããåã¯ãéçºè ã¯ãã©ã€ãã·ãŒãã·ãã¥ã¬ãŒãããããã«ããŸããŸãªæ £ç¿ã«é Œã£ãŠããŸããã
- ããã©ã«ãã§ãããªãã¯ïŒJavaScript ã§ã¯ããã¹ãŠã®ã¯ã©ã¹ããããã£ãšã¡ãœããã¯ããã©ã«ãã§ãããªãã¯ã§ãã誰ã§ãã©ãããã§ãã¢ã¯ã»ã¹ããŠå€æŽã§ããŸãã
- æ £ç¿ïŒã¢ã³ããŒã¹ã³ã¢ãã¬ãã£ãã¯ã¹ (`_`)ïŒåºãæ¡çšãããŠããæ £ç¿ã¯ãããããã£åã«ã¢ã³ããŒã¹ã³ã¢ïŒäŸïŒ`_privateProperty`ïŒãä»ããããšã§ãããããã¯ãä»ã®éçºè ã«ãšã£ãŠããã®ããããã£ã¯ãã©ã€ããŒããšããŠæ±ãããã¹ãã§ãããçŽæ¥ã¢ã¯ã»ã¹ãããã¹ãã§ã¯ãªããšããä¿¡å·ãšããŠæ©èœããŸãããããããããã¯çŽç²ã«æ £ç¿ã§ãããå®éã®åŒ·å¶åã¯ãããŸããã§ãããéçºè ã¯äŸç¶ãšã㊠`_privateProperty` ã«ã¢ã¯ã»ã¹ã§ããŸããã
- ã¯ããŒãžã£ãš IIFEïŒå³æå®è¡é¢æ°åŒïŒïŒããæŽç·Žããããã¯ããã¯ã¯ãã³ã³ã¹ãã©ã¯ã¿é¢æ°ãŸã㯠IIFE ã®ã¹ã³ãŒãå ã§ãã©ã€ããŒã倿°ãäœæããããã«ã¯ããŒãžã£ã䜿çšããããšãå«ã¿ãŸããããã©ã€ãã·ãŒãéæããã®ã«å¹æçã§ãããããããã®æ¹æ³ã¯ãå°çšã®ãã©ã€ããŒããã£ãŒã«ãæ§æãããåé·ã§çŽæçã§ãªãå ŽåããããŸãã
ãããã®åæã®æ¹æ³ã¯æçšã§ããããçã®ã«ãã»ã«åãæ¬ ããŠããŸããããã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ãã®å°å ¥ã¯ããã®ãã©ãã€ã ãå€§å¹ ã«å€æŽããŸãã
JavaScript ãã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ã (#) ã®ç޹ä»
ECMAScript 2022 (ES2022) ã¯ãããã·ã¥èšå· (`#`) ãã¬ãã£ãã¯ã¹ã§æå®ããããã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ããæ£åŒã«å°å ¥ããŸããããã®æ§æã¯ãã¯ã©ã¹ã«çã«ãã©ã€ããŒããªã¡ã³ããŒã宣èšããããã®å ç¢ã§æšæºåãããæ¹æ³ãæäŸããŸãã
æ§æãšå®£èš
ãã©ã€ããŒããã£ãŒã«ãã宣èšããã«ã¯ããã®ååã« `#` ãä»ããã ãã§ãã
class MyClass {
#privateField;
constructor(initialValue) {
this.#privateField = initialValue;
}
#privateMethod() {
console.log('This is a private method.');
}
publicMethod() {
console.log(`The private field value is: ${this.#privateField}`);
this.#privateMethod();
}
}
ãã®äŸã§ã¯:
- `#privateField` ã¯ãã©ã€ããŒãã€ã³ã¹ã¿ã³ã¹ãã£ãŒã«ãã§ãã
- `#privateMethod` ã¯ãã©ã€ããŒãã€ã³ã¹ã¿ã³ã¹ã¡ãœããã§ãã
ã¯ã©ã¹å®çŸ©å ã§ã¯ã`this.#privateField` ããã³ `this.#privateMethod()` ã䜿çšããŠãããã®ãã©ã€ããŒãã¡ã³ããŒã«ã¢ã¯ã»ã¹ã§ããŸããåãã¯ã©ã¹å ã®ãããªãã¯ã¡ãœããã¯ããããã®ãã©ã€ããŒãã¡ã³ããŒã«èªç±ã«ã¢ã¯ã»ã¹ã§ããŸãã
ãã©ã€ããŒããã£ãŒã«ããžã®ã¢ã¯ã»ã¹
å éšã¢ã¯ã»ã¹ïŒ
class UserProfile {
#username;
#email;
constructor(username, email) {
this.#username = username;
this.#email = email;
}
#getInternalDetails() {
return `Username: ${this.#username}, Email: ${this.#email}`;
}
displayPublicProfile() {
console.log(`Public Profile: ${this.#username}`);
}
displayAllDetails() {
console.log(this.#getInternalDetails());
}
}
const user = new UserProfile('alice', 'alice@example.com');
user.displayPublicProfile(); // Output: Public Profile: alice
user.displayAllDetails(); // Output: Username: alice, Email: alice@example.com
ã芧ã®ãšããã`displayAllDetails` 㯠`#username` ã«ã¢ã¯ã»ã¹ãããã©ã€ããŒã㪠`#getInternalDetails()` ã¡ãœãããåŒã³åºãããšãã§ããŸãã
å€éšã¢ã¯ã»ã¹ïŒããã³å€±æããçç±ïŒïŒ
ã¯ã©ã¹ã®å€éšãããã©ã€ããŒããã£ãŒã«ãã«ã¢ã¯ã»ã¹ããããšãããšãSyntaxError ãŸã㯠TypeError ãçºçããŸãã
// Attempting to access from outside the class:
// console.log(user.#username); // SyntaxError: Private field '#username' must be declared in an enclosing class
// user.#privateMethod(); // SyntaxError: Private field '#privateMethod' must be declared in an enclosing class
ããããã©ã€ããŒããã£ãŒã«ãã«ãã£ãŠæäŸãããä¿è·ã®æ žå¿ã§ããJavaScript ãšã³ãžã³ã¯å®è¡æã«ãã®ãã©ã€ãã·ãŒã匷å¶ããäžæ£ãªå€éšã¢ã¯ã»ã¹ãé²ããŸãã
ãã©ã€ããŒãéçãã£ãŒã«ããšã¡ãœãã
ãã©ã€ããŒããã£ãŒã«ãã¯ã€ã³ã¹ã¿ã³ã¹ã¡ã³ããŒã«éå®ãããŸãããåã `#` ãã¬ãã£ãã¯ã¹ã䜿çšããŠããã©ã€ããŒãéçãã£ãŒã«ããšã¡ãœãããå®çŸ©ããããšãã§ããŸãã
class ConfigurationManager {
static #defaultConfig = {
timeout: 5000,
retries: 3
};
static #validateConfig(config) {
if (!config || typeof config !== 'object') {
throw new Error('Invalid configuration provided.');
}
console.log('Configuration validated.');
return true;
}
static loadConfig(config) {
if (this.#validateConfig(config)) {
console.log('Loading configuration...');
return { ...this.#defaultConfig, ...config };
}
return this.#defaultConfig;
}
}
const userConfig = {
timeout: 10000,
apiKey: 'xyz123'
};
const finalConfig = ConfigurationManager.loadConfig(userConfig);
console.log(finalConfig); // Output: { timeout: 10000, retries: 3, apiKey: 'xyz123' }
// console.log(ConfigurationManager.#defaultConfig); // SyntaxError: Private field '#defaultConfig' must be declared in an enclosing class
// ConfigurationManager.#validateConfig({}); // SyntaxError: Private field '#validateConfig' must be declared in an enclosing class
ããã§ã¯ã`#defaultConfig` ããã³ `#validateConfig` ã¯ãã©ã€ããŒãéçã¡ã³ããŒã§ããã`ConfigurationManager` ã¯ã©ã¹ã®éçã¡ãœããå ã§ã®ã¿ã¢ã¯ã»ã¹ã§ããŸãã
ãã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ããš `Object.prototype.hasOwnProperty`
ãã©ã€ããŒããã£ãŒã«ãã¯åæå¯èœã§ã¯ãªãã`Object.keys()`ã`Object.getOwnPropertyNames()`ããŸã㯠`for...in` ã«ãŒãã®ãããªã¡ãœããã䜿çšããŠãªããžã§ã¯ãã®ããããã£ãå埩åŠçããŠã衚瀺ãããªãããšã«æ³šæããããšãéèŠã§ãããŸãããã©ã€ããŒããã£ãŒã«ãã®æåååïŒäŸïŒ`user.hasOwnProperty('#username')` 㯠false ãè¿ããŸãïŒã§ãã§ãã¯ããå ŽåãObject.prototype.hasOwnProperty() ã§ã¯æ€åºãããŸããã
ãã©ã€ããŒããã£ãŒã«ããžã®ã¢ã¯ã»ã¹ã¯ãçŽæ¥ã¢ã¯ã»ã¹å¯èœãªæåå衚çŸã§ã¯ãªããå éšèå¥å (`#fieldName`) ã«å³å¯ã«åºã¥ããŠããŸãã
ã°ããŒãã«ã§ã®ãã©ã€ããŒããã£ãŒã«ãã®äœ¿çšã«ããã¡ãªãã
ãã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ãã®æ¡çšã¯ãç¹ã«ã°ããŒãã« JavaScript éçºã®æèã«ãããŠãå®è³ªçãªå©ç¹ããããããŸãã
1. ã»ãã¥ãªãã£ãšå ç¢æ§ã®åäž
ããã¯æãå³å¹æ§ããããæãéèŠãªã¡ãªããã§ããéèŠãªããŒã¿ãå€éšãã倿Žãããã®ãé²ãããšã«ããããã©ã€ããŒããã£ãŒã«ãã¯ã¯ã©ã¹ãããå®å šã«ããæ¹ããããã«ãããªããŸããããã¯ç¹ã«ä»¥äžã®å Žåã«éèŠã§ãã
- èªèšŒããã³èªå¯ã·ã¹ãã ïŒæ©å¯æ§ã®é«ãããŒã¯ã³ããŠãŒã¶ãŒèªèšŒæ å ±ããŸãã¯æš©éã¬ãã«ãæ¹ãããããã®ãä¿è·ããŸãã
- éèã¢ããªã±ãŒã·ã§ã³ïŒæ®é«ãååŒè©³çްã®ãããªéèããŒã¿ã®æŽåæ§ã確ä¿ããŸãã
- ããŒã¿æ€èšŒããžãã¯ïŒãããªãã¯ã»ãã¿ãŒã«ãã£ãŠåŒã³åºããããã©ã€ããŒãã¡ãœããå ã«è€éãªæ€èšŒã«ãŒã«ãã«ãã»ã«åããç¡å¹ãªããŒã¿ãã·ã¹ãã ã«å ¥ãã®ãé²ããŸãã
ã°ããŒãã«äŸïŒæ±ºæžã²ãŒããŠã§ã€ã®çµ±åãèããŠã¿ãŠãã ãããAPI ãªã¯ãšã¹ããåŠçããã¯ã©ã¹ã«ã¯ãAPI ããŒãšã·ãŒã¯ã¬ããããŒã¯ã³ã®ãã©ã€ããŒããã£ãŒã«ããããå ŽåããããŸãããããã¯ãå€éšã³ãŒããããå¶çºçã§ãã£ãŠããæ±ºããŠå ¬éãŸãã¯å€æŽãããã¹ãã§ã¯ãããŸããããã©ã€ããŒããã£ãŒã«ãã¯ããã®éèŠãªã»ãã¥ãªãã£ã¬ã€ã€ãŒãä¿èšŒããŸãã
2. ã³ãŒãä¿å®æ§ã®åäžãšãããã°æéã®ççž®
å éšç¶æ ãä¿è·ãããŠããå Žåãã¯ã©ã¹å ã®å€æŽãã¢ããªã±ãŒã·ã§ã³ã®ä»ã®éšåãå£ãå¯èœæ§ã¯äœããªããŸããããã«ããã以äžã®ãããªçµæãåŸãããŸãã
- ãªãã¡ã¯ã¿ãªã³ã°ã®ç°¡çŽ åïŒãããªã㯠API ãå®å®ããŠããéããããŒã¿ã®å éšè¡šçŸãŸãã¯ã¡ãœããã®å®è£ ã倿ŽããŠããã¯ã©ã¹ã®ã³ã³ã·ã¥ãŒããŒã«åœ±é¿ãäžããããšãªã倿Žã§ããŸãã
- ãããã°ã®å®¹æåïŒãªããžã§ã¯ãã®ç¶æ ã«é¢é£ãããã°ãçºçããå Žåãå€éšã³ãŒããç¶æ ãç Žæãããå¯èœæ§ããªããããåé¡ãã¯ã©ã¹èªäœã«ãããšç¢ºä¿¡ã§ããŸãã
ã°ããŒãã«äŸïŒå€åœç± e ã³ããŒã¹ãã©ãããã©ãŒã ã«ã¯ `Product` ã¯ã©ã¹ããããããããŸããã補åäŸ¡æ Œã®å éšæ ŒçŽæ¹æ³ã倿Žãããå ŽåïŒããšãã°ãã»ã³ãããããè€éãªå°æ°è¡šçŸã«å€æŽãããå°åããšã®é貚圢åŒã«å¯Ÿå¿ããããã«ïŒããã©ã€ããŒã㪠`_price` ãã£ãŒã«ããããã°ãããã³ããšã³ãããã³ããã¯ãšã³ããµãŒãã¹ã§äœ¿çšããããããªãã¯ãª `getPrice()` ãŸã㯠`setPrice()` ã¡ãœããã«åœ±é¿ãäžããããšãªãããã®å€æŽãå¯èœã«ãªããŸãã
3. æç¢ºãªæå³ãšèªå·±ææžåã³ãŒã
`#` ãã¬ãã£ãã¯ã¹ã¯ãã¡ã³ããŒããã©ã€ããŒãã§ããããšãæç¢ºã«ç€ºããŸããããã«ããã
- èšèšäžã®æ±ºå®ãäŒéããïŒä»ã®éçºè ïŒå°æ¥ã®èªåèªèº«ãå«ãïŒã«ããã®ã¡ã³ããŒãå éšè©³çްã§ããããããªã㯠API ã®äžéšã§ã¯ãªãããšãæç¢ºã«äŒããŸãã
- ææ§ããæžããïŒåãªãæ £ç¿ã§ãã£ãã¢ã³ããŒã¹ã³ã¢ãã¬ãã£ãã¯ã¹ä»ãããããã£ã«é¢ããæšæž¬ãæé€ããŸãã
ã°ããŒãã«äŸïŒããŸããŸãªã¿ã€ã ãŸãŒã³ãæåçèæ¯ãæã€éçºè ããããããžã§ã¯ãã§ã¯ã`#` ã®ãããªæç€ºçãªããŒã«ãŒã¯èª€è§£ãæžãããŸããæ±äº¬ã®éçºè ã¯ã广çã«äŒéãããŠããªãå¯èœæ§ã®ããå éšã³ãŒãã£ã³ã°æ £ç¿ã«é¢ããæ·±ãã³ã³ããã¹ããå¿ èŠãšããã«ããã£ãŒã«ãã®æå³ããããã©ã€ãã·ãŒãããã«çè§£ã§ããŸãã
4. OOP ååã®éµå®
ãã©ã€ããŒããã£ãŒã«ãã¯ãJavaScript ã確ç«ããã OOP ååã«ããè¿ã¥ããJavaãC#ãPython ã®ãããªèšèªããã®éçºè ãç¥èãç§»è¡ãé©çšããããããŸãã
- ãã匷åãªã«ãã»ã«åïŒçã®ããŒã¿é èœãæäŸããŸãããã㯠OOP ã®æ žãšãªãååã§ãã
- ããåªããæœè±¡åïŒãªããžã§ã¯ãã®ã€ã³ã¿ãŒãã§ã€ã¹ãšãã®å®è£ ã®ã¯ãªãŒã³ãªåé¢ãå¯èœã«ããŸãã
5. ã¯ã©ã¹å ã§ã®ã¢ãžã¥ãŒã«ã®ãããªåäœã®ä¿é²
ãã©ã€ããŒããã£ãŒã«ãã¯ãèªå·±å®çµåã®æ©èœãŠããããäœæããã®ã«åœ¹ç«ã¡ãŸãããã©ã€ããŒãã¡ã³ããŒãæã€ã¯ã©ã¹ã¯ãäžèŠãªè©³çްãå ¬éããããšãªããç¬èªã®ç¶æ ãšåäœã管çã§ããŸãããã㯠JavaScript ã¢ãžã¥ãŒã«ãæ©èœããæ¹æ³ã«äŒŒãŠããŸãã
ã°ããŒãã«äŸïŒäžçäžã®ããŒã ã䜿çšããããŒã¿å¯èŠåã©ã€ãã©ãªãæ€èšããŠãã ããã`Chart` ã¯ã©ã¹ã«ã¯ãå éšããŒã¿åŠç颿°ãã¬ã³ããªã³ã°ããžãã¯ããŸãã¯ç¶æ 管çã®ããã®ãã©ã€ããŒããã£ãŒã«ããããå ŽåããããŸãããããã®ãã©ã€ããŒãã³ã³ããŒãã³ãã¯ããã£ãŒãã³ã³ããŒãã³ããããŸããŸãª Web ã¢ããªã±ãŒã·ã§ã³ã§ã©ã®ããã«äœ¿çšãããŠããå ç¢ã§äºæž¬å¯èœã§ããããšãä¿èšŒããŸãã
ãã©ã€ããŒããã£ãŒã«ãã®äœ¿çšã«é¢ãããã¹ããã©ã¯ãã£ã¹
ãã©ã€ããŒããã£ãŒã«ãã¯åŒ·åãªä¿è·ãæäŸããŸããã广çã«äœ¿çšããã«ã¯æ éãªæ€èšãå¿ èŠã§ãã
1. å éšç¶æ ãšå®è£ ã®è©³çްã«ãã©ã€ããŒããã£ãŒã«ãã䜿çšãã
ãã¹ãŠããã©ã€ããŒãã«ããªãã§ãã ããããã©ã€ããŒããã£ãŒã«ãã¯ã以äžã®ãããªããŒã¿ãã¡ãœããã®ããã«äºçŽããŠãã ããã
- ã¯ã©ã¹ã®ã³ã³ã·ã¥ãŒããŒãçŽæ¥ã¢ã¯ã»ã¹ãŸãã¯å€æŽããã¹ãã§ã¯ãããŸããã
- å°æ¥å€æŽãããå¯èœæ§ã®ããå éšåäœã衚ããŸãã
- æ©å¯æ å ±ãå«ãã§ãããã倿Žåã«å³æ Œãªæ€èšŒãå¿ èŠã§ãã
2. ãããªãã¯ã²ãã¿ãŒãšã»ãã¿ãŒãæäŸããïŒå¿ èŠã«å¿ããŠïŒ
å€éšã³ãŒãããã©ã€ããŒããã£ãŒã«ããèªã¿åããŸãã¯å€æŽããå¿ èŠãããå Žåã¯ããããªãã¯ã²ãã¿ãŒããã³ã»ãã¿ãŒã¡ãœãããéããŠå ¬éããŸããããã«ãããã¢ã¯ã»ã¹ãå¶åŸ¡ããããžãã¹ããžãã¯ã匷å¶ã§ããŸãã
class Employee {
#salary;
constructor(initialSalary) {
this.#salary = this.#validateSalary(initialSalary);
}
#validateSalary(salary) {
if (typeof salary !== 'number' || salary < 0) {
throw new Error('Invalid salary. Salary must be a non-negative number.');
}
return salary;
}
get salary() {
// Optionally add authorization checks here if needed
return this.#salary;
}
set salary(newSalary) {
this.#salary = this.#validateSalary(newSalary);
}
}
const emp = new Employee(50000);
console.log(emp.salary); // Output: 50000
emp.salary = 60000; // Uses the setter
console.log(emp.salary); // Output: 60000
// emp.salary = -1000; // Throws an error due to validation in the setter
3. å éšããžãã¯ã«ãã©ã€ããŒãã¡ãœãããæŽ»çšãã
ã¯ã©ã¹å ã®è€éãŸãã¯åå©çšå¯èœãªããžãã¯ã§ãå ¬éããå¿ èŠããªããã®ã¯ããã©ã€ããŒãã¡ãœããã«ç§»åã§ããŸããããã«ããããããªãã¯ã€ã³ã¿ãŒãã§ã€ã¹ãã¯ãªãŒã³ã«ãªããã¯ã©ã¹ãçè§£ãããããªããŸãã
class DataProcessor {
#rawData;
constructor(data) {
this.#rawData = data;
}
#cleanData() {
// Complex data cleaning logic...
console.log('Cleaning data...');
return this.#rawData.filter(item => item !== null && item !== undefined);
}
#transformData(cleanedData) {
// Transformation logic...
console.log('Transforming data...');
return cleanedData.map(item => item * 2);
}
process() {
const cleaned = this.#cleanData();
const transformed = this.#transformData(cleaned);
console.log('Processing complete:', transformed);
return transformed;
}
}
const processor = new DataProcessor([1, 2, null, 4, undefined, 6]);
processor.process();
// Output:
// Cleaning data...
// Transforming data...
// Processing complete: [ 2, 4, 8, 12 ]
4. JavaScript ã®åçãªæ§è³ªã«æ³šæãã
ãã©ã€ããŒããã£ãŒã«ãã¯åŒ·åãªåŒ·å¶ãæäŸããŸãããJavaScript ã¯åçãªèšèªã§ããç¹å®ã®é«åºŠãªãã¯ããã¯ãã°ããŒãã«ãª `eval()` åŒã³åºãã¯ãäžéšã®ä¿è·ããã€ãã¹ã§ããå¯èœæ§ããããŸããããã©ã€ããŒããã£ãŒã«ããžã®çŽæ¥ã¢ã¯ã»ã¹ã¯ãšã³ãžã³ã«ãã£ãŠé²æ¢ãããŸããäž»ãªã¡ãªããã¯ãæšæºçãªå®è¡ç°å¢å ã§ã®å¶åŸ¡ãããã¢ã¯ã»ã¹ã«ãããŸãã
5. äºææ§ãšãã©ã³ã¹ãã¬ãŒã·ã§ã³ãèæ ®ãã
ãã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ãã¯ææ°ã®æ©èœã§ãããããžã§ã¯ãã§ ES2022 æ©èœããã€ãã£ãã«ãµããŒãããŠããªãå€ã JavaScript ç°å¢ïŒäŸïŒå€ããã©ãŠã¶ãŸã㯠Node.js ããŒãžã§ã³ïŒããµããŒãããå¿ èŠãããå ŽåãBabel ã®ãããªãã©ã³ã¹ãã€ã©ã䜿çšããå¿ èŠããããŸããBabel ã¯ããã«ãããã»ã¹äžã«ãã©ã€ããŒããã£ãŒã«ããåçã®ãã©ã€ããŒãã©ã€ã¯ãªæ§é ïŒå€ãã®å Žåãã¯ããŒãžã£ãŸã㯠`WeakMap` ã䜿çšïŒã«å€æããããšã§ãäºææ§ãä¿èšŒã§ããŸãã
ã°ããŒãã«éçºã®èæ ®äºé ïŒã°ããŒãã«ãªãªãŒãã£ãšã³ã¹ã®ããã«æ§ç¯ããå Žåãå€ãããã€ã¹ã®ãŠãŒã¶ãŒãããœãããŠã§ã¢ã®æŽæ°ãåžžã«åªå ããããšã¯éããªãå°åã«ééããå¯èœæ§ããããŸãããã©ã³ã¹ãã¬ãŒã·ã§ã³ã¯ããã¹ãŠã®ãŠãŒã¶ãŒãã¢ããªã±ãŒã·ã§ã³ãã¹ã ãŒãºã«å®è¡ã§ããããã«ããããã«äžå¯æ¬ ã§ãã
å¶éäºé ãšä»£æ¿ææ®µ
ãã©ã€ããŒããã£ãŒã«ãã¯åŒ·åã§ããããã¹ãŠã®ãã©ã€ãã·ãŒæžå¿µã«å¯Ÿããäžèœè¬ã§ã¯ãããŸããããããã®ã¹ã³ãŒããšæœåšçãªå¶éãèªèããããšãéèŠã§ãã
- çã®ããŒã¿ã»ãã¥ãªãã£ã§ã¯ãªãïŒãã©ã€ããŒããã£ãŒã«ãã¯ãã¯ã©ã¹å€éšããã®å¶çºçãŸãã¯æå³çãªå€æŽããä¿è·ããŸãããããã¯ããŒã¿ãæå·åããããå®è¡ç°å¢ã«ã¢ã¯ã»ã¹ã§ããæªæã®ããã³ãŒãããä¿è·ãããããŸããã
- äžéšã®ã·ããªãªã§ã®è€éãïŒéåžžã«è€éãªç¶æ¿éå±€ã®å Žåããã¯ã©ã¹ã®å¶åŸ¡ãããã€ã³ã¿ãŒãã§ã€ã¹ã®äžéšã§ã¯ãªãå€éšé¢æ°ã«ãã©ã€ããŒãããŒã¿ãæž¡ãå¿ èŠãããå Žåããã©ã€ããŒããã£ãŒã«ãã¯æã è€éããå¢ãå¯èœæ§ããããŸãã
æ £ç¿ãä»ã®ãã¿ãŒã³ããã€äœ¿çšããŸããïŒ
- ã¬ã¬ã·ãŒã³ãŒãããŒã¹ïŒãã©ã€ããŒããã£ãŒã«ãã䜿çšããããã«æŽæ°ãããŠããªãå€ããããžã§ã¯ãã«åãçµãã§ããå Žåããªãã¡ã¯ã¿ãªã³ã°ãŸã§äžè²«æ§ã®ããã«ã¢ã³ããŒã¹ã³ã¢æ £ç¿ãç¶ç¶ãããããããŸããã
- å€ãã©ã€ãã©ãªãšã®çžäºéçšæ§ïŒäžéšã®å€ãã©ã€ãã©ãªã¯ããããã£ãã¢ã¯ã»ã¹å¯èœã§ããããšãæåŸ ããŠãããããããçŽæ¥æ€æ»ãŸãã¯å€æŽããããšããå Žåãå³å¯ãªãã©ã€ããŒããã£ãŒã«ããšããŸãæ©èœããªãå¯èœæ§ããããŸãã
- ããã·ã³ãã«ãªã±ãŒã¹ïŒæå³ããªã倿Žã®ãªã¹ã¯ãæå°éã§ããéåžžã«ã·ã³ãã«ãªã¯ã©ã¹ã®å Žåããã©ã€ããŒããã£ãŒã«ãã®ãªãŒããŒãããã¯äžèŠãããããŸãããããããã䜿çšããããšã¯äžè¬çã«ããè¯ããã©ã¯ãã£ã¹ãä¿é²ããŸãã
çµè«
JavaScript ãã©ã€ããŒãã¯ã©ã¹ãã£ãŒã«ã (`#`) ã¯ãJavaScript ã«ãããã¯ã©ã¹ããŒã¹ã®ããã°ã©ãã³ã°ã匷åããããã®ç»æçãªã¹ãããã衚ããŸãããããã¯çã®ã«ãã»ã«åãšããŒã¿ãã©ã€ãã·ãŒãæäŸããJavaScript ãä»ã®æçããèšèªã§èŠãããå ç¢ãª OOP æ©èœã«è¿ã¥ããŸããã°ããŒãã«éçºããŒã ããããžã§ã¯ãã«ãšã£ãŠããã©ã€ããŒããã£ãŒã«ããæ¡çšããããšã¯ãæ°ããæ§æãæ¡çšããã ãã§ã¯ãããŸãããããå®å šã§ãä¿å®ãããããçè§£ããããã³ãŒããæ§ç¯ããããšã§ãã
ãã©ã€ããŒããã£ãŒã«ããæŽ»çšããããšã§ã以äžãè¡ãããšãã§ããŸãã
- ã¢ããªã±ãŒã·ã§ã³ã匷åããæå³ããªãããŒã¿ç Žæãã»ãã¥ãªãã£äŸµå®³ããã
- å éšå®è£ ã®è©³çްãåé¢ããããšã§ãä¿å®ãåçåããŸãã
- æå³ãããããŒã¿ã¢ã¯ã»ã¹ã«é¢ããæç¢ºãªã·ã°ãã«ãæäŸããããšã§ãã³ã©ãã¬ãŒã·ã§ã³ãæ¹åããŸãã
- åºæ¬ç㪠OOP ååãéµå®ããããšã§ãã³ãŒãã®å質ãåäžãããŸãã
ææ°ã® JavaScript ã¢ããªã±ãŒã·ã§ã³ãæ§ç¯ããéã«ã¯ããã©ã€ããŒããã£ãŒã«ããã¯ã©ã¹èšèšã®åºç€ã«ããŠãã ããããã®æ©èœãæ¡çšããŠãæéã®ãã¹ããšã°ããŒãã«ã³ã©ãã¬ãŒã·ã§ã³ã«èãããããå埩åããããå®å šã§ããããã§ãã·ã§ãã«ãªãœãããŠã§ã¢ãäœæããŠãã ããã
仿¥ããããªãã®ãããžã§ã¯ãã«ãã©ã€ããŒããã£ãŒã«ããçµ±åããçã«ä¿è·ãããã¯ã©ã¹ã¡ã³ããŒã®ã¡ãªãããäœéšããŠãã ãããããåºç¯ãªäºææ§ã®ããã«ãã©ã³ã¹ãã¬ãŒã·ã§ã³ãèæ ®ããããªãã®ã»ãã¥ã¢ã³ãŒãã£ã³ã°ãã©ã¯ãã£ã¹ããã¹ãŠã®ãŠãŒã¶ãŒã«ã¡ãªãããããããããšãä¿èšŒããŠãã ããã