ஜாவாஸ்கிரிப்ட் என்பது இனிமையான பல்வேறு ஆச்சரியங்கள் நிறைந்த நிரலாக்க மொழியாகும். பொதுவாக பலர் முதலில் இந்த ஜாவாஸ் கிரிப்டை இணையத் திற்கான மொழியாக எதிர்கொள்கின்றனர். ஆயினும் அனைத்து முக்கிய இணைய உலாவிகளிலும் ஜாவாஸ்கிரிப்ட் செயலி உள்ளது, மிகமுக்கியமாக இணைய வடிவமைப்பை எளிதாக்க உதவும் JQuery, Cash, Bootstrap போன்ற பிரபலமான கட்டமைப்புகள் இதில் உள்ளன, மேலும் ஜாவாஸ்கிரிப்டில் எழுதப்பட்ட நிரலாக்க சூழல்களும் உள்ளன. இது இணையத்தில் எல்லா இடங்களிலும் இருப்பதாகத் தெரிகிறது, ஆனாலும் இந்தஜாவாஸ்கிரிப்டுடன் குறுக்கு-தள மேசைக்கணினி பயன்பாடுகளை உருவாக்குவதற்கான திறமூல கருவித்தொகுப்பான எலக்ட்ரான் போன்ற செயல்திட்டங்களுக்கும் இது ஒரு பயனுள்ள கணினி மொழி என மாறிவிடுகின்ற அபாயம்உள்ளது. ஜாவாஸ்கிரிப்ட் ஒரு வியக்கத்தக்க பல்நோக்கு கணினிமொழியாகும், இது இணையதளங்களை உருவாக்குவதற்கு தேவையானதை விட அளவுக்கு அதிகமான நூலகங்களைக் கொண்டுள்ளது. இந்த ஜாவாஸ்கிரிப்ட் எனும் கணினி மொழியின்அடிப்படைகளைக் கற்றுக்கொள்வது எளிது, மேலும் இது நாம் கற்பனை செய்வதை உருவாக்குவதற்கான நுழைவாயிலாக திகழ்கின்றது
. ஜாவாஸ்கிரிப்டை நிறுவுகைசெய்தல் ஜாவாஸ்கிரிப்டுடன் பயன்படுத்த துவங்கி முன்னேறும்போது மேம்பட்ட ஜாவாஸ்கிரிப்ட்டின் நூலகங்கள் , இயக்க நேரநூலகங்கள் ஆகிவற்றை நாம் விரும்பலாம். அதனால் இதில் நம்முடைய முதன்முதலான குறிமுறைவரிகளை எழுதத்துவங்கும் போது, ஜாவாஸ்கிரிப்டை நிறுவுகைசெய்ய வேண்டியதில்லை. ஏனெனில் முக்கிய அனைத்து இணைய உலாவிகளிலும் இதனுடைய குறிமுறைவரிகளின் இயக்குவதற்கு அடிப்படை தேவையான இதனுடைய செயலி உள்ளடங்கியுள்ளது. அதனால் நமக்கு பிடித்த உரை பதிப்பாளரைப் பயன்படுத்தி ஜாவாஸ்கிரிப்ட்டின் குறிமுறை வரிகளை எழுதலாம், அதை நம்முடைய இணைய உலாவியில் பதிவேற்றம் செய்திடலாம், அதனை தொடர்ந்து நம்முடைய குறிமுறைவரிகள் எவ்வாறு செயல் படுகின்றது என நாமே சரிபார்த்திடலாம்.
ஜாவாஸ்கிரிப்டுடன் துவங்குதல் நம்முடைய முதன் முதலான ஜாவாஸ்கிரிப்ட் குறிமுறைவரிகளை எழுத, நமக்கு பிடித்த உரை பதிப்பாளரான, நோட்பேடு ++, Atom அல்லது VSCode போன்றவற்றைத் திரையில் தோன்றச்செய்திடுக. இது இணையத்திற்காக உருவாக்கப் பட்டதால், ஜாவாஸ்கிரிப்ட் ஆனது HTML உடன் இணைந்து நன்றாக செயல்படுகிறது, எனவே முதலில், சில அடிப்படை HTML ஐ முயற்சி்த்திடுக
<html>
<head>
<title>JS</title>
</head>
<body>
<p id=”example”>Nothing here.</p>
</body>
</html>
இந்தகோப்பைச் சேமித்தபின்னர் அதை இணைய உலாவியில் திறந்திடுக.
1
இந்த எளிய HTML பக்கத்தில் ஜாவாஸ்கிரிப்டைச் சேர்ப்பதற்காக, ஜாவாஸ்கிரிப்ட் கோப்பை உருவாக்கலாம், பக்கத்தின் தலைப்பில் அதைப் பார்க்கலாம் <script> எனும் குறியொட்டுகளை பயன்படுத்தி HTML இல் நம்முடைய ஜாவாஸ்கிரிப்ட் குறிமுறைவரிகளை உட்பொதித்திடுக. இந்த எடுத்துக்காட்டில், குறிமுறைவரிகள் உட்பொதிக்கப்படுகின்றது:
<html>
<head>
<title>JS</title>
</head>
<body>
<p id=”example”>Nothing here.</p>
<script>
let myvariable = “Hello world!”;
document.getElementById(“example”).innerHTML = myvariable;
</script>
</body>
</html>
மீண்டும் இந்த பக்கத்தினை நம்முடையஇணையஉலாவியில் பதிவேற்றம் செய்திடுக.
2
இதில் <p> எனும் குறிச்சொல்லில் “Nothing here” என்ற சரம் உள்ளதை பார்க்க முடியும் , ஆனால் அது வழங்கப்படும்போது, ஜாவாஸ்கிரிப்ட் அதை மாற்றினால், அதற்கு பதிலாக “Hello world!” என உள்ளது. ஜாவாஸ்கிரிப்ட் ஒரு இணையப்பக்கத்தை மீண்டும் கட்டியெழுப்பும் (அல்லது உருவாக்க உதவும்) அதிகாரம்கொண்டுள்ளது. இந்த எளிய உரையில் உள்ள ஜாவாஸ்கிரிப்ட் இரண்டு செயல்களைச் செய்கிறது. முதலில், இது my variable எனப்படும் ஒரு மாறியை உருவாக்கி, அதனுள். இறுதியாக, IDஎனும் எடுத்துக்காட்டுடன் எந்த HTML உறுப்புக்கும் தற்போதைய ஆவணத்தை (உலாவி அதை இணையத்தளமாக வழங்குவதால்) தேடுகிறது. இது உதாரணத்தைக் கண்டுபிடிக்கும்போது, HTML உறுப்பின் உள்ளடக்கங்களை myvariable இன் உள்ளடக்கங்களுக்குப் பதிலாக HTML செயலியைப் பயன்படுத்துகிறது. நிச்சயமாக, தனிப்பயன் மாறியைப் பயன்படுத்துவது அவசியமில்லை. HTML உறுப்பு ஒன்று மாறும் வகையில் உருவாக்கப்படுவது மிகவும் எளிது. உதாரணமாக, அதை ஒரு நேர முத்திரையுடன் விரிவாக்கலாம்:
<html>
<head>
<title>JS</title>
</head>
<body>
<p id=”example”>Date and time appears here.</p>
<script>
document.getElementById(“example”).innerHTML = Date();
</script>
</body>
</html>
இணையபக்கம் வழங்கப்பட்ட நேரத்தில் உருவாக்கப்பட்ட நேர முத்திரையைப் பார்ப்பதற்காக அந்த பக்கத்தை மீண்டும் பதிவேற்றிடுக. சிலவினாடிகளில் அதனை காண மேலும் சில முறை மீண்டும் பதிவேற்றம் செய்திடுக.
ஜாவாஸ்கிரிப்ட் இலக்கணம் நிரலாக்கத்தில், இலக்கணம் என்பது சொற்கள் (அல்லது “சரங்கள்”) எழுதப்படுவதற்கான விதிகளை குறிக்கிறது. ஜாவாஸ் கிரிப்டில், ஒவ்வொரு குறிமுறைவரியும் அரைப்புள்ளியில் (;) முடிவடைய வேண்டும், இதனால் நம்முடைய குறிமுறைவரிகளை இயக்கும் ஜாவாஸ்கிரிப்ட் செயலியானது எப்போது நிறுத்த வேண்டும் என்பதைப் புரிந்து கொள்கின்றது. சொற்கள் (அல்லது “சரங்கள்”) மேற்கோள் குறிகளில் (“) இணைக்கப்பட வேண்டும், அதே நேரத்தில் எண்கள் (அல்லது” முழு எண்கள் “) . மாறிகள், வரிசைகள், நிபந்தனை அறிக்கைகள், பொருட்கள், செயலிகள் என்பன போன்ற ஜாவாஸ்கிரிப்ட் மொழியின் மற்ற அனைத்தையும் தெரிந்துகொள்க.
ஜாவாஸ்கிரிப்டில் மாறிகளை உருவாக்குதல் மாறிகள் தரவுகளுக்கான கொள்கலன்கள் ஆகும். நம்முடைய நிரலுடன் பகிர்ந்துகொள்கின்ற தரவுகளை வைக்கக்கூடிய ஒரு பெட்டியை ஒரு மாறி என்று வைத்துகொள்க. ஜாவாஸ் கிரிப்டில் ஒரு மாறியை உருவாக்குவது,நாம் எவ்வாறு மாறியை பயன்படுத்த விரும்புகின்றோம் என்பதை அடிப்படையாகக் கொண்ட let , var ஆகிய இரண்டு முக்கிய சொற்களைக் கொண்டு செய்யப்படுகிறது . Var என்பது ஒரு முக்கிய சொல் ஆகும் இது நம்முடைய முழு நிரலாக்கத்திலும் பயன்படுகின்ற ஒரு மாறியைக் குறிக்கிறது, அதேசமயம் குறிப்பிட்ட நோக்கங்களுக்காக மாறிகளை உருவாக்குகிறது, பொதுவாக செயலிகள் அல்லது சுழல்களுக்குள். ஜாவாஸ் கிரிப்டின் உள்ளமைக்கப்பட்ட தட்டச்சு செயல்பாட்டில் ஒரு மாறியானது என்ன வகையான தரவு உள்ளது என்பதை அடையாளம் காண உதவுகின்றது. முதல் உதாரணத்தைப் பயன்படுத்தி, காட்சிப்படுத்தப்பட்ட உரையை மாற்றியமைப்பதன் மூலம் என்ன வகையான தரவு myvariable கொண்டுள்ளது என்பதை கண்டுபிடிக்கலாம்:
<string>
let myvariable = “Hello world!”;
document.getElementById(“example”).innerHTML = typeof(myvariable);
</string>
இது நம்முடையஇணைய உலாவியில் “சரத்தை(string )” வழங்குகின்றது, ஏனெனில் மாறி “Hello world!” என்பது Myvariable இல் பல்வேறு வகையான தரவுகளை (ஒரு முழு எண் போன்றவை) சேமிப்பது நம்முடைய மாதிரி இணையப்பக்கத்தில் வேறு தரவுகளின் வகையில் அச்சிடப்படுகின்றது. நமக்கு விருப்பமான எண்ணிற்கு myvariable- ன் உள்ளடக்கங்களை மாற்றி, பக்கத்தை மீண்டும் பதிவேற்றம் செய்திடுக.
ஜாவாஸ்கிரிப்டில் செயலிகளை உருவாக்குதல் நிரலாக்கத்தின் செயலிகள் சுதந்திரமான உள்ளடக்க தரவு செயலிகள் ஆகும். அவை தான் நிரலாக்கத்தை மட்டுப்படுத்திடுகின்றது. நிரலாளர்கள் பயன்படுத்தி கொள்வதற்காகவென பொதுவான நூலகங்கள் செயலிகள் ஆகியவை இந்த கணினிமொழியில் ஏராளமானஅளவில் இருப்பதால், படங்களின் அளவை மாற்றியமத்தல் அல்லது மற்ற நிரலாளர்கள் தங்களுடைய சொந்த குறிமுறைவரிகளை பயன்படுத்த நேரம் கடந்து செல்வதை கண்காணித்தல் போன்ற பணிகளை எளிதாக செய்து பயன்பெறமுடியும். நம்முடைய செயலிக்கான தனிப்பயன் பெயரை வழங்குவதன் மூலம் நாம் ஒரு செயலியை உருவாக்கிடும்போது, அதைத் தொடர்ந்து வளைவுகுறியீட்டிற்குள் எந்த அளவு குறிமுறைவரிகள் இணைக்கப் பட்டுள்ளது. மறுஅளவிடப்பட்ட படம் , படத்தைப் பகுப்பாய்வு செய்து உண்மையான படத்தின் பரிமாணங்களை வழங்குகின்றது ஒரு பொத்தானை உள்ளடக்கிய எளிய இணையப்பக்கம்பின்வருமாறு. இந்த எடுத்துக்காட்டு குறிமுறைவரிகளில், <button> HTML உறுப்பு உள்ளமைக்கப்பட்ட ஜாவாஸ்கிரிப்ட் செயலியைப் பயன்படுத்திகொள்கிறது
<html>
<head>
<title>Imager</title>
</head>
<body>
<div>
<button onclick=”get_size(document.getElementById(‘myimg’))”>
Get image size
</button>
</div>
<div>
<img style=”width: 15%” id=”myimg” src=”penguin.png” />
</div>
<script>
function get_size(i) {
let w = i.naturalWidth;
let h = i.naturalHeight;
alert(w + ” by ” + h);
}
</script>
</body>
</html>
இந்த கோப்பைச் சேமித்து குறிமுறைவரிகளை முயற்சித்திடுக இணைய உலாவியில் இதனை பதிவேற்றிடுக.
3
ஜாவாஸ்கிரிப்டுடன் குறுக்கு-தள பயன்பாடுகள் ஒருங்கிணைந்த பயனாளர் அனுபவத்தை உருவாக்க ஜாவாஸ்கிரிப்ட் , HTML எவ்வாறு நெருக்கமாக செயல்படுகிறது என்பதை குறிமுறைவரிகளின் மாதிரியில் இருந்து காணலாம். இது ஜாவாஸ்கிரிப்டின் மிகப்பெரிய பலங்களில் ஒன்றாகும். ஜாவாஸ்கிரிப்டில் குறிமுறைவரிகளை எழுதும் போது, தளத்தினைப் பொருட்படுத்தாமல் நவீன கணினியின் பொதுவான பயனாளர் இடைமுகங்களில் ஒன்றைப் பெறுவோம்: இணைய உலாவியில். நம்முடைய குறிமுறைவரிகள் இயற்கையாகவே குறுக்கு தளமாக அமைகின்றது, எனவே நம்முடைய பயன்பாடானது ஒரு சிறிய பட அளவு பகுப்பாய்வி அல்லது சிக்கலான பட பதிப்பாளர், கானொளிகாட்சி விளையாட்டு அல்லது நாம் கனவு காணும் வேறு எதுவாக இருந்தாலும், இணைய உலாவி (அல்லது மேசைக்கணினி) உள்ள அனைவரும் பயன்படுத்தலாம்.இந்த ஜாவாஸ் கிரிப்ட்டை கற்பது மிகவும் எளிதானதும் வேடிக்கையானதுமான செயலாகும்.