ஜாவாஸ்கிரிப்ட் எம்.வி.சி கட்டிடக்கலை என்றால் என்ன, அது எவ்வாறு இயங்குகிறது?

இன் வளர்ச்சி செயல்பாட்டில் பொருள் சார்ந்த நிரலாக்க , மாடல்-வியூ-கன்ட்ரோலர் (எம்.வி.சி) என்பது ஒரு முறை அல்லது வடிவமைப்பு வடிவமாகும், இது பயனர் இடைமுகத்தை அடிப்படை தரவு மாதிரிகளுடன் திறமையாகவும் வெற்றிகரமாகவும் தொடர்புபடுத்த உதவுகிறது. இந்த கட்டுரையில், நாம் பற்றி அறிந்து கொள்வோம் பின்வரும் வரிசையில் எம்.வி.சி கட்டமைப்பு:

• ஜாவாஸ்கிரிப்ட் எம்.வி.சி கட்டிடக்கலை
• மாதிரிகள்
• காட்சிகள்
• கட்டுப்படுத்திகள்
• ஜாவாஸ்கிரிப்ட் எம்.வி.சி கட்டமைப்புகள்

ஜாவாஸ்கிரிப்ட் எம்.வி.சி கட்டிடக்கலை

சமீபத்திய காலங்களில், எம்.வி.சி முறை பல்வேறு வகையான நிரலாக்க மொழிகளில் பயன்படுத்தப்படுகிறது, இதில் அடங்கும் . ஜாவாஸ்கிரிப்ட் எம்.வி.சி கட்டிடக்கலை அல்லது அதன் மாறுபாடுகளை ஆதரிக்க பல கட்டமைப்புகளைக் கொண்டுள்ளது. டெவலப்பர்கள் தங்கள் பயன்பாடுகளுக்கு கட்டமைப்பை எளிதாகவும் அதிக முயற்சியும் இல்லாமல் சேர்க்க இது அனுமதிக்கிறது.

ஜாவா டெவலப்பர் சம்பளம் இந்தியாவில்

எம்.வி.சி மூன்று கூறுகளைக் கொண்டுள்ளது:

• மாதிரி
• காண்க
• கட்டுப்படுத்தி

இப்போது, ​​இந்த மூன்று ஜாவாஸ்கிரிப்ட் எம்.வி.சி கூறுகளின் ஆழத்திற்கு செல்லலாம்.

மாதிரிகள்

ஒரு பயன்பாட்டிற்கான தரவை நிர்வகிக்க மாதிரிகள் பயன்படுத்தப்படுகின்றன. பயனர் இடைமுகம் அல்லது விளக்கக்காட்சி அடுக்குகளில் அவர்கள் கவலைப்படவில்லை. அதற்கு பதிலாக, அவை ஒரு பயன்பாட்டிற்குத் தேவைப்படும் தனிப்பட்ட தரவுகளின் வடிவங்களைக் குறிக்கின்றன. ஒரு மாதிரி மாற்றப்படும்போது அல்லது புதுப்பிக்கப்படும்போது, ​​அது நிகழ்ந்த மாற்றத்தைப் பற்றி அதன் பார்வையாளர்களுக்கு பொதுவாகத் தெரிவிக்கும், இதனால் அவர்கள் அதற்கேற்ப செயல்பட முடியும்.

முதுகெலும்பைப் பயன்படுத்தி செயல்படுத்தப்பட்ட எளிமையான மாதிரியின் உதாரணத்தை எடுத்துக்கொள்வோம்:

