IFSC 30003      HW6           Due by Wednesday Oct. 8, 2025

Directions: Email to IFSC30003HW@gmail.com.

Directions: skip down to problem 1.

0. Make a set of buttons that demonstrate arrays!

If you saved a program with buttons demonstrating things about JavaScript from a previous HW, why not combine them with this HW to build a more comprehensive page of buttons showing how JavaScript works! In either case, save this HW so you can add the buttons to a future HW. By the end of the course you can have a page with lots of buttons showing a kind of encyclopedia of JavaScript.

1. Consider the game you made in the previous HW. Either improve it, or use it as the starting point to make a new game. Either way, it should now cover objects.

2. What are the attribute names and attribute values of the object predefined in a web page called document? Use a for/in loop.


   HINT: The following script,
<script>
alert(document);
</script>
displays the output
[object HTMLDocument]
indicating that document is a predefined object. It is predefined by the web page that the code is embedded in. Since it is an object, it has parts, and those parts can be stepped through using a for/in loop.

3. Call document.getElementById("demo") to get a paragraph (a <p>) object. Store it in a variable called x or whatever you want. Use a "for in" loop to list out its attributes (components) and their values. For example, one of its attributes is named "innerHTML," which you know of, but there are a bunch of others too.

4. Use a "for in" loop to list out the attributes (components) and their values, for an array containing several elements.

5. Do the quiz-style study exercise at https://claude.ai/public/artifacts/2b1df340-7541-45c6-93db-b7e0891fc028. You will need to focus on the code at https://dberleant.github.io/IFSC3300/parenthesisChecker.html, because the exercise refers to lines of code in that page. Hand in a screen shot of the exercise when you're done.

6. (a) Do the same for https://claude.ai/public/artifacts/8db1b3c6-0fc3-4f75-8f83-d9f4c96c5395.
(b) Do the same for https://claude.ai/public/artifacts/f6453e6e-c45e-4118-9f2c-ba8a4e72d9ca.
(This covers all the lines of the program that we discussed in class.)

7. Optional (you don't have to do this one). Do the following object step-by-step exercise. Do as many steps as you can.

a) In a sandbox, declare an object myObj with an attribute (property, local variable, member, member variable) called name. Access the value of name using the syntax myObj.name. Also access it using the syntax myObj["name"]. The two attribute references are interchangeable and so should obtain the same value.

b) Declare a variable x and give it the string value "name". Change your access to myObj["name"] to myObj[x]. The two references are to the same thing and thus are interchangeable and so should obtain the same value.

c) Try to access myObj.x. It doesn't work. Why?

d) Add a new attribute (property, local variable, member, member variable) to the object, and call this new attribute x.

e) Show that myObj[x] provides a different value than myObj.x. Why?

f) Add a new attribute to the object called myFunc. For its value, assign to it, not a number like 3, but a function definition, like function(){return "Hi!";}. This attribute is often called a "method," a term referring to a function that is in an object.

g) Print the value of myFunc. It should be the function definition.

h) Print the value of myFunc(). It should be whatever value is returned when myFunc() runs.

i) Set x to the string value "myFunc" as in: x="myFunc";

j) Run myObj[x](). It should do exactly the same as myObj.myFunc().

k) Add 2 or more attributes to myObj. To do this just assign a value to the new attribute and it will be created and will hold the new value. For example, myObj.newAttribute=5; will give myObj a new attribute called newAttribute and assign it the value 5.

l) Use a for/in loop to go through myObj and print out each attribute and its value. An example of a for/in loop is in: https://www.w3schools.com/js/tryit.asp?filename=tryjs_object_for_in.

j) What happens when you try to loop through the object's parts using the dot notation, as used in myObj.whatever? Why?

k) Why is the square bracket notation, as in myObj[x], more powerful than the dot notation, as used in myObj.whatever?