javascript - जावास्क्रिप्ट में स्थिर चर




variables static (20)

अद्यतन उत्तर:

ईसीएमएस्क्रिप्ट 6 में , आप static कीवर्ड का उपयोग करके स्थिर कार्य बना सकते हैं:

class Foo {

  static bar() {return 'I am static.'}

}

//`bar` is a property of the class
Foo.bar() // returns 'I am static.'

//`bar` is not a property of instances of the class
var foo = new Foo()
foo.bar() //-> throws TypeError

ES6 कक्षाएं सांख्यिकी के लिए कोई भी नया अर्थशास्त्र पेश नहीं करती हैं। आप ईएस 5 में इसी तरह की चीज कर सकते हैं:

//constructor
var Foo = function() {}

Foo.bar = function() {
    return 'I am static.'
}

Foo.bar() // returns 'I am static.'

var foo = new Foo()
foo.bar() // throws TypeError

आप Foo संपत्ति को असाइन कर सकते हैं क्योंकि जावास्क्रिप्ट फ़ंक्शंस में ऑब्जेक्ट्स हैं।

मैं जावास्क्रिप्ट में स्थिर चर कैसे बना सकता हूं?


अन्य समान उत्तर भी हैं, लेकिन उनमें से कोई भी मुझसे काफी अपील नहीं करता है। यहां मैंने जो समाप्त किया है:

var nextCounter = (function () {
  var counter = 0;
  return function() {
    var temp = counter;
    counter += 1;
    return temp;
  };
})();

आप इस तथ्य का लाभ उठा सकते हैं कि जेएस फ़ंक्शन भी ऑब्जेक्ट्स हैं - जिसका अर्थ है कि उनके पास गुण हो सकते हैं।

उदाहरण के लिए, जावास्क्रिप्ट में स्टेटिक चर (अब गायब) लेख पर दिए गए उदाहरण को उद्धृत करते हुए:

function countMyself() {
    // Check to see if the counter has been initialized
    if ( typeof countMyself.counter == 'undefined' ) {
        // It has not... perform the initialization
        countMyself.counter = 0;
    }

    // Do something stupid to indicate the value
    alert(++countMyself.counter);
}

यदि आप उस फ़ंक्शन को कई बार कॉल करते हैं, तो आप देखेंगे कि काउंटर बढ़ रहा है।

और वैश्विक वैरिएबल के साथ वैश्विक नामस्थान को पॉलिश करने से शायद यह एक बेहतर समाधान है।


और यहां एक और संभावित समाधान है, बंद होने के आधार पर: जावास्क्रिप्ट में स्थिर चर का उपयोग करने के लिए चाल :

var uniqueID = (function() {
   var id = 0; // This is the private persistent value
   // The outer function returns a nested function that has access
   // to the persistent value.  It is this nested function we're storing
   // in the variable uniqueID above.
   return function() { return id++; };  // Return and increment
})(); // Invoke the outer function after defining it.

जो आपको एक ही प्रकार का परिणाम प्राप्त करता है - सिवाय इसके कि, इस बार, बढ़ी हुई मान वापस प्रदर्शित होने के बजाय वापस आती है।


आप इसे आईआईएफई के माध्यम से करते हैं (तुरंत फ़ंक्शन अभिव्यक्ति का आह्वान किया जाता है):

var incr = (function () {
    var i = 1;

    return function () {
        return i++;
    }
})();

incr(); // returns 1
incr(); // returns 2

ईसीएमएस्क्रिप्ट 2015 द्वारा पेश की गई class बारे में। अन्य उत्तरों पूरी तरह स्पष्ट नहीं हैं।

यहां एक उदाहरण दिया गया है कि staticVar साथ एक स्थिर var staticVar कैसे बनाया staticVarvar synthax:

class MyClass {
    constructor(val) {
        this.instanceVar = val;
        MyClass.staticVar = 10;
    }
}

var class1 = new MyClass(1);
console.log(class1.instanceVar);      // 1
console.log(class1.constructor.staticVar); // 10

