<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
	<id>https://wiki2.sitebuilt.net/index.php?action=history&amp;feed=atom&amp;title=Javascript_OOP_using_Literal_Notation</id>
	<title>Javascript OOP using Literal Notation - Revision history</title>
	<link rel="self" type="application/atom+xml" href="https://wiki2.sitebuilt.net/index.php?action=history&amp;feed=atom&amp;title=Javascript_OOP_using_Literal_Notation"/>
	<link rel="alternate" type="text/html" href="https://wiki2.sitebuilt.net/index.php?title=Javascript_OOP_using_Literal_Notation&amp;action=history"/>
	<updated>2026-05-06T16:24:45Z</updated>
	<subtitle>Revision history for this page on the wiki</subtitle>
	<generator>MediaWiki 1.37.0</generator>
	<entry>
		<id>https://wiki2.sitebuilt.net/index.php?title=Javascript_OOP_using_Literal_Notation&amp;diff=6288&amp;oldid=prev</id>
		<title>Tim: /* javascript OOP using Literal Notation */</title>
		<link rel="alternate" type="text/html" href="https://wiki2.sitebuilt.net/index.php?title=Javascript_OOP_using_Literal_Notation&amp;diff=6288&amp;oldid=prev"/>
		<updated>2013-03-27T21:57:04Z</updated>

		<summary type="html">&lt;p&gt;&lt;span dir=&quot;auto&quot;&gt;&lt;span class=&quot;autocomment&quot;&gt;javascript OOP using Literal Notation&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 17:57, 27 March 2013&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l28&quot;&gt;Line 28:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 28:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         anima['small'] = &amp;quot;mouse&amp;quot;;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         anima['small'] = &amp;quot;mouse&amp;quot;;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         feline=new Object();&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         feline=new Object();&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-deleted&quot;&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;        feline=new Array();&lt;/ins&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         feline[4]=anima;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         feline[4]=anima;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;          &lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;          &lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l49&quot;&gt;Line 49:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 50:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         obj=new MyClass(anima,feline);&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;         obj=new MyClass(anima,feline);&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&amp;lt;/syntaxhighlight&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&amp;lt;/syntaxhighlight&amp;gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-deleted&quot;&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;The stuff above function Myclass is just junk to try to see the diffferences between arrays and objects.&lt;/ins&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>Tim</name></author>
	</entry>
	<entry>
		<id>https://wiki2.sitebuilt.net/index.php?title=Javascript_OOP_using_Literal_Notation&amp;diff=6287&amp;oldid=prev</id>
		<title>Tim: Created page with &quot;===javascript OOP using Literal Notation=== Literal Notation seems much more readable to me. ====OOP single==== In cases where you don't need multiple instances of a Class, th...&quot;</title>
		<link rel="alternate" type="text/html" href="https://wiki2.sitebuilt.net/index.php?title=Javascript_OOP_using_Literal_Notation&amp;diff=6287&amp;oldid=prev"/>
		<updated>2013-03-27T21:54:46Z</updated>

		<summary type="html">&lt;p&gt;Created page with &amp;quot;===javascript OOP using Literal Notation=== Literal Notation seems much more readable to me. ====OOP single==== In cases where you don&amp;#039;t need multiple instances of a Class, th...&amp;quot;&lt;/p&gt;
&lt;p&gt;&lt;b&gt;New page&lt;/b&gt;&lt;/p&gt;&lt;div&gt;===javascript OOP using Literal Notation===&lt;br /&gt;
Literal Notation seems much more readable to me.&lt;br /&gt;
====OOP single====&lt;br /&gt;
In cases where you don't need multiple instances of a Class, then it is easy to create a object like this:&lt;br /&gt;
&amp;lt;syntaxhighlight&amp;gt;&lt;br /&gt;
        var obj={&lt;br /&gt;
            tisel : new Array(),&lt;br /&gt;
            tesel : &amp;quot;&amp;quot; ,&lt;br /&gt;
            ulsel : '.prog-tes ul',&lt;br /&gt;
            lisel : '.prog-tes ul li',&lt;br /&gt;
            idx : 0,&lt;br /&gt;
            arr : new Array(),&lt;br /&gt;
            new : function(){&lt;br /&gt;
                this.tesel=&amp;quot;dog&amp;quot;;&lt;br /&gt;
                this.tisel[0]=&amp;quot;cat&amp;quot;;&lt;br /&gt;
                return &amp;quot;frog&amp;quot;;&lt;br /&gt;
            }&lt;br /&gt;
        };&lt;br /&gt;
        obj.new();&lt;br /&gt;
&amp;lt;/syntaxhighlight&amp;gt;&lt;br /&gt;
You declare all your variables. Make a fake new or constructor to initalize.&lt;br /&gt;
&lt;br /&gt;
====OOP multiple instances====&lt;br /&gt;
If you need multiple instances of a class (many objects) and you want to use literal notation then you could do it like this&lt;br /&gt;
&amp;lt;syntaxhighlight&amp;gt;&lt;br /&gt;
        anima=new Object();&lt;br /&gt;
        anima.large = &amp;quot;elephant&amp;quot;&lt;br /&gt;
        anima['small'] = &amp;quot;mouse&amp;quot;;&lt;br /&gt;
        feline=new Object();&lt;br /&gt;
        feline[4]=anima;&lt;br /&gt;
        &lt;br /&gt;
        function MyClass(animal,feline){&lt;br /&gt;
                this.tesel=animal;&lt;br /&gt;
                this.tisel=feline;&lt;br /&gt;
                return &amp;quot;frog&amp;quot;;&lt;br /&gt;
        }		&lt;br /&gt;
        MyClass.prototype={&lt;br /&gt;
            ulsel : '.prog-tes ul',&lt;br /&gt;
            lisel : '.prog-tes ul li',&lt;br /&gt;
            idx : 0,&lt;br /&gt;
            arr : new Array(),&lt;br /&gt;
            new : function(){&lt;br /&gt;
                console.log(this.tesel);&lt;br /&gt;
                this.tesel=&amp;quot;jerk&amp;quot;;&lt;br /&gt;
                this.tisel[17]=&amp;quot;drugs&amp;quot;;&lt;br /&gt;
                this.tisel[0]=&amp;quot;rock&amp;quot;;&lt;br /&gt;
            }&lt;br /&gt;
        };&lt;br /&gt;
        obj=new MyClass(anima,feline);&lt;br /&gt;
&amp;lt;/syntaxhighlight&amp;gt;&lt;/div&gt;</summary>
		<author><name>Tim</name></author>
	</entry>
</feed>