Code 201 Class 6 reading Notes

Object Literals

Literal notation is the easiest and most popular way to create objects. There are several ways to creat objects.

var hotel = {
  name: 'Quay',
  rooms: '40',
  booked: 25,

  checkAvailability: function() {
    return this.rooms - this.booked;
  }
}

The object is the curlly braces and their contents. The object is stored ina variable called hotel, so you would refer to it as the hotel object.

What do you seperate each key from its value?

A colon. And then you seperate each property and method with a common(but not after the last value).

You can access the properties or methods of the above object using dot notation or brackets.

var hotelName = hotel.name;
var roomsFree = hotel.checkAvailability();

OR

var hoteName = hotel['name'];
var roomsFree = hotel['checkAvailability']();

Working with the DOM Tree

Two Steps

1) Locate the node that represents the element you want to work with

2)Use it’s text content, child elements, and attributes.

• The browser represents the page using a DOM tree.

• DOM trees have four types of nodes: document nodes element nodes, attribute nodes, and text nodes.

• You can select element nodes by their id or class attributes, by tag name, or using CSS selector syntax.

• Whenever a DOM query can return more than one node, it will always return a NodeList.

• From an Element node, you can access and update its content using properties such as textContent and innerHTML or using DOM manipulation techniques.

• An element node can contain ultiple text nodes and child elements that are siblings of each other.

• In older browsers, implementation of the DOM is inconsistent (and is a populare reason for using jQuery).

• Browsers offer tools for viewing the DOM tree.

Understanding the problem domain is the hardest part of programming

Games are a good example of this. Most games you find start with a very small problem domain. First level is usually a tutorial that teaches a basic set of things you can do so you don’t get overwhelmed. But as you go through more levels, the more advanced they get and introduce new concepts, you start building on what you know until you understand a pretty large problem domain.

Difference between primitive values and object references

JavaScript Eight Data Types

• Boolean

• Null

• Undefined

• Number

• BigInt

• String

• Symbol

• Objects

Arrays, functions, and dates are objects under the hood.

The above are all primitive values except for the object references.

Primitive values can be stoored in variable directly. Objects, on the other hand, are stored as references. A variable that has been assigned an object does not store that object directly, it stores the memory address of the location that the object exists at.

Primitive values are immutable – they cannot be changed after being created. Object references, however, are mutable and can be changed

<—BACK