// New instance of MyClass with another value
var class2 = new MyClass(3);
console.log(class1.instanceVar);      // 1
console.log(class2.instanceVar);      // 3

स्थिर चर का उपयोग करने के लिए हम .constructor प्रॉपर्टी का उपयोग करते हैं जो क्लास बनाने वाले ऑब्जेक्ट कन्स्ट्रक्टर फ़ंक्शन का संदर्भ देता है। हम इसे दो निर्मित उदाहरणों पर कॉल कर सकते हैं:

MyClass.staticVar = 11;
console.log(class1.constructor.staticVar); // 11
console.log(class2.constructor.staticVar); // 11 <-- yes it's static! :)

MyClass.staticVar = 12;
console.log(class1.constructor.staticVar); // 12
console.log(class2.constructor.staticVar); // 12

एक और दृष्टिकोण है, जिसने इस धागे को ब्राउज़ करने के बाद मेरी आवश्यकताओं को हल किया। यह बिल्कुल वैसा ही निर्भर करता है कि आप "स्थैतिक चर" के साथ क्या हासिल करना चाहते हैं।

वैश्विक प्रॉपर्टी सत्र स्टोरेज या लोकल स्टोरेज डेटा को सत्र के जीवन के लिए संग्रहीत करने की अनुमति देता है, या अनिश्चित काल तक क्रमशः स्पष्ट रूप से साफ़ होने तक। यह आपके पृष्ठ / ऐप के सभी विंडोज़, फ्रेम, टैब पैनल, पॉपअप इत्यादि के बीच डेटा साझा करने की अनुमति देता है और एक कोड सेगमेंट में एक साधारण "स्थैतिक / वैश्विक चर" से कहीं अधिक शक्तिशाली है।

यह शीर्ष-स्तरीय वैश्विक चर, यानी Window.myglobal के दायरे, जीवनकाल, अर्थशास्त्र, गतिशीलता आदि के साथ सभी परेशानी से बचाता है। यह नहीं पता कि यह कितना कुशल है, लेकिन मामूली दरों पर पहुंचने के लिए डेटा की मामूली मात्रा के लिए यह महत्वपूर्ण नहीं है।

आसानी से "sessionStorage.mydata = कुछ भी" के रूप में उपयोग किया जाता है और इसी तरह से पुनर्प्राप्त किया जाता है। "जावास्क्रिप्ट: द डिफिनिटिव गाइड, छठी संस्करण", डेविड फ़्लानागन, आईएसबीएन: 978-0-596-80552-4, अध्याय 20, धारा 20.1 देखें। यह सरल खोज द्वारा पीडीएफ के रूप में आसानी से डाउनलोड किया जा सकता है, या आपके O'Reilly Safaribooks सदस्यता (सोने में इसके वजन के लायक) में।

चीयर्स, ग्रेग ई


जावास्क्रिप्ट चर में डिफ़ॉल्ट रूप से स्थिर हैं। उदाहरण :

var x = 0;

function draw() {
    alert(x); //
    x+=1;
}

setInterval(draw, 1000);

X का मान प्रत्येक 1000 मिलीसेकंड द्वारा 1 बढ़ाया जाता है
यह 1,2,3 आगे प्रिंट करेगा


जावास्क्रिप्ट में, कोई शब्द या कीवर्ड स्थिर नहीं है, लेकिन हम इस तरह के डेटा को सीधे फ़ंक्शन ऑब्जेक्ट (जैसे किसी अन्य ऑब्जेक्ट में) में डाल सकते हैं।

function f() {
    f.count = ++f.count || 1 // f.count is undefined at first
    alert("Call No " + f.count)
}

f(); // Call No 1

f(); // Call No 2

