আমি বেশ কয়েকটি অনুরূপ উত্তর দেখেছি, তবে আমি এই পোস্টটি উল্লেখ করতে চাই এটি সর্বোত্তমভাবে বর্ণনা করে, তাই আমি এটি আপনার সাথে ভাগ করে নিতে চাই।
এটি থেকে নেওয়া কিছু কোড এখানে রয়েছে, যা আমি একটি পরিপূর্ণ উদাহরণ পাওয়ার জন্য সংশোধন করেছি যা আশা করি সম্প্রদায়ের পক্ষে উপকার দেয় কারণ এটি ক্লাসগুলির জন্য ডিজাইনের টেম্পলেট হিসাবে ব্যবহার করা যেতে পারে।
এটি আপনার প্রশ্নের উত্তরও দেয়:
function Podcast() {
// private variables
var _somePrivateVariable = 123;
// object properties (read/write)
this.title = 'Astronomy Cast';
this.description = 'A fact-based journey through the galaxy.';
this.link = 'http://www.astronomycast.com';
// for read access to _somePrivateVariable via immutableProp
this.immutableProp = function() {
return _somePrivateVariable;
}
// object function
this.toString = function() {
return 'Title: ' + this.title;
}
};
// static property
Podcast.FILE_EXTENSION = 'mp3';
// static function
Podcast.download = function(podcast) {
console.log('Downloading ' + podcast + ' ...');
};
সেই উদাহরণটি দেওয়া, আপনি স্থির বৈশিষ্ট্য / ফাংশনটি নীচের হিসাবে অ্যাক্সেস করতে পারেন :
// access static properties/functions
console.log(Podcast.FILE_EXTENSION); // 'mp3'
Podcast.download('Astronomy cast'); // 'Downloading Astronomy cast ...'
এবং অবজেক্টের বৈশিষ্ট্য / ফাংশন কেবল এইভাবে :
// access object properties/functions
var podcast = new Podcast();
podcast.title = 'The Simpsons';
console.log(podcast.toString()); // Title: The Simpsons
console.log(podcast.immutableProp()); // 123
নোট করুন যে পডকাস্ট.আইমুট্যাবলপ্রপ () এ, আমাদের একটি বন্ধ রয়েছে : _সোমপ্রাইভেটে ভেরিয়েবলের রেফারেন্সটি ফাংশনের ভিতরে রাখা হয়েছে।
এমনকি আপনি গেটার এবং সেটটারগুলি সংজ্ঞায়িত করতে পারেন । এই কোড স্নিপেটটি একবার দেখুন ( dঅবজেক্টটির প্রোটোটাইপটি যেখানে আপনি একটি সম্পত্তি ঘোষণা করতে চান, yএটি একটি ব্যক্তিগত ভেরিয়েবল যা নির্মাণকারীর বাইরে দৃশ্যমান নয়):
// getters and setters
var d = Date.prototype;
Object.defineProperty(d, "year", {
get: function() {return this.getFullYear() },
set: function(y) { this.setFullYear(y) }
});
এটি সম্পত্তি এবং ফাংশনগুলির d.yearমাধ্যমে সংজ্ঞা দেয় - যদি আপনি নির্দিষ্ট না করেন তবে সম্পত্তিটি কেবল পঠনযোগ্য এবং পরিবর্তিত হতে পারে না (সচেতন হন যদি আপনি সেট করার চেষ্টা করেন তবে ত্রুটি পাবেন না তবে এর কোনও প্রভাব নেই)। প্রতিটি সম্পত্তির বৈশিষ্ট্য রয়েছে , (ঘোষণার পরে পরিবর্তনের অনুমতি দিন) এবং (এটি গণক হিসাবে ব্যবহার করার অনুমতি দিন), যা প্রতি ডিফল্ট থাকে । আপনি তাদের তৃতীয় প্যারামিটারের মাধ্যমে সেট করতে পারেন , যেমন ।getsetsetwritableconfigurableenumerablefalsedefinePropertyenumerable: true
যা বৈধ তা এই বাক্য গঠন:
// getters and setters - alternative syntax
var obj = { a: 7,
get b() {return this.a + 1;},
set c(x) {this.a = x / 2}
};
যা একটি পঠনযোগ্য / লিখনযোগ্য সম্পত্তি a, একটি পঠনযোগ্য সম্পত্তি bএবং কেবলমাত্র লিখনযোগ্য সম্পত্তিকে সংজ্ঞায়িত করে c, যার মাধ্যমে সম্পত্তি aঅ্যাক্সেস করা যায়।
ব্যবহার:
console.log(obj.a); console.log(obj.b); // output: 7, 8
obj.c=40;
console.log(obj.a); console.log(obj.b); // output: 20, 21
মন্তব্য:
আপনি newকীওয়ার্ডটি ভুলে গেছেন সে ক্ষেত্রে অপ্রত্যাশিত আচরণ এড়াতে , আমি আপনাকে ফাংশনটিতে নিম্নলিখিতটি যুক্ত করার পরামর্শ দিচ্ছি Podcast:
// instantiation helper
function Podcast() {
if(false === (this instanceof Podcast)) {
return new Podcast();
}
// [... same as above ...]
};
এখন নিম্নলিখিত দুটি ইনস্ট্যান্টেশন প্রত্যাশার মতো কাজ করবে:
var podcast = new Podcast(); // normal usage, still allowed
var podcast = Podcast(); // you can omit the new keyword because of the helper
'নতুন' বিবৃতিটি একটি নতুন অবজেক্ট তৈরি করে এবং সমস্ত বৈশিষ্ট্য এবং পদ্ধতিগুলি অনুলিপি করে
var a=new Podcast();
var b=new Podcast();
a.title="a"; b.title="An "+b.title;
console.log(a.title); // "a"
console.log(b.title); // "An Astronomy Cast"
আরও মনে রাখবেন, কিছু পরিস্থিতিতে কাস্ট্রার অভ্যন্তরীণভাবে নির্ভর করে এমন একটি কাস্টম অবজেক্ট সুরক্ষিত ফাংশন ফিরিয়ে returnআনতে কনস্ট্রাক্টর ফাংশনে স্টেটমেন্টটি ব্যবহার করা কার্যকর হতে পারে Podcastতবে যা প্রকাশ করা দরকার। এটি নিবন্ধ সিরিজের দ্বিতীয় অধ্যায় (বিষয়গুলি) এ আরও ব্যাখ্যা করা হয়েছে।
আপনি এটি বলতে পারেন aএবং bউত্তরাধিকারী হতে পারেন Podcast। এখন, আপনি যদি পডকাস্টে এমন কোনও পদ্ধতি যুক্ত করতে চান যা তাদের সকলের পরে প্রযোজ্য হয় aএবং bইনস্ট্যান্ট করা হয়েছে? এই ক্ষেত্রে, .prototypeনিম্নলিখিত হিসাবে ব্যবহার করুন :
Podcast.prototype.titleAndLink = function() {
return this.title + " [" + this.link + "]";
};
এখন কল করুন aএবং bআবার
console.log(a.titleAndLink()); // "a [http://www.astronomycast.com]"
console.log(b.titleAndLink()); // "An Astronomy Cast [http://www.astronomycast.com]"
প্রোটোটাইপগুলি সম্পর্কে আরও বিশদ এখানে পাবেন । আপনি আরো উত্তরাধিকার কাজ করতে চান তবে আমি দৃষ্টিপাত করার পরামর্শ দিই এই ।
নিবন্ধ সিরিজ আমি পূর্বেই উল্লেখ করা করেছি অত্যন্ত বাঞ্ছনীয় পড়তে, তারা নিম্নলিখিত বিষয়গুলি অন্তর্ভুক্ত:
- ক্রিয়াকলাপ
- অবজেক্টস
- এগুলির নমুনা
- কনস্ট্রাক্টর ফাংশনগুলিতে নতুন প্রয়োগ করা
- উত্তোলন
- স্বয়ংক্রিয় সেমিকোলন সন্নিবেশ
- স্ট্যাটিক বৈশিষ্ট্য এবং পদ্ধতি
নোট করুন যে স্বয়ংক্রিয় অর্ধেকোলন সন্নিবেশ জাভাস্ক্রিপ্টের "বৈশিষ্ট্য" (in হিসাবে উল্লিখিত) আপনার কোডে অদ্ভুত সমস্যা সৃষ্টির জন্য প্রায়শই দায়ী। অতএব, আমি এটি কোনও বৈশিষ্ট্য হিসাবে বরং বাগ হিসাবে বিবেচনা করব।
আপনি যদি আরও পড়তে চান তবে এখানে এই বিষয়গুলি সম্পর্কে একটি বেশ আকর্ষণীয় এমএসডিএন নিবন্ধ রয়েছে , তাদের মধ্যে বর্ণিত কিছু এখানে আরও বিশদ সরবরাহ করে।
পাশাপাশি পড়তে আকর্ষণীয় কী (এছাড়াও উপরে বর্ণিত বিষয়গুলিও covering েকে দেওয়া) হ'ল এমডিএন জাভাস্ক্রিপ্ট গাইডের সেই নিবন্ধগুলি :
আপনি যদি জাভাস্ক্রিপ্টে সি # outপরামিতিগুলি (যেমন এর মতো DateTime.TryParse(str, out result)) অনুকরণ করতে চান তা জানতে চাইলে আপনি এখানে নমুনা কোডটি সন্ধান করতে পারেন ।
আপনারা যারা IE এর সাথে কাজ করছেন (যা জাভাস্ক্রিপ্টের জন্য কোন কনসোল নেই আপনি যদি বিকাশকারী সরঞ্জামগুলি ব্যবহার F12না করে কনসোল ট্যাবটি না খোলেন) নীচের স্নিপেটটি দরকারী বলে মনে হতে পারে। এটি আপনাকে console.log(msg);উপরের উদাহরণগুলিতে ব্যবহৃত হিসাবে ব্যবহার করতে দেয় । Podcastফাংশনের আগে এটি সন্নিবেশ করান ।
আপনার সুবিধার জন্য, এখানে একটি সম্পূর্ণ সিঙ্গল কোড স্নিপেটে উপরের কোডটি রয়েছে:
let console = { log: function(msg) {
let canvas = document.getElementById("log"), br = canvas.innerHTML==="" ? "" : "<br/>";
canvas.innerHTML += (br + (msg || "").toString());
}};
console.log('For details, see the explaining text');
function Podcast() {
// with this, you can instantiate without new (see description in text)
if (false === (this instanceof Podcast)) {
return new Podcast();
}
// private variables
var _somePrivateVariable = 123;
// object properties
this.title = 'Astronomy Cast';
this.description = 'A fact-based journey through the galaxy.';
this.link = 'http://www.astronomycast.com';
this.immutableProp = function() {
return _somePrivateVariable;
}
// object function
this.toString = function() {
return 'Title: ' + this.title;
}
};
// static property
Podcast.FILE_EXTENSION = 'mp3';
// static function
Podcast.download = function(podcast) {
console.log('Downloading ' + podcast + ' ...');
};
// access static properties/functions
Podcast.FILE_EXTENSION; // 'mp3'
Podcast.download('Astronomy cast'); // 'Downloading Astronomy cast ...'
// access object properties/functions
var podcast = new Podcast();
podcast.title = 'The Simpsons';
console.log(podcast.toString()); // Title: The Simpsons
console.log(podcast.immutableProp()); // 123
// getters and setters
var d = Date.prototype;
Object.defineProperty(d, "year", {
get: function() {
return this.getFullYear()
},
set: function(y) {
this.setFullYear(y)
}
});
// getters and setters - alternative syntax
var obj = {
a: 7,
get b() {
return this.a + 1;
},
set c(x) {
this.a = x / 2
}
};
// usage:
console.log(obj.a); console.log(obj.b); // output: 7, 8
obj.c=40;
console.log(obj.a); console.log(obj.b); // output: 20, 21
var a=new Podcast();
var b=new Podcast();
a.title="a"; b.title="An "+b.title;
console.log(a.title); // "a"
console.log(b.title); // "An Astronomy Cast"
Podcast.prototype.titleAndLink = function() {
return this.title + " [" + this.link + "]";
};
console.log(a.titleAndLink()); // "a [http://www.astronomycast.com]"
console.log(b.titleAndLink()); // "An Astronomy Cast [http://www.astronomycast.com]"
<div id="log"></div>
মন্তব্য:
জাভাস্ক্রিপ্ট প্রোগ্রামিং সম্পর্কে কিছু ভাল টিপস, ইঙ্গিত এবং সুপারিশগুলি সাধারণভাবে আপনি এখানে (জাভাস্ক্রিপ্টের সেরা অনুশীলনগুলি) এবং সেখানে ('ভের' বনাম 'লেট') পেতে পারেন । অন্তর্নিহিত টাইপকাস্ট (জবরদস্তি) সম্পর্কে এই নিবন্ধটিও প্রস্তাবিত ।
ক্লাস ব্যবহার এবং তাদের জাভাস্ক্রিপ্টে সংকলনের একটি সুবিধাজনক উপায় হ'ল টাইপস্ক্রিপ্ট। এখানে একটি খেলার মাঠ যেখানে আপনি কয়েকটি উদাহরণ পেতে পারেন তা দেখায় যে এটি কীভাবে কাজ করে। এমনকি আপনি যদি এই মুহুর্তে টাইপস্ক্রিপ্টটি ব্যবহার না করে থাকেন তবে আপনার নজর থাকতে পারে কারণ আপনি পাশাপাশি স্ক্রিনের সাথে জাভাস্ক্রিপ্ট ফলাফলের সাথে টাইপস্ক্রিপ্টের তুলনা করতে পারেন। বেশিরভাগ উদাহরণগুলি সহজ, তবে একটি রেট্রেসার উদাহরণও রয়েছে যা আপনি তাত্ক্ষণিকভাবে চেষ্টা করতে পারেন। আমি বিশেষত "ক্লাস ব্যবহার করে", "উত্তরাধিকারী ব্যবহার করে" এবং "জেনেরিক্স ব্যবহার" উদাহরণগুলি কম্বোবক্সে নির্বাচন করে তাদের সন্ধান করার পরামর্শ দিচ্ছি - এগুলি জাভাস্ক্রিপ্টে তাত্ক্ষণিকভাবে ব্যবহার করতে পারেন এমন দুর্দান্ত টেম্পলেট। এঙ্গুলার সহ টাইপস্ক্রিপ্ট ব্যবহার করা হয় ।
জাভাস্ক্রিপ্টে স্থানীয় ভেরিয়েবল, ফাংশন ইত্যাদির এনক্যাপসুলেশন অর্জনের জন্য, আমি নিম্নলিখিতগুলির মতো একটি প্যাটার্ন ব্যবহার করার পরামর্শ দিচ্ছি (জ্যাকুয়ারি একই কৌশল ব্যবহার করে):
<html>
<head></head>
<body><script>
'use strict';
// module pattern (self invoked function)
const myModule = (function(context) {
// to allow replacement of the function, use 'var' otherwise keep 'const'
// put variables and function with local module scope here:
var print = function(str) {
if (str !== undefined) context.document.write(str);
context.document.write("<br/><br/>");
return;
}
// ... more variables ...
// main method
var _main = function(title) {
if (title !== undefined) print(title);
print("<b>last modified: </b>" + context.document.lastModified + "<br/>");
// ... more code ...
}
// public methods
return {
Main: _main
// ... more public methods, properties ...
};
})(this);
// use module
myModule.Main("<b>Module demo</b>");
</script></body>
</html>
অবশ্যই, আপনি - এবং করা উচিত - একটি পৃথক *.jsফাইলে স্ক্রিপ্ট কোড লাগাতে পারেন ; উদাহরণটি ছোট রাখার জন্য এটি কেবল ইনলাইনে লেখা।
স্ব-আমন্ত্রণমূলক ক্রিয়াকলাপগুলি (আইআইএফই = তাত্ক্ষণিকভাবে অনুরোধ করা ফাংশন এক্সপ্রেশন হিসাবেও পরিচিত) এখানে আরও বিশদে বর্ণনা করা হয়েছে ।