{"id":1842,"date":"2018-02-08T01:31:37","date_gmt":"2018-02-08T01:31:37","guid":{"rendered":"http:\/\/websterart.com\/wordpress\/?p=1842"},"modified":"2018-02-08T01:36:19","modified_gmt":"2018-02-08T01:36:19","slug":"oop-studies-sold-painting","status":"publish","type":"post","link":"https:\/\/websterart.com\/wordpress\/2018\/02\/oop-studies-sold-painting\/","title":{"rendered":"OOP studies and a sold painting"},"content":{"rendered":"<div id=\"attachment_1283\" style=\"width: 160px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14.jpg\"><img decoding=\"async\" aria-describedby=\"caption-attachment-1283\" class=\"wp-image-1283 size-thumbnail\" src=\"http:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14-150x200.jpg\" alt=\"Crooked River Smith Rocks\" width=\"150\" height=\"200\" srcset=\"https:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14-150x200.jpg 150w, https:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14-224x300.jpg 224w, https:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14-768x1027.jpg 768w, https:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14-766x1024.jpg 766w, https:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14-135x180.jpg 135w, https:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14-449x600.jpg 449w, https:\/\/websterart.com\/wordpress\/wp-content\/uploads\/2017\/02\/ship-rock-9-14.jpg 808w\" sizes=\"(max-width: 150px) 100vw, 150px\" \/><\/a><p id=\"caption-attachment-1283\" class=\"wp-caption-text\">Crooked River Smith Rocks SOLD<\/p><\/div>\n<p>I spent today working through my first Object Oriented Programming exercise in JavaScript. Actually, I spent 2 hours of the day framing a painting for a climbing friend. We met at Jtree, and she came to the house and fell in love with this painting. She picked it up today, and I went back to programming. The code below will only work if it&#8217;s\u00a0in \u00a0a script tag embedded in the &lt;body&gt; element. Then you go to the developer tool console of the browser. Finally, you type <strong>person1.bio()<\/strong> and press enter.<\/p>\n<p>It will trigger an alert box that says: &#8220;Bob Wayno is 35 years old. He likes music, knitting, skiing, climbing, painting, inventing, and sewing. Shoe size is: 15 and their favorite color is orange.&#8221; OOP programming is a stepping stone towards some of the higher end languages I plan to pursue, such as React, AngularJS and Node.js.<\/p>\n<p>If this sounds like a bunch of geek speak move on to the next blog entry. I posted it here because I want to be able to search for it later, and read the code with syntax highlighting. I&#8217;m building up some code libraries of my own to refer back to.<\/p>\n<pre class=\"lang:default decode:true\">\/\/constructor class function names are *Capitalized*\r\n\r\n\/* When an object instance is created from a class, the classes\r\nconstructor function is run to create the instance. This is\r\ncalled instantiation. The object instance is\r\ninstantiated from the class. In console type:\r\nperson1.bio()\r\n*\/\r\n\/\/\"function Person\" is an class (object template)!\r\nfunction Person(first, last, age, gender, interests, shoeSize, favColor) {\r\n  this.name = {\r\n    'first' : first,\r\n    'last'  : last\r\n  };\r\n  \/*the word age on The right side  = what ever string comes\r\n   in from the object instance via the console.person1.bio() command *\/\r\n  this.age = age;\r\n  this.gender = gender;\/\/ gender = Person[3]\r\n  this.interests = interests;\r\n\r\n  \/*the shoeSize in the parameters listed above Person[5] gets\r\n  replaced with whatever comes in from\r\n  when the object instance  gets used (instantiated)*\/\r\n  this.shoeSize = shoeSize;\r\n  this.favColor = favColor;\r\n\r\n  this.bio = function() {\r\n    var pronoun;\r\n    var hobbies = '';\r\n    if (this.gender === 'male'){\r\n      pronoun = 'He';\r\n    } else if (this.gender === 'female'){\r\n      pronoun = 'She';\r\n    } else {\r\n      pronoun = 'This person';\r\n    }\r\n    for (let i = 0; i &lt; interests.length; i++)\r\n    {\r\n      if(i === interests.length-1){\r\n        hobbies += 'and ' + interests[i];\r\n      } else {\r\n      hobbies += interests[i] + ', ';\r\n      }\r\n    }\r\n      var myString = this.name.first + ' ' + this.name.last\r\n      + ' is ' + this.age + ' years old. '\r\n      + pronoun + ' likes ' + hobbies + '. Shoe size is: '\r\n      + shoeSize + ' and their favorite color is '\r\n      + favColor + '.';\r\n      alert(myString);\r\n  };\/\/end bio function\r\n  this.greeting = function(){\r\n    alert('Hi! I\\'m ' + this.name.first + '.');\r\n  };\r\n}\r\n\/\/ person1 is an object instance created  from the Person class\r\nvar person1 = new Person(\r\n  'Bob', 'Wayno', 35, 'male',\r\n  [\r\n    'music',\r\n    'knitting', 'skiing', 'climbing', 'painting', 'inventing',\r\n    'sewing'\r\n  ], 15, 'orange'\r\n);\/\/end new Person\r\n  if (person1[3] === 'male'){\r\n      person1[3] = 'He';\r\n\r\n} else if (person1[3] === 'female'){\r\n           person1[3] = 'She';\r\n  } else {\r\n  person1[3] = 'This person';\r\n  }\/\/end if gender === ?<\/pre>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I spent today working through my first Object Oriented Programming exercise in JavaScript. Actually, I spent 2 hours of the day framing a painting for a climbing friend. We met at Jtree, and she came to the house and fell in love with this painting. She picked it up today, and I went back to [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1842","post","type-post","status-publish","format-standard","hentry","category-blog"],"_links":{"self":[{"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/posts\/1842","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/comments?post=1842"}],"version-history":[{"count":5,"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/posts\/1842\/revisions"}],"predecessor-version":[{"id":1847,"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/posts\/1842\/revisions\/1847"}],"wp:attachment":[{"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/media?parent=1842"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/categories?post=1842"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/websterart.com\/wordpress\/wp-json\/wp\/v2\/tags?post=1842"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}