Javascript Objects Notes
<p>As javascript objects are used so often in javascript i thought i would write an overview and some notes on how they work, well how they work for me anyway. I guess how they work for me should be similar to how they just work, so should be good. </p>
<h3>What is a Javascript Object?</h3>
<ol>
<li>A javscript object is a collection of named values.</li>
<li>Objects is an unordered collection of key value pairs.</li>
<li>Javascript Objects are like an array, but not actually an array. </li>
</ol>
<h3>An example of a Javascript Object</h3>
<p><img style="display: block; margin-left: auto; margin-right: auto;" src="https://i.imgur.com/NS9UZvo.png" /></p>
<h4>Javascript</h4>
<pre><code class="javascript hljs">const myobject = {<br /> "myobject1": "value1",<br /> "myobject2": "value2",<br /> "myobject3": "value3"<br />}</code></pre>
<h3>Accessing Properties of an Object</h3>
<p>Lets take the myobject and access value2 from it. </p>
<p>You can do this with : <code>objectName.property</code></p>
<p>or like this</p>
<p><code>objectName["property"]</code></p>
<p><img style="display: block; margin-left: auto; margin-right: auto;" src="https://i.imgur.com/He9vAd9.png" /></p>
<h4>Javascript</h4>
<pre><code class="javascript hljs">console.log(myobject.myobject2);</code></pre>
<h3>Convert an Object to An Array</h3>
<p>You can convert your javascript object into an array with Object.values(objectName);</p>
<p><img src="https://i.imgur.com/Ley1Rkv.png" /></p>
<h4>Javascript</h4>
<pre><code class="javascript hljs">/ an array of the object called myobjectarray /<br />const myobjectarray = Object.values(myobject);<br />console.log(myobjectarray);</code></pre>
<h3>Loop throught the new array</h3>
<p>Usually i forget how to do this, so i thought i would add it here to see if it jogs my memory. </p>
<p>The array is now called <code class="javascript hljs">myobjectarray </code></p>
<p>This seems to work:</p>
<p><img src="https://i.imgur.com/wkiHb6w.png" /></p>
<h4>Javascript</h4>
<pre><code class="javascript hljs">/ foreach on the array function /<br />let out = "";<br />myobjectarray.forEach(dostufffunction);<br />function dostufffunction(value, index, array) {<br /> out += "value: " + value + ", index: " + index + "array: " + array;<br />}<br />console.log(out);</code></pre>
<h3>Object Methods</h3>
<p>You can add things like functions inside objects, which makes them even more useful than arrays. </p>
<p>add code and example... </p>
<h3>Constructor</h3>
<p>A blue print for creating objects. </p>
<p> </p>
Javascript
const my_object = {
"my_object_1": "value1",
"my_object_2": "value2",
"my_object_3": "value3"
}
console.table(my_object);
// console.log the value of my_object.my_object_2
console.log(my_object.my_object_2);
// console.log the value of objectName["property"]
console.log( my_object["my_object_2"] );
// an array of the object called my_object_array
const my_object_array = Object.values(my_object);
console.log(my_object_array);
// foreach on the array function
let out = "";
my_object_array.forEach(do_stuff_function);
function do_stuff_function(value, index, array) {
out += "value: " + value + ", index: " + index + "array: " + array;
}
console.log(out);View Statistics
Add Comment
Other Items in javascript
Related Search Terms
Other Categories in Code
