How to add Object.prototype.x? set to enumerable:false

Question

$('example')

console logs foo {word: "example", letter: function}

                                  ^

The log showed me letter is a prototype function of foo

var foo,$;

(function() {

    foo = $ = function(word) {
        return new foo(word);
    };

    var foo = function(word) {
        //#A
        this.word=word;
        console.log(this.word);
        return this;
    };


    foo.fn = foo.prototype = {

        letter: function(n) {
            console.log(this.word[n]);
            return this;
        }
    };

}());

I can't seem to look at $.fn or foo.fn

console.log($.fn);     //fn is undefined
console.log(foo.fn);   //foo is undefined

console.log($.prototype); //shows me constructor and __proto__

Why? What if I want add more prototype functions later in the code? Why does it work like a charm with Array.prototype.something=function... but, not this code?

I am wondering how this would be done as I said above I can see the letter function but if instead of putting the delaration of letter inside the prototype I replace //A with

Object.defineProperty(this,"letter",{
    value:
        function(n) {
            console.log(this.word[n]);
            return this;
        }
    ,enumerable:false});

that hides letter from appering Inside the foo object and it leaves the prototype empty. I don't seem to be able to access the prototype object and I don't want to see extra function junk appering in console logs If I did add something to it I would see it as junk unless I added it where //A is..

But then I am left with something that I can't (understand how to) modify with new methods.

Answer 1

The title of your question doesn't seem to be related to the problem, but here we go:

foo = $ = function(word) {
    return new foo(word);
};

var foo = function(word) {
    ...
};

is equivalent to

var foo;
foo = $ = function(word) {
    return new foo(word);
};

foo = function(word) {
    ...
};

I.e. you are creating a local variable foo which shadows the outer one. Thus you are never assigning to the global foo and never exposing foo.fn outside of the function.

You are assigning a function to $, but you are never assigning fn to that function.

---

If I understand correctly what you want to do, then you have to rename the variable so that it doesn't shadow the outer variable, and expose fn on the correct function (which will happen automatically if you renamed the variable):

var foo,$;

(function() {

    foo = $ = function(word) {
        return new InnerFoo(word);
    };

    var InnerFoo = function(word) {
        //#A
        this.word=word;
        console.log(this.word);
        return this;
    };


    foo.fn = InnerFoo.prototype = {

        letter: function(n) {
            console.log(this.word[n]);
            return this;
        }
    };

}());