Introduction to Computer Programming Quiz Answers

Get All Week Introduction to Computer Programming Quiz Answers

Introduction to Computer Programming Week 01 Quiz Answers

Quiz 1: Getting started with P5.js

Q1. JavaScript is a…?

[expand title=View Answer] programming language [/expand]

Q2. P5.js is a…?

[expand title=View Answer] library[/expand]

Q3. Where is JavaScript predominately used?

[expand title=View Answer] building web applications and interactive websites [/expand]

Q4. In programming what is a command?

[expand title=View Answer] a single programming instruction issued to the computer to do something [/expand]

Q5. In programming, what is a library?

[expand title=View Answer] a collection of code written by someone else to speed up our development.[/expand]

Q6. Select all the answers you think are correct.

P5.js has commands for…?

Hint: Use the P5.js reference page to help you.

[expand title=View Answer]
1.loading and playing sound
2.interacting and manipulating the webpages DOM
3.user interaction with the mouse and keyboard
4.text and typography
5.loading a displaying images
6.drawing primitive shapes
[/expand]

Quiz 2: 2D coordinate system

Q1. What is the P5.js command for a new canvas?

[expand title=View Answer]createCanvas() [/expand]

Q2. What is a pixel?

[expand title=View Answer] the smallest addressable point on the canvas or screen[/expand]

Q3. The coordinates (0,0) represent which corner of the canvas?

[expand title=View Answer] top left [/expand]

Q4. The x coordinate represents the number of pixels:

[expand title=View Answer] across the canvas from left to right [/expand]

Q5. The y coordinate represents the number of pixels:

[expand title=View Answer] down the canvas from top to bottom [/expand]

Q6. In a coordinate pair, such as (400,300), which coordinate is first?

[expand title=View Answer] the x coordinate [/expand]

Q7. Which coordinate system is used by the canvas?

[expand title=View Answer] Cartesian coordinates[/expand]

Q8.How will the following rectangle be drawn to the canvas?
rect(100, 200, 150, 300);

[expand title=View Answer] at x coordinate100, a y coordinate 200, with a width of 150 and height of 300 [/expand]

Introduction to Computer Programming Week 02 Quiz Answers

Quiz 1: RGB colours

Q1. What color does the following RGB color value represent?

(255,255,255)

[expand title=View Answer] White [/expand]

Q2. In RGB colors if all 3 values are the same what do we know for definite about the color?

[expand title=View Answer] None of the above. [/expand]

Q3. What color is represented by the following RGB value?

[expand title=View Answer] yellow [/expand]

(255,255,0)

Q4. What color is represented by the following RGB value?

(0,256,256)

[expand title=View Answer] not a valid color value [/expand]

Q5. What color is represented by the following RGB value?

(140, 0, 255)

Hint: You might want to use an online color picker to help you.

[expand title=View Answer] purple [/expand]

Q6. What RGB value represents the following color?

[expand title=View Answer] (255,150,0) [/expand]

Q7. An RGB color value takes 24 bits of computer memory, 8 bits (or one byte) for red green, and blue. How many colors does this mean we can store overall?

[expand title=View Answer] 16777216 [/expand]

Q8. How many possible values are there for one byte of information?

[expand title=View Answer] 256 [/expand]

Quiz 2: setup, draw, and Programme Flow

Q1. When is the setup() function called?

[expand title=View Answer]at the start of the program execution [/expand]

Q2. When is the draw() function called?

[expand title=View Answer] every frame of animation [/expand]

Q3. Where would you normally call createCanvas()?

[expand title=View Answer] in the setup() function [/expand]

Q4. Look at the following code carefully. What do you expect to see drawn to the screen when the application runs?

12345678910111213
function setup()
{
createCanvas(500, 500);
}

