What is this?

(function (Skd, $, undefined) {
    title = "SkdInternal"; // internal?
    #title = "SkdPrivate"; // private?
    Skd.title = "Skd"; // public?

    Skd.method = function()... // public?
    #method = function()... // private?
    method = function()... // internal?
}(Skd = Skd || {}, jQuery));

I'm making an generic lib and this is doing most of the job, but I'm really confused and trail/error is the method I've used so far - now I need clarity 😊

  • what is this kind of definition called?

  • what is the role of "Skd" (in this case)

  • what is the definition function(...)

  • what is private/public/internal?

  • how to define an (optional) constructor?

  • is there an e-book/whitepaper/? where I can learn about this?

I've tried to "Google" it, but really don't know what to call this kind of definition.

3 Replies 3

You can't use private names there, so that's currently a syntax error. All title is global because it's being created without var, const, or let.

You have posted what looks like it's supposed to be a common “module pattern” implemented with an Immediately Invoked Function Expression (IIFE).

(function (Skd, $, undefined) {
  // module body
}(Skd = Skd || {}, jQuery));

It defines function () { } and calls it immediately (Skd = Skd || {}, jQuery)

This pattern is normally used to create a private scope for the library and attach public members to a namespace (Skd) object.

The syntax Skd = Skd || {} will create a new object if there is not already a global object with the same name.

A few notes

Skd.title = "Skd";       // public
Skd.method = function() {
  // public method
};

var title = "SkdInternal";   // private, not visible outside
var method = function() {    // private helper
  // ...
};

But your

title = "SkdInternal";
method = function() { ... };

are not “internal”. Without var/let/const this creates or overwrites global variables in sloppy mode, which you do not want.

Your #title and #method are using Class syntax and will throw errors in an IIFE

(function (Skd, $, undefined) {

function Widget(options) { // constructor code this.options = options || {}; }

// optional: allow calling without new Skd.Widget = function (options) { if (!(this instanceof Skd.Widget)) { return new Skd.Widget(options); } Widget.call(this, options); };

Skd.Widget.prototype = Object.create(Widget.prototype); Skd.Widget.prototype.constructor = Skd.Widget;

}(Skd = Skd || {}, jQuery));

Then users can do either:

var w1 = new Skd.Widget({ ... });

or

var w2 = Skd.Widget({ ... }); // also works because of the guard

If the class members defined with # had been inside a class, then they would become real private fields

For example:

class Skd {
  #title = 'SkdPrivate'     // private field
  title = 'SkdInternal'     // public field

  constructor() {
    this.title = 'Skd'      // public
    this.#title = 'secret'  // private, only visible here
  }

  #method() {               // private method
    console.log('private')
  }

  method() {                // public method
    this.#method()          // allowed
  }
}

const x = new Skd()
x.title            // OK
x.#title           // SyntaxError: private field not accessible
x.#method()        // SyntaxError

This should get you on the right track and at least give you the search terms you need.

You can directly declare your classes using the standard syntax of object-oriented languages. This has been available since 2015 (ECMAScript 2015).

👉 Javascript Class Syntax Reference

Your Reply

By clicking “Post Your Reply”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.