फंक्शन / कक्षाएं अपने ऑब्जेक्ट स्कोप के लिए केवल एक कन्स्ट्रक्टर की अनुमति देती हैं। Function Hoisting, declarations & expressions

  • फ़ंक्शन कन्स्ट्रक्टर के साथ बनाए गए फ़ंक्शंस उनके निर्माण संदर्भों को बंद नहीं करते हैं; वे हमेशा वैश्विक दायरे में बनाए जाते हैं।

      var functionClass = function ( ) {
            var currentClass = Shape;
            _inherits(currentClass, superClass);
            function functionClass() { superClass.call(this); // Linking with SuperClass Constructor.
                // Instance Variables list.
                this.id = id;   return this;
            }
        }(SuperClass)
    

Closures - क्लोजर की प्रतियां संरक्षित डेटा के साथ काम करती हैं।

  • प्रत्येक बंद की प्रतियां किसी फ़ंक्शन में अपने स्वयं के मुक्त मूल्यों या संदर्भों के साथ बनाई जाती हैं, जब भी आप किसी अन्य फ़ंक्शन के अंदर फ़ंक्शन का उपयोग करते हैं, तो एक बंद करने का उपयोग किया जाता है।
  • जावास्क्रिप्ट में एक बंद करना आंतरिक कार्यों द्वारा अपने मूल कार्य के सभी स्थानीय चर की एक प्रति बनाए रखना है।

      function closureFun( args ) {
            // Local variable that ends up within closure
            var num = args;
            num++;
            return function() { console.log(num); }
        }
        var closure1 = closureFun( 5 );
        var closure2 = closureFun( 777 );
        closure1(); // 5
        closure2(); // 777
        closure2(); // 778
        closure1(); // 6
    

ईएस 5 फंक्शन क्लासेस : ऑब्जेक्ट.डेफिनप्रॉपर्टी (ओ, पी, एट्रिब्यूट्स) का उपयोग करता है

Object.defineProperty() विधि किसी ऑब्जेक्ट पर सीधे एक नई प्रॉपर्टी को परिभाषित करती है, या किसी ऑब्जेक्ट पर मौजूदा प्रॉपर्टी को संशोधित करती है, और ऑब्जेक्ट देता है।

`` का उपयोग कर कुछ तरीकों का निर्माण किया, ताकि प्रत्येक बार फ़ंक्शन कक्षाओं को आसानी से समझ सके।

'use strict';
var Shape = function ( superClass ) {
    var currentClass = Shape;
    _inherits(currentClass, superClass); // Prototype Chain - Extends

    function Shape(id) { superClass.call(this); // Linking with SuperClass Constructor.
        // Instance Variables list.
        this.id = id;   return this;
    }
    var staticVariablesJOSN = { "parent_S_V" : 777 };
    staticVariable( currentClass, staticVariablesJOSN );

    // Setters, Getters, instanceMethods. [{}, {}];
    var instanceFunctions = [
        {
            key: 'uniqueID',
            get: function get() { return this.id; },
            set: function set(changeVal) { this.id = changeVal; }
        }
    ];
    instanceMethods( currentClass, instanceFunctions );

    return currentClass;
}(Object);

var Rectangle = function ( superClass ) {
    var currentClass = Rectangle;

    _inherits(currentClass, superClass); // Prototype Chain - Extends

    function Rectangle(id, width, height) { superClass.call(this, id); // Linking with SuperClass Constructor.

        this.width = width;
        this.height = height;   return this;
    }

    var staticVariablesJOSN = { "_staticVar" : 77777 };
    staticVariable( currentClass, staticVariablesJOSN );

    var staticFunctions = [
        {
            key: 'println',
            value: function println() { console.log('Static Method'); }
        }
    ];
    staticMethods(currentClass, staticFunctions);

    var instanceFunctions = [
        {
            key: 'setStaticVar',
            value: function setStaticVar(staticVal) {
                currentClass.parent_S_V = staticVal;
                console.log('SET Instance Method Parent Class Static Value : ', currentClass.parent_S_V);
            }
        }, {
            key: 'getStaticVar',
            value: function getStaticVar() {
                console.log('GET Instance Method Parent Class Static Value : ', currentClass.parent_S_V);
                return currentClass.parent_S_V;
            }
        }, {
            key: 'area',
            get: function get() {
                console.log('Area : ', this.width * this.height);
                return this.width * this.height;
                }
        }, {
            key: 'globalValue',
            get: function get() {
                console.log('GET ID : ', currentClass._staticVar);
                return currentClass._staticVar;
            },
            set: function set(value) {
                currentClass._staticVar = value;
                console.log('SET ID : ', currentClass._staticVar);
            }
        }
    ];
    instanceMethods( currentClass, instanceFunctions );

    return currentClass;
}(Shape);