function draw()
{

fill(255, 0, 0);
rect(100, 100, 200, 200);

[expand title=View Answer] a blue square with the red square partially visible underneath which is appearing as a purple colour.[/expand]

Q5. Look at the following code carefully. What do you expect to see drawn to the screen when the application runs?

function setup()
{
createCanvas(500, 500);
}
function draw()
{
fill(255, 0, 0, 255);
rect(100, 100, 200, 200);
fill(0, 0, 255, 100);

[expand title=View Answer] a blue square with a smaller red square overlapping its top left corner[/expand]

Q6. Look at the following code carefully. What do you expect to be drawn to the screen when it runs?

function setup()
{
createCanvas(500, 500);
}function draw()
{

fill(0, 0, 255);
rect(100, 100, 300, 300);

[expand title=View Answer]a blue square only [/expand]

Q7. Consider the following code carefully. What is displayed to the screen when the program is run?

function setup()
{
createCanvas(500, 500);
}
function draw()
{

fill(0, 0, 255);
rect(100, 100, 300, 300);

[expand title=View Answer] a blue square with rounded corners[/expand]

Hint: imagine the program has been running for a few seconds and base your judgment on draw having been run several times.

Q8. Consider the following code carefully. What is displayed to the screen when the program is run?

function setup()
{
createCanvas(500, 500);
}
function draw()
{
noStroke();
fill(255, 0, 0, 255);
rect(100, 100, 200, 200);

[expand title=View Answer]a red square only, with no outline [/expand]

Hint: If there is some code you don’t recognise. Do not forget you can look it up in the p5.js reference.

Quiz 3: ellipse, rectangle, line, triangle, point

Q1. How many arguments does the point() function take?

Hint: Arguments are the numbers in brackets at the end of the function call separated by commas.

[expand title=View Answer] 2 [/expand]

Q2. Which of the following commands draw the line in the picture below? Two of the answers below are correct, select them both.

Hint: Don’t worry about the precise coordinates try and work out the rough direction of the line.

[expand title=View Answer]
line(320, 80, 100, 250);

line(100,320,80,250);
[/expand]

Q3. Which of the following commands drew the shape in the picture below?

[expand title=View Answer] ellipse(200, 150, 100, 50);[/expand]

Q4. Which of the following commands turns the shape green?

[expand title=View Answer] fill(0,255,0) [/expand]

Q5. Which of the following commands draws a square to the screen?

[expand title=View Answer] rect(100, 100, 100, 100) [/expand]

Q6. Do the following two triangle commands draw the same triangle or a different triangle?

12
triangle(100,100,150,50,200,100);
triangle(150,50,200,100,100,100);

[expand title=View Answer] the same triangle[/expand]

Q7. The code below draws the triangle as shown in the first image. what is the smallest number of arguments used in the triangle function call do you need to change to draw the triangle in the second image?

123456789
function setup() {
createCanvas(400, 400);
}

function draw() {
background(0);
fill(200,0,0);
triangle(100,100,150,50,200,100);
}
first image:

second image:

Hint: The bases of the triangles are the same.

[expand title=View Answer] 4 [/expand]

Q8. Which of the following shapes can you not draw with a single P5.js command?

[expand title=View Answer]star [/expand]

Quiz 4: Using the console and debugging syntax errors

Q1. Where do you find the console?

[expand title=View Answer]in the browser’s developer settings [/expand]

Q2. Look at the following error. Where is the error in the code?

[expand title=View Answer] somewhere else[/expand]

Q3. What kind of error or error is included in the following code?

123456789
function setup()
{
createCanvas(500, 500);
}

function draw()
{
triangle(100, 100, 150, 100);
}

[expand title=View Answer] a semantic error [/expand]

Q4. What kind of error is included in the following code?

123456789
function setup()
{
createcanvas(500, 500);
}

function draw()
{
rect(100, 100, 150, 100);
}

[expand title=View Answer] syntax error [/expand]

Q5. What kind of error is included in the following code?

123456789
function setup()
{
createCanvas(500, 500);
}

function draw()
{
rect(100, 100, 150, 100);

[expand title=View Answer] there are no errors [/expand]

Introduction to Computer Programming Week 03 Quiz Answers

Quiz 1: Built-in Variables: mouseX, mouseY, and Events

Q1. Which of the following variables represents the mouse’s Y coordinate?

[expand title=View Answer] mouseY [/expand]

Q2. Which of the following statements best represents what a variable is?

[expand title=View Answer]A variable is a placeholder for a value you can use in your code. [/expand]

Q3. Study the following code carefully. What is visible on the canvas when the program executes?

1234567891011
function setup()
{
createCanvas(500, 500);
}

function draw()
{
fill(0, 0, 220);
rect(100, 100, 300, 300);
background(0, 0, 0);

[expand title=View Answer] a black background with a blue square in the centre [/expand]

Q4. What is displayed on the screen when the following code is executed?

12345678910111213
function setup()
{
createCanvas(500, 500);
}

function draw()
{
background(0, 0, 0);
fill(220, 0, 220);
noStroke();

[expand title=View Answer]a purple square filling the canvas [/expand]

Q5. What does the following code draw to the screen?

12345678910111213
function setup()
{
createCanvas(500, 500);
}

function draw()
{
background(0, 0, 0);
noStroke();
fill(220, 0, 220);

[expand title=View Answer]a purple square in the top left corner of the canvas with a black background [/expand]

Q6. What does the following code draw to the screen?

12345678910111213
function setup()
{
createCanvas(500, 500);
}

function draw()
{
background(0, 0, 0);
noStroke();
fill(220, 0, 220);

[expand title=View Answer] a purple rectangle that increases and deceases in size as the user moves the mouse in any direction[/expand]

Q7. What value is stored in mouseX?

[expand title=View Answer] a number that represents the mouse’s location across the screen [/expand]

Q8. When is the keyPressed() function called?

[expand title=View Answer] After a key has been released[/expand]

Q9. When is the mousePressed() function called?

Hint: You may want to read the p5.js documentation.

[expand title=View Answer] when the left mouse button has been pressed[/expand]

Q10. What colour is the ellipse drawn in the following code after the mouse has been pressed and released?

12345678910111213141516
function setup()
{
createCanvas(500, 500);
}

function draw()
{
fill(255, 0, 0);
rect(100, 100, 300, 300);

[expand title=View Answer] red [/expand]

Quiz 2: Create your own variables: var, initialising and assigning

Q1. A variable name cannot start with…?

[expand title=View Answer] an upper case letter [/expand]

Q2. Which of the following variables are valid names? (Three are correct.)

[expand title=View Answer
1.my_var1
2.myVar
3._1myVar
[/expand]

Q3. Formally, creating a variable is called?

[expand title=View Answer] declaring [/expand]

Q4. Formally, assigning a variable its first value is called?

[expand title=View Answer] initialising [/expand]

Q5. What does a equal at the end of executing the following code?

1234
var a = 3;
var b = 23;
var c = b;
a = c;

[expand title=View Answer] 23 [/expand]

Q6. What does the variable ‘a’ equal at the end of the setup() function in the code snippet below?

1234567
var a = 0;

function setup()
{
createCanvas(400, 200);
a = width;
}

[expand title=View Answer] 400 [/expand]

Q7. What does the variable ‘a’ equal at the end of the setup() function in the code snippet below?

1234567
var a = 0;

function setup()
{
createCanvas(400, 200);
a(height);
}

[expand title=View Answer] The code contains an error. [/expand]

Q8. True or False: JavaScript variables can be created without the var keyword?

[expand title=View Answer] True[/expand]