var Photo = Backbone.Model.extend (default // புகைப்பட இயல்புநிலைகளுக்கான இயல்புநிலை பண்புக்கூறுகள்: {src: 'placeholder.jpg', தலைப்பு: 'ஒரு இயல்புநிலை படம்', பார்க்கப்பட்டது: தவறானது}, // உருவாக்கிய ஒவ்வொரு புகைப்படத்திற்கும் ஒரு உள்ளது என்பதை உறுதிப்படுத்தவும் `src`. துவக்கு: செயல்பாடு () {this.set ({'src': this.defaults.src})}})

ஒரு புகைப்பட கேலரியில், ஒரு புகைப்படத்தின் கருத்து அதன் சொந்த மாதிரிக்கு தகுதியானது, ஏனெனில் இது ஒரு தனித்துவமான டொமைன்-குறிப்பிட்ட தரவைக் குறிக்கிறது. அத்தகைய மாதிரியில் தலைப்பு, பட மூல மற்றும் கூடுதல் மெட்டாடேட்டா போன்ற தொடர்புடைய பண்புக்கூறுகள் இருக்கலாம். மேலே உள்ள எடுத்துக்காட்டில், ஒரு குறிப்பிட்ட புகைப்படம் ஒரு மாதிரியின் ஒரு நிகழ்வில் சேமிக்கப்படும்.

காட்சிகள்

காட்சிகள் அவற்றின் தற்போதைய நிலையின் வடிகட்டப்பட்ட காட்சியை வழங்கும் மாதிரிகளின் காட்சி பிரதிநிதித்துவம் ஆகும். ஜாவாஸ்கிரிப்ட் காட்சிகள் ஒரு DOM உறுப்பை உருவாக்க மற்றும் பராமரிக்க பயன்படுத்தப்படுகின்றன. ஒரு பார்வை பொதுவாக ஒரு மாதிரியைக் கவனிக்கிறது மற்றும் மாதிரி மாறும்போது அறிவிக்கப்படும், அதற்கேற்ப பார்வை தன்னைப் புதுப்பிக்க அனுமதிக்கிறது. உதாரணத்திற்கு:

var buildPhotoView = function (photoModel, photoController) {var base = document.createElement ('div'), photoEl = document.createElement ('div') base.appendChild (photoEl) var render = function () {// எங்கள் // புகைப்பட நுழைவுக்கான HTML ஐ உருவாக்கும் அண்டர்ஸ்கோர் // டெம்பிளேட்டிங் போன்ற டெம்ப்ளேட்டிங் நூலகம். addEventListener ('கிளிக்', செயல்பாடு () {photoController.handleEvent ('கிளிக்', ஃபோட்டோமாடல்)}) var show = function () {photoEl.style.display = ''} var hide = function () {photoEl.style.display = 'எதுவுமில்லை'} திரும்ப {showView: show, hideView: மறைக்க}}

இந்த கட்டமைப்பின் நன்மை என்னவென்றால், ஒவ்வொரு கூறுகளும் தேவைக்கேற்ப பயன்பாட்டுச் செயல்பாட்டை உருவாக்குவதில் அதன் தனித்தனி பங்கைக் கொண்டுள்ளன.

கட்டுப்படுத்திகள்

கட்டுப்படுத்திகள் மாதிரிகள் மற்றும் பார்வைகளுக்கு இடையில் இடைநிலைகளைப் போல செயல்படுகின்றன, அவை பயனர் பார்வையை கையாளும்போது மாதிரியைப் புதுப்பிக்க பொறுப்பாகும். எங்கள் புகைப்பட கேலரி பயன்பாட்டின் மேலேயுள்ள எடுத்துக்காட்டில், ஒரு குறிப்பிட்ட புகைப்படத்திற்கான திருத்தக் காட்சியில் பயனர் செய்த மாற்றங்களைக் கையாளுவதற்கு ஒரு கட்டுப்பாட்டாளர் பொறுப்பேற்க வேண்டும், ஒரு பயனர் திருத்துதல் முடிந்ததும் ஒரு குறிப்பிட்ட புகைப்பட மாதிரியைப் புதுப்பிப்பார்.

வரிசையாக்க வரிசை c ++

var PhotosController = Spine.Controller.sub ({init: function () {this.item.bind ('update', this.proxy (this.render)) this.item.bind ('அழிக்க', this.proxy (இது .remove))}, ரெண்டர்: செயல்பாடு () {// இந்த வார்ப்புருவை கையாளவும். ($ ('#photoTemplate') .tmpl (this.item)) இதை திருப்பி}, அகற்று: செயல்பாடு () {this.el.remove () this.release ()}})

இந்த எடுத்துக்காட்டு மாதிரி மற்றும் பார்வைக்கு இடையிலான மாற்றங்களை நிர்வகிக்க மிகவும் இலகுரக, எளிய வழியை உங்களுக்கு வழங்கும்.

ஜாவாஸ்கிரிப்ட் எம்.வி.சி கட்டமைப்புகள்

கடந்த சில ஆண்டுகளில், ஜாவாஸ்கிரிப்ட் எம்.வி.சியின் தொடர் உருவாக்கப்பட்டது. இந்த கட்டமைப்புகள் ஒவ்வொன்றும் டெவலப்பர்களை மேலும் கட்டமைக்கப்பட்ட ஜாவாஸ்கிரிப்ட் குறியீட்டை எழுத ஊக்குவிக்கும் நோக்கத்துடன் சில வகையான எம்.வி.சி வடிவத்தைப் பின்பற்றுகின்றன. சில கட்டமைப்புகள்:

• backbone.js
• Ember.js
• AngularJS
• செஞ்சா
• கெண்டோ யுஐ

இதன் மூலம், ஜாவாஸ்கிரிப்ட் எம்.வி.சி கட்டுரையின் முடிவுக்கு வந்துள்ளோம். எம்.வி.சி கட்டமைப்பில் ஈடுபட்டுள்ள மூன்று கூறுகளையும் நீங்கள் புரிந்து கொண்டீர்கள் என்று நம்புகிறேன்.

ஜாவாஸ்கிரிப்ட் எம்.வி.சி பற்றி இப்போது உங்களுக்குத் தெரியும், பாருங்கள் வழங்கியவர் எடுரேகா. HTML5, CSS3, Twitter பூட்ஸ்டார்ப் 3, jQuery மற்றும் Google API களைப் பயன்படுத்தி சுவாரஸ்யமான வலைத்தளங்களை எவ்வாறு உருவாக்குவது என்பதை அறிய வலை மேம்பாட்டு சான்றிதழ் பயிற்சி உங்களுக்கு உதவும்.

எங்களுக்கு ஒரு கேள்வி கிடைத்ததா? 'ஜாவாஸ்கிரிப்ட் எம்.வி.சி' இன் கருத்துகள் பிரிவில் இதைக் குறிப்பிடவும், நாங்கள் உங்களைத் தொடர்புகொள்வோம்.