// ===== ES5 Class Conversion Supported Functions =====
function defineProperties(target, props) {
    console.log(target, ' : ', props);
    for (var i = 0; i < props.length; i++) {
        var descriptor = props[i];
        descriptor.enumerable = descriptor.enumerable || false;
        descriptor.configurable = true;
        if ("value" in descriptor) descriptor.writable = true;
        Object.defineProperty(target, descriptor.key, descriptor);
    }
}
function staticMethods( currentClass, staticProps ) {
    defineProperties(currentClass, staticProps);
};
function instanceMethods( currentClass, protoProps ) {
    defineProperties(currentClass.prototype, protoProps);
};
function staticVariable( currentClass, staticVariales ) {
    // Get Key Set and get its corresponding value.
    // currentClass.key = value;
    for( var prop in staticVariales ) {
        console.log('Keys : Values');
        if( staticVariales.hasOwnProperty( prop ) ) {
            console.log(prop, ' : ', staticVariales[ prop ] );
            currentClass[ prop ] = staticVariales[ prop ];
        }
    }
};
function _inherits(subClass, superClass) {
    console.log( subClass, ' : extends : ', superClass );
    if (typeof superClass !== "function" && superClass !== null) {
        throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
    }
    subClass.prototype = Object.create(superClass && superClass.prototype, 
            { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });
    if (superClass)
        Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
}

कोड स्निपेट के नीचे परीक्षण करना है कि प्रत्येक उदाहरण में इंस्टेंस सदस्यों और सामान्य स्थिर सदस्यों की अपनी प्रति है।

var objTest = new Rectangle('Yash_777', 8, 7);
console.dir(objTest);

var obj1 = new Rectangle('R_1', 50, 20);
Rectangle.println(); // Static Method
console.log( obj1 );    // Rectangle {id: "R_1", width: 50, height: 20}
obj1.area;              // Area :  1000
obj1.globalValue;       // GET ID :  77777
obj1.globalValue = 88;  // SET ID :  88
obj1.globalValue;       // GET ID :  88  

var obj2 = new Rectangle('R_2', 5, 70);
console.log( obj2 );    // Rectangle {id: "R_2", width: 5, height: 70}
obj2.area;              // Area :  350    
obj2.globalValue;       // GET ID :  88
obj2.globalValue = 999; // SET ID :  999
obj2.globalValue;       // GET ID :  999

console.log('Static Variable Actions.');
obj1.globalValue;        // GET ID :  999

console.log('Parent Class Static variables');
obj1.getStaticVar();    // GET Instance Method Parent Class Static Value :  777
obj1.setStaticVar(7);   // SET Instance Method Parent Class Static Value :  7
obj1.getStaticVar();    // GET Instance Method Parent Class Static Value :  7

Static method calls are made directly on the class and are not callable on instances of the class. But you can achieve the calls for static members from inside an instance.

Using syntax:

   this.constructor.staticfunctionName();
class MyClass {
    constructor() {}
    static staticMethod() {
        console.log('Static Method');
    }
}
MyClass.staticVar = 777;

var myInstance = new MyClass();
// calling from instance
myInstance.constructor.staticMethod();
console.log('From Inside Class : ',myInstance.constructor.staticVar);

// calling from class
MyClass.staticMethod();
console.log('Class : ', MyClass.staticVar);

