OOP In WinJS #2: Nested Namespaces

In our previous article, we talked about how to define and use Namespaces in WinJS with a Universal Windows Apps demo. And now, it's time to dig deeper in WinJS Namespaces, which inclines me towards Nested Namespaces.

Nested Namespaces 

This article covers more insights as we're going deeper in namespaces structure by providing Nested Namespaces. Nested Namespaces, as you can understand, is a child namespace in a parent namespace.

Some examples  regarding Nested Namespaces can be:

• Product/Categories/SubCategories
• League/Teams/Players
• Program/Product/Project
• Company/Departments/Employees
• University/Faculties/Classes/Students

And many more.

In our example we'll extend a namespace with a subnamespace which we call Nested Namespaces.

Let's start building!

Building the App

It's better if we use the same app we've created on our previous article as I linked above.

Since we need to extend the functionality of an existing namespace, I'm planning on taking "ShareJob" namespace.

What can be a child of ShareJob? I thought about a few, for instance:

• Facebook, Twitter, LinkedIn, Google+
• Share via Email
• Share via SMS

So, let's create these sub jobs:

WinJS.Namespace.defineWithParent(ShareJob, "Facebook", {
   Job: {
            PostData: function ()
            {
                return "Sharing with Facebook...";
            }
        }
    }
);

WinJS.Namespace.defineWithParent(ShareJob, "Twitter", {
    Job: {
        PostData: function () {
            return "Sharing with Twitter...";
        }
    }
}
);

WinJS.Namespace.defineWithParent(ShareJob, "LinkedIn", {
    Job: {
        PostData: function () {
            return "Sharing with LinkedIn...";
        }
    }
}
);

WinJS.Namespace.defineWithParent(ShareJob, "Email", {
    Job: {
        PostData: function () {
            return "Sharing with Email";
        }
    }
}
);

WinJS.Namespace.defineWithParent(ShareJob, "SMS", {
    Job: {
        PostData: function () {
            return "Sharing with SMS...";
        }
    }
}
);

Then let's call these functions in our js file:

console.log(ShareJob.Twitter.Job.PostData());
console.log(ShareJob.Facebook.Job.PostData());
console.log(ShareJob.LinkedIn.Job.PostData());
console.log(ShareJob.Email.Job.PostData());
console.log(ShareJob.SMS.Job.PostData());

And run,

That's it! We have implemented a namespace within an existing namespace and extended its functionality. This is an awesome feature of WinJS as you will be widely using it for separating jobs in your project.

 

Read more articles on Universal Windows Apps:

• Create Your First UWP App
• AutoSuggestBox In UWP