ES6 Classes: ES2015 classes are a simple sugar over the prototype-based OO pattern. Having a single convenient declarative form makes class patterns easier to use, and encourages interoperability. Classes support prototype-based inheritance, super calls, instance and static methods and constructors.

Example : refer my previous post.


मैंने कुछ समान उत्तरों को देखा है, लेकिन मैं यह उल्लेख करना चाहता हूं कि यह पोस्ट इसका सबसे अच्छा वर्णन करता है, इसलिए मैं इसे आपके साथ साझा करना चाहता हूं।

यहां से कुछ कोड लिया गया है, जिसे मैंने एक पूर्ण उदाहरण प्राप्त करने के लिए संशोधित किया है जो आशा करता है कि समुदाय को लाभ मिलेगा क्योंकि इसे कक्षाओं के लिए डिज़ाइन टेम्पलेट के रूप में उपयोग किया जा सकता है।

यह आपके प्रश्न का भी उत्तर देता है:

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
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

ध्यान दें कि podcast.immutableProp () में, हमारे पास एक closure : _somePrivateVariable का संदर्भ फ़ंक्शन के अंदर रखा जाता है।

आप गेटर्स और सेटर्स को भी परिभाषित कर सकते हैं। इस कोड स्निपेट पर एक नज़र डालें (जहां 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 को फ़ंक्शन get और set माध्यम से परिभाषित करता है - यदि आप set निर्दिष्ट नहीं करते set , तो संपत्ति केवल पढ़ने के लिए होती है और संशोधित नहीं की जा सकती है (सावधान d.year यदि आप इसे सेट करने का प्रयास करते हैं तो आपको कोई त्रुटि नहीं मिलेगी, लेकिन यह इसका कोई प्रभाव नहीं है)। प्रत्येक प्रॉपर्टी में गुण writable , configurable writable (घोषणा के बाद बदलने की अनुमति देते हैं) और enumerable करने enumerable (इसे enumerable रूप में उपयोग करने की अनुमति दें), जो प्रति डिफ़ॉल्ट false । आप उन्हें तीसरे पैरामीटर में defineProperty माध्यम से सेट कर सकते हैं, उदाहरण के लिए enumerable: true

यह वाक्यविन्यास भी मान्य है:

// getters and setters - alternative syntax
var obj = { a: 7, 
            get b() {return this.a + 1;}, 
            set c(x) {this.a = x / 2}
        };

जो एक पठनीय / लिखने योग्य संपत्ति को परिभाषित करता है, एक पठनीय संपत्ति 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"

ध्यान दें, कि कुछ परिस्थितियों में यह कन्स्ट्रक्टर फ़ंक्शन Podcast में return स्टेटमेंट का उपयोग करने के लिए उपयोगी हो सकता है ताकि एक कस्टम ऑब्जेक्ट को सुरक्षित करने वाले कार्यों को वापस करने के लिए क्लास आंतरिक रूप से निर्भर करता है लेकिन जिसे प्रकट किया जाना चाहिए। यह लेख श्रृंखला के अध्याय 2 (ऑब्जेक्ट्स) में आगे समझाया गया है।

आप कह सकते हैं कि 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]"

आप here प्रोटोटाइप के बारे में अधिक जानकारी प्राप्त कर सकते हैं। यदि आप अधिक विरासत करना चाहते हैं, तो मैं इसे देखने का सुझाव देता हूं।

ऊपर वर्णित आलेख श्रृंखला को पढ़ने की अत्यधिक अनुशंसा की जाती है, इसमें निम्नलिखित विषय भी शामिल हैं:

  1. कार्य
  2. वस्तुओं
  3. प्रोटोटाइप
  4. कन्स्ट्रक्टर फ़ंक्शंस पर नया लागू करना
  5. उत्थापन
  6. स्वचालित अर्धविराम सम्मिलन
  7. स्टेटिक गुण और तरीके

ध्यान दें कि जावास्क्रिप्ट का स्वचालित अर्धविराम सम्मिलन "सुविधा" (जैसा कि 6 में उल्लिखित है) अक्सर आपके कोड में अजीब मुद्दों के कारण जिम्मेदार होता है। इसलिए, मैं इसे एक सुविधा के मुकाबले एक बग के रूप में मानूंगा।

यदि आप और अधिक पढ़ना चाहते हैं, तो here इन विषयों के बारे में एक दिलचस्प दिलचस्प एमएसडीएन आलेख है , उनमें से कुछ ने वर्णन किया है कि वहां और भी विवरण उपलब्ध हैं।

पढ़ने के लिए दिलचस्प क्या है (ऊपर वर्णित विषयों को भी कवर करना) एमडीएन जावास्क्रिप्ट गाइड से वे लेख हैं:

यदि आप जानना चाहते हैं कि सी # out पैरामीटर का अनुकरण कैसे करें (जैसे DateTime.TryParse(str, out result)DateTime.TryParse(str, out result) ) जावास्क्रिप्ट में, आप यहां नमूना कोड पा सकते हैं

आप में से जो IE के साथ काम कर रहे हैं (जिसमें जावास्क्रिप्ट के लिए कोई कंसोल नहीं है जब तक कि आप F12 का उपयोग करके डेवलपर टूल खोलें और कंसोल टैब खोलें) निम्न स्निपेट उपयोगी हो सकता है। यह आपको console.log(msg); का उपयोग करने की अनुमति देता है 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>

टिप्पणियाँ:

  • सामान्य रूप से जावास्क्रिप्ट प्रोग्रामिंग के बारे में कुछ अच्छी टिप्स, संकेत और सिफारिशें आप यहां (जावास्क्रिप्ट सर्वोत्तम प्रथाओं) और वहां ('var' बनाम 'चलो') पा सकते हैंअंतर्निहित टाइपकास्ट (जबरदस्ती) के बारे में भी यह आलेख अनुशंसित है।

  • कक्षाओं का उपयोग करने और उन्हें जावास्क्रिप्ट में संकलित करने का एक सुविधाजनक तरीका टाइपस्क्रिप्ट है। यहां एक खेल का मैदान है जहां आप कुछ उदाहरण पा सकते हैं जो आपको दिखाते हैं कि यह कैसे काम करता है। यहां तक ​​कि यदि आप इस समय टाइपस्क्रिप्ट का उपयोग नहीं कर रहे हैं, तो आप एक नज़र देख सकते हैं क्योंकि आप टाइपस्क्रिप्ट की तुलना जावास्क्रिप्ट परिणाम के साथ-साथ साइड-बाय-साइड व्यू पर कर सकते हैं। अधिकांश उदाहरण सरल हैं, लेकिन एक रेट्रैसर उदाहरण भी है जिसे आप तुरंत कोशिश कर सकते हैं। मैं सलाह देता हूं कि विशेष रूप से "कक्षाओं का उपयोग करना", "विरासत का उपयोग करना" और "जेनेरिक का उपयोग करना" उदाहरण को combobox में चुनकर - ये अच्छे टेम्पलेट्स हैं जिन्हें आप तुरंत जावास्क्रिप्ट में उपयोग कर सकते हैं।


यदि आप कक्षा-आधारित, स्थैतिक रूप से टाइप की गई ऑब्जेक्ट उन्मुख भाषा (जैसे जावा, सी ++ या सी #) से आते हैं, तो मुझे लगता है कि आप एक "प्रकार" से जुड़े एक चर या विधि बनाने की कोशिश कर रहे हैं लेकिन किसी उदाहरण के लिए नहीं।

रचनात्मक कार्यों के साथ "शास्त्रीय" दृष्टिकोण का उपयोग करने वाला एक उदाहरण शायद आपको मूल ओओ जावास्क्रिप्ट की अवधारणाओं को पकड़ने में मदद कर सकता है:

function MyClass () { // constructor function
  var privateVariable = "foo";  // Private variable 

  this.publicVariable = "bar";  // Public variable 

  this.privilegedMethod = function () {  // Public Method
    alert(privateVariable);
  };
}

// Instance method will be available to all instances but only load once in memory 
MyClass.prototype.publicMethod = function () {    
  alert(this.publicVariable);
};

// Static variable shared by all instances
MyClass.staticProperty = "baz";

var myInstance = new MyClass();

staticProperty को MyClass ऑब्जेक्ट (जो एक फ़ंक्शन है) में परिभाषित किया गया है और इसके बनाए गए उदाहरणों के साथ कुछ भी नहीं है, जावास्क्रिप्ट व्यवहार प्रथम श्रेणी की वस्तुओं के रूप में कार्य करता है, इसलिए एक ऑब्जेक्ट होने पर, आप फ़ंक्शन को गुण असाइन कर सकते हैं।


यदि आप नए वर्ग वाक्यविन्यास का उपयोग कर रहे हैं तो आप अब निम्न कार्य कर सकते हैं:

    class MyClass {
      static get myStaticVariable() {
        return "some static variable";
      }
    }

    console.log(MyClass.myStaticVariable);

    aMyClass = new MyClass();
    console.log(aMyClass.myStaticVariable, "is undefined");

यह प्रभावी ढंग से जावास्क्रिप्ट में स्थिर चर बनाता है।


यहां सभी वर्ग अवधारणाओं को गठबंधन करने के लिए, इसका परीक्षण करें:

var Test = function() {
  // "super private" variable, accessible only here in constructor. There are no real private variables
  //if as 'private' we intend variables accessible only by the class that defines the member and NOT by child classes
  var test_var = "super private";

  //the only way to access the "super private" test_var is from here
  this.privileged = function(){
    console.log(test_var);
  }();

  Test.test_var = 'protected';//protected variable: accessible only form inherited methods (prototype) AND child/inherited classes

  this.init();
};//end constructor

Test.test_var = "static";//static variable: accessible everywhere (I mean, even out of prototype, see domready below)

Test.prototype = {

 init:function(){
   console.log('in',Test.test_var);
 }

};//end prototype/class


//for example:
$(document).ready(function() {

 console.log('out',Test.test_var);

 var Jake = function(){}

 Jake.prototype = new Test();

 Jake.prototype.test = function(){
   console.log('jake', Test.test_var);
 }

 var jake = new Jake();

 jake.test();//output: "protected"

});//end domready

खैर, इन चीजों में सर्वोत्तम प्रथाओं को देखने का एक और तरीका यह है कि कॉफ़ीस्क्रिप्ट इन अवधारणाओं का अनुवाद कैसे करता है।

#this is coffeescript
class Test
 #static
 @prop = "static"

 #instance
 constructor:(prop) ->
   @prop = prop
   console.log(@prop)

 t = new Test('inst_prop');

 console.log(Test.prop);


//this is how the above is translated in plain js by the CS compiler
  Test = (function() {
    Test.prop = "static";

    function Test(prop) {
     this.prop = prop;
     console.log(this.prop);
    }

    return Test;

  })();

  t = new Test('inst_prop');

  console.log(Test.prop);

For private static variables, I found this way:

function Class()
{
}

Class.prototype = new function()
{
    _privateStatic = 1;
    this.get = function() { return _privateStatic; }
    this.inc = function() { _privateStatic++; }
};

var o1 = new Class();
var o2 = new Class();

o1.inc();

console.log(o1.get());
console.log(o2.get()); // 2

If you want to use prototype then there is a way

var p = function Person() {
    this.x = 10;
    this.y = 20;
}
p.prototype.counter = 0;
var person1 = new p();
person1.prototype = p.prototype;
console.log(person1.counter);
person1.prototype.counter++;
var person2 = new p();
person2.prototype = p.prototype;
console.log(person2.counter);
console.log(person1.counter);

Doing this you will be able to access the counter variable from any instance and any change in the property will be immediately reflected!!


In addition to the rest, there's currently a draft ( stage-2 proposal ) on ECMA Proposals that introduces static public fields in classes. ( private fields were considered )

Using the example from the proposal, the proposed static syntax will look like this:

class CustomDate {
  // ...
  static epoch = new CustomDate(0);
}

and be equivalent to the following which others have highlighted:

class CustomDate {
  // ...
}
CustomDate.epoch = new CustomDate(0);

You can then access it via CustomDate.epoch .

You can keep track of the new proposal in proposal-static-class-features .

Currently, babel supports this feature with the transform class properties plugin which you can use. Additionally, though still in progress, V8 is implementing it .


There are 4 ways to emulate function-local static variables in Javascript.

Method 1: Using function object properties (supported in old browsers)

function someFunc1(){
    if( !('staticVar' in someFunc1) )
        someFunc1.staticVar = 0 ;
    alert(++someFunc1.staticVar) ;
}

someFunc1() ; //prints 1
someFunc1() ; //prints 2
someFunc1() ; //prints 3

Method 2: Using a closure, variant 1 (supported in old browsers)

var someFunc2 = (function(){
    var staticVar = 0 ;
    return function(){
        alert(++staticVar) ;
    }
})()

someFunc2() ; //prints 1
someFunc2() ; //prints 2
someFunc2() ; //prints 3

Method 3: Using a closure, variant 2 (also supported in old browsers)

var someFunc3 ;
with({staticVar:0})
    var someFunc3 = function(){
        alert(++staticVar) ;
    }

someFunc3() ; //prints 1
someFunc3() ; //prints 2
someFunc3() ; //prints 3

Method 4: Using a closure, variant 3 (requires support for EcmaScript 2015)

{
    let staticVar = 0 ;
    function someFunc4(){
        alert(++staticVar) ;
    }
}

someFunc4() ; //prints 1
someFunc4() ; //prints 2
someFunc4() ; //prints 3

There is no such thing as an static variable in Javascript. This language is prototype-based object orientated, so there are no classes, but prototypes from where objects "copy" themselves.

You may simulate them with global variables or with prototyping (adding a property to the prototype):

function circle(){
}
circle.prototype.pi=3.14159

Working with MVC websites that use jQuery, I like to make sure AJAX actions within certain event handlers can only be executed once the previous request has completed. I use a "static" jqXHR object variable to achieve this.

Given the following button:

<button type="button" onclick="ajaxAction(this, { url: '/SomeController/SomeAction' })">Action!</button>

I generally use an IIFE like this for my click handler:

var ajaxAction = (function (jqXHR) {
    return function (sender, args) {
        if (!jqXHR || jqXHR.readyState == 0 || jqXHR.readyState == 4) {
            jqXHR = $.ajax({
                url: args.url,
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify($(sender).closest('form').serialize()),
                success: function (data) {
                    // Do something here with the data.
                }
            });
        }
    };
})(null);

इसको आजमाओ:

यदि हम किसी संपत्ति को परिभाषित करते हैं और फ़ंक्शन ऑब्जेक्ट प्रॉपर्टी का उपयोग करने के लिए अपने गेटर्स और सेटर्स को ओवरराइड करते हैं तो सिद्धांत में आपके पास जावास्क्रिप्ट में एक स्थिर चर हो सकता है

उदाहरण के लिए:

function Animal() {
    if (isNaN(this.totalAnimalCount)) {
        this.totalAnimalCount = 0;
    }
    this.totalAnimalCount++;
};
Object.defineProperty(Animal.prototype, 'totalAnimalCount', {
    get: function() {
        return Animal['totalAnimalCount'];
    },
   set: function(val) {
       Animal['totalAnimalCount'] = val;
   }
});
var cat = new Animal(); 
console.log(cat.totalAnimalCount); //Will produce 1
var dog = new Animal();
console.log(cat.totalAnimalCount); //Will produce 2 and so on.






closures