Below you can view your statistics for all the different tests:
33 | 34 |Answer all the question below, then click on Submit to see your results.
33 | 34 |Answer all the question below, then click on Submit to see your results.
33 | 34 |Answer all the question below, then click on Submit to see your results.
33 | 34 |Answer all the question below, then click on Submit to see your results.
33 | 34 |You have not yet taken this test!
Total score: '+user['chapter1Score']+'%
'; 22 | htmlToRender += 'Variables score: '+user['chapter1VariablesScore']+'%
'; 23 | htmlToRender += 'Expressions score: '+user['chapter1ExpressionsScore']+'%
'; 24 | } 25 | if (user['chapter2Score'] === -1){ 26 | htmlToRender += 'You have not yet taken this test!
Total score: '+user['chapter2Score']+'%
'; 31 | htmlToRender += 'Strings score: '+user['chapter2StringsScore']+'%
'; 32 | htmlToRender += 'Arrays score: '+user['chapter2ArraysScore']+'%
'; 33 | } 34 | if (user['chapter3Score'] === -1){ 35 | htmlToRender += 'You have not yet taken this test!
Total score: '+user['chapter3Score']+'%
'; 40 | htmlToRender += 'Conditionals score: '+user['chapter3ConditionalsScore']+'%
'; 41 | htmlToRender += 'Loops score: '+user['chapter3LoopsScore']+'%
'; 42 | } 43 | if (user['reviewScore'] === -1){ 44 | htmlToRender += 'You have not yet taken this test!
Total score: '+user['reviewScore']+'%
'; 49 | htmlToRender += 'Variables score: '+user['reviewVariablesScore']+'%
'; 50 | htmlToRender += 'Expressions score: '+user['reviewExpressionsScore']+'%
'; 51 | htmlToRender += 'Strings score: '+user['reviewStringsScore']+'%
'; 52 | htmlToRender += 'Arrays score: '+user['reviewArraysScore']+'%
'; 53 | htmlToRender += 'Conditionals score: '+user['reviewConditionalsScore']+'%
'; 54 | htmlToRender += 'Loops score: '+user['reviewLoopsScore']+'%
'; 55 | } 56 | document.getElementById('statistics-view').innerHTML = htmlToRender; 57 | } 58 | -------------------------------------------------------------------------------- /0_comments.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 |Comments are lines of code that JavaScript will intentionally ignore. Comments are a great way to leave notes to yourself and to other people who will later need to figure out what that code does.
30 |There are two ways to write comments in JavaScript:
31 |Using // will tell JavaScript to ignore the remainder of the text on the current line:
// This is an in-line comment.33 |
You can make a multi-line comment beginning with /* and ending with */:
/* This is a 35 | multi-line comment */
36 |
37 |
As you write code, you should regularly add comments to clarify the function of parts of your code. Good commenting can help communicate the intent of your code - both for others and for your future self.
39 |+ symbol is the addition operator.';
34 | document.getElementById('question-'+questionId+'-message').className = 'failure';
35 | if(user['expressionsMistakes'][questionId] == 0) {
36 | user['expressionsMistakes'][questionId] = 1;
37 | user['stereotype'] -= 5;
38 | localStorage.setItem('learn-js-user', JSON.stringify(user));
39 | }
40 | }
41 | else if(userInput == 'sub'){
42 | document.getElementById('question-'+questionId+'-message').innerHTML = 'The - symbol is the subtraction operator.';
43 | document.getElementById('question-'+questionId+'-message').className = 'failure';
44 | if(user['expressionsMistakes'][questionId] == 0) {
45 | user['expressionsMistakes'][questionId] = 1;
46 | user['stereotype'] -= 5;
47 | localStorage.setItem('learn-js-user', JSON.stringify(user));
48 | }
49 | }
50 | else if(userInput == 'mult'){
51 | document.getElementById('question-'+questionId+'-message').innerHTML = 'The * symbol is the multiplication operator.';
52 | document.getElementById('question-'+questionId+'-message').className = 'failure';
53 | if(user['expressionsMistakes'][questionId] == 0) {
54 | user['expressionsMistakes'][questionId] = 1;
55 | user['stereotype'] -= 5;
56 | localStorage.setItem('learn-js-user', JSON.stringify(user));
57 | }
58 | }
59 | else if(userInput == 'div'){
60 | document.getElementById('question-'+questionId+'-message').innerHTML = 'The / symbol is the division operator.';
61 | document.getElementById('question-'+questionId+'-message').className = 'failure';
62 | if(user['expressionsMistakes'][questionId] == 0) {
63 | user['expressionsMistakes'][questionId] = 1;
64 | user['stereotype'] -= 5;
65 | localStorage.setItem('learn-js-user', JSON.stringify(user));
66 | }
67 | }
68 | else if(userInput == 'quotient'){
69 | document.getElementById('question-'+questionId+'-message').innerHTML = 'The % symbol returns the remainder of a division, not the quotient.';
70 | document.getElementById('question-'+questionId+'-message').className = 'failure';
71 | if(user['expressionsMistakes'][questionId] == 0) {
72 | user['expressionsMistakes'][questionId] = 1;
73 | user['stereotype'] -= 5;
74 | localStorage.setItem('learn-js-user', JSON.stringify(user));
75 | }
76 | }
77 | else{
78 | document.getElementById('question-'+questionId+'-message').innerHTML = 'Correct!';
79 | document.getElementById('question-'+questionId+'-message').className = 'success';
80 | if(user['expressionsMistakes'][questionId] == 0) {
81 | user['expressionsMistakes'][questionId] = -1;
82 | localStorage.setItem('learn-js-user', JSON.stringify(user));
83 | }
84 | if(questionId == 4){
85 | user['expressionsEntryStereotype'] = user['stereotype'];
86 | localStorage.setItem('learn-js-user', JSON.stringify(user));
87 | }
88 | }
89 | if(typeof user['expressions-question-0'] !== 'undefined' && typeof user['expressions-question-1'] !== 'undefined'
90 | && typeof user['expressions-question-2'] !== 'undefined' && typeof user['expressions-question-3'] !== 'undefined' &&
91 | (typeof user['expressions-question-4'] !== 'undefined' || user['expressionsEntryStereotype'] < 1100) )
92 | if(user['expressions-question-0'] == 'true' && user['expressions-question-1'] == 'true'
93 | && user['expressions-question-2'] == 'true' && user['expressions-question-3'] == 'true' &&
94 | (user['expressions-question-4'] == 'true' || user['expressionsEntryStereotype'] < 1100) ) {
95 | if(user['expressions'] != 'completed') user['stereotype'] += 50;
96 | user['expressions'] = 'completed';
97 | if(user['strings'] == 'restricted')
98 | user['strings'] = 'available';
99 | localStorage.setItem('learn-js-user',JSON.stringify(user));
100 | }
101 | }
102 |
--------------------------------------------------------------------------------
/reviewTest.js:
--------------------------------------------------------------------------------
1 | document.addEventListener('DOMContentLoaded', function(event){
2 | // Check if saved info, otherwise administer test
3 | if (localStorage.getItem('learn-js-user') === null){
4 | window.location="./index.html";
5 | }
6 | else {
7 | user = JSON.parse(localStorage.getItem('learn-js-user'));
8 | }
9 | generateQuestions();
10 | });
11 |
12 | var user = {};
13 | var questions = [];
14 | function generateQuestions(){
15 | var questionsElement = document.getElementById('questions');
16 | questions.push({qDesc: 'What is the value of x after the following code is executed?var num = 0;', answer1: '
num = num + 5;
var x = num + 3 * 2;
6', answer1value: 'false', answer2: '11', answer2value: 'true', answer3: '5', answer3value: 'false', type: ['variables','expressions']});
17 | questions.push({qDesc: 'What is the value of c after the following code is executed?var myString = "My head hurts";', answer1: '
myString = "I have a headache! " + myString;
var c = myString[20];
"a"', answer1value: 'false', answer2: '"M"', answer2value: 'false', answer3: '"y"', answer3value: 'true', type: ['variables','strings']});
18 | questions.push({qDesc: 'What is the value of i after the following code is executed?var i = 2;', answer1: '
var myName = "Donald";
i = i + 2;
i = myName[i];
"d"', answer1value: 'false', answer2: '"l"', answer2value: 'true', answer3: '"a"', answer3value: 'false', type: ['expressions','strings']});
19 | questions.push({qDesc: 'What is the value of myArray after the following code is executed?var myArray = [0];', answer1: '
for(var i = 0; i < 3; i++){
myArray.push(i);
}
[0,1,2,3]', answer1value: 'false', answer2: '[0,0,1,2]', answer2value: 'true', answer3: '[1,2,3]', answer3value: 'false', type: ['arrays','loops']});
20 | questions.push({qDesc: 'What is the value of myValue after the following code is executed?var myArray = [1,2,3];', answer1: '
var myValue;
switch(myArray[1]){
case 1:
myValue = 5;
break;
case 2:
myValue = myArray.pop();
break;
default:
myValue = 2;
}
3', answer1value: 'true', answer2: '2', answer2value: 'false', answer3: '5', answer3value: 'false', type: ['conditionals','arrays']});
21 | questions.push({qDesc: 'What is the value of x after the following code is executed?var x = 6;', answer1: '
var y = 4;
while(x > 0 && y < 8){
x = x - 1;
y = y + 2;
}
0', answer1value: 'false', answer2: '4', answer2value: 'true', answer3: '5', answer3value: 'false', type: ['loops','conditionals']});
22 | questions = shuffle(questions);
23 | var htmlToRender = '';
24 | for(var i = 0; i < questions.length; i++) {
25 | htmlToRender += generateQuestion(i+1, questions[i].qDesc, questions[i].answer1, questions[i].answer1value, questions[i].answer2, questions[i].answer2value, questions[i].answer3, questions[i].answer3value );
26 | }
27 | questionsElement.innerHTML = htmlToRender;
28 | }
29 |
30 | function generateQuestion(id, qDesc, answer1, answer1value, answer2, answer2value, answer3, answer3value){
31 | var htmlToRender = ''+q1Num+' to a variable myNum?', answer1: 'myNum = "'+q1Num+'";', answer1value: 'false', answer2: 'myNum = '+q1Num+';', answer2value: 'true', answer3: 'var myNum = '+q1Num+';', answer3value: 'false', type: 'variables'});
18 | questions.push({qDesc: 'Which of the following is the correct way to assign the contents of the variable a to variable b?', answer1: 'a = b;', answer1value: 'false', answer2: 'var a = b;', answer2value: 'false', answer3: 'b = a;', answer3value: 'true', type: 'variables'});
19 | questions.push({qDesc: 'Which is the correct way to initialize a variable myCoffee with the value "Espresso"?', answer1: 'myCoffee = "Espresso";', answer1value: 'false', answer2: 'var myCoffee = "Espresso";', answer2value: 'true', answer3: 'var myCoffee = Espresso;', answer3value: 'false', type: 'variables'});
20 | questions.push({qDesc: 'Which is the correct way to initialize a variable myNum with the value '+(50-q1Num)+'?', answer1: 'var myNum = "'+(50-q1Num)+'";', answer1value: 'false', answer2: 'var myNum = '+(50-q1Num)+';', answer2value: 'true', answer3: 'myNum = '+(50-q1Num)+';', answer3value: 'false', type: 'variables'});
21 | if(user['variablesEntryStereotype'] >= 1250)
22 | questions.push({qDesc: 'Consider the following code:var a;What is the value of
a = a + 5;
a?', answer1: '5', answer1value: 'false', answer2: 'undefined', answer2value: 'false', answer3: 'NaN', answer3value: 'true', type: 'variables'});
23 | else
24 | questions.push({qDesc: 'Which is the correct way to increment the value of a variable a by 5?', answer1: 'a = a + 5;', answer1value: 'true', answer2: 'var a = a + 5;', answer2value: 'false', answer3: 'a = a + "5";', answer3value: 'false', type: 'variables'});
25 | questions.push({qDesc: 'Which is the correct way to decrement the value of a variable b by 8?', answer1: 'b = b - 8;', answer1value: 'true', answer2: 'var b = b - 8;', answer2value: 'false', answer3: 'b = b - "8";', answer3value: 'false', type: 'expressions'});
26 | questions.push({qDesc: 'Which of the following symbols is the multiplication operator?', answer1: '/', answer1value: 'false', answer2: '*', answer2value: 'true', answer3: '+', answer3value: 'false', type: 'expressions'});
27 | questions.push({qDesc: 'What is the result of the expression 2 + 5 * 10?', answer1: '70', answer1value: 'false', answer2: '52', answer2value: 'true', answer3: '25', answer3value: 'false', type: 'expressions'});
28 | questions.push({qDesc: 'What is the result of the expression 30/5 + 2?', answer1: '4', answer1value: 'false', answer2: '8', answer2value: 'true', answer3: '5', answer3value: 'false', type: 'expressions'});
29 | if(user['expressionsEntryStereotype'] >= 1100)
30 | questions.push({qDesc: 'What is the result of the expression 20 % 3?', answer1: '2', answer1value: 'true', answer2: '18', answer2value: 'false', answer3: '6', answer3value: 'false', type: 'expressions'});
31 | else
32 | questions.push({qDesc: 'What is the result of the expression 20 / 3?', answer1: '2', answer1value: 'false', answer2: '18', answer2value: 'false', answer3: '6', answer3value: 'true', type: 'expressions'});
33 | questions = shuffle(questions);
34 | var htmlToRender = '';
35 | for(var i = 0; i < questions.length; i++) {
36 | htmlToRender += generateQuestion(i+1, questions[i].qDesc, questions[i].answer1, questions[i].answer1value, questions[i].answer2, questions[i].answer2value, questions[i].answer3, questions[i].answer3value );
37 | }
38 | questionsElement.innerHTML = htmlToRender;
39 | }
40 |
41 | function generateQuestion(id, qDesc, answer1, answer1value, answer2, answer2value, answer3, answer3value){
42 | var htmlToRender = 'Bob', answer1value: 'false', answer2: '"Bob"', answer2value: 'true', answer3: '\'Bob"', answer3value: 'false', type: 'strings'});
18 | questions.push({qDesc: 'What is the .length of the following string literal?"Ludwig van Beethoven"', answer1: '18', answer1value: 'false', answer2: '19', answer2value: 'false', answer3: '20', answer3value: 'true', type: 'strings'}); 19 | questions.push({qDesc: 'Which of the following is the result of the following string concatenation?
"I love"+"JavaScript!"', answer1: '
"I love JavaScript!"', answer1value: 'false', answer2: '"I loveJavaScript!"', answer2value: 'true', answer3: '"I love+JavaScript!"', answer3value: 'false', type: 'strings'});
20 | questions.push({qDesc: 'What is the result of the expressions mySong[2] if mySong is equal to "Cherry Bomb"?', answer1: 'h', answer1value: 'false', answer2: 'e', answer2value: 'true', answer3: 'r', answer3value: 'false', type: 'strings'});
21 | if(user['stringsEntryStereotype'] >= 1300)
22 | questions.push({qDesc: 'What is the value of the variable id in the following code? var id = "15" + 31;', answer1: '
1531', answer1value: 'false', answer2: '"46"', answer2value: 'false', answer3: '"1531"', answer3value: 'true', type: 'strings'});
23 | else
24 | questions.push({qDesc: 'What is the result of the expressions myMovie[6] if mySong is equal to "Breakfast at Tiffany\'s"?', answer1: 'f', answer1value: 'false', answer2: 'a', answer2value: 'true', answer3: 's', answer3value: 'false', type: 'strings'});
25 | questions.push({qDesc: 'Which is the correct way to initialize an array person so that it contains the string Tom and the number 45?', answer1: 'var person = ["Tom",45];', answer1value: 'true', answer2: 'var person = [Tom,45];', answer2value: 'false', answer3: 'var person = ["Tom","45"];', answer3value: 'false', type: 'arrays'});
26 | questions.push({qDesc: 'What is the result of the expressions myArray[1] = "Beer" if myArray is equal to [2,4,2]?', answer1: '["Beer",4,2]', answer1value: 'false', answer2: '[2,"Beer",2]', answer2value: 'true', answer3: '[2,4,"Beer"]', answer3value: 'false', type: 'arrays'});
27 | questions.push({qDesc: 'Consider the following code:var myPun = ["I","scream","for","ice"];What does the array
myPun.push("cream");
myPun now equal to?', answer1: '["cream","I","scream","for","ice"]', answer1value: 'false', answer2: '["I","scream","for","ice","cream"]', answer2value: 'true', answer3: '["I","scream","for","cream"]', answer3value: 'false', type: 'arrays'});
28 | questions.push({qDesc: 'Consider the following code:var sequence = [1,11,21,1211,1221];What is the value of the variable
var oneDown = sequence.pop();
oneDown?', answer1: '1', answer1value: 'false', answer2: '1221', answer2value: 'true', answer3: '1211', answer3value: 'false', type: 'arrays'});
29 | if(user['arraysEntryStereotype'] >= 1250)
30 | questions.push({qDesc: 'Consider the following code:var numbers = [2,4,8].unshift(1);What is the value of the variable
numbers?', answer1: '[1,2,4,8]', answer1value: 'true', answer2: '[2,4,8,1]', answer2value: 'false', answer3: '[4,8]', answer3value: 'false', type: 'arrays'});
31 | else
32 | questions.push({qDesc: 'What is the result of the expressions myArray[3] = "Candy" if myArray is equal to [6,0,9]?', answer1: '[6,0,"Candy"]', answer1value: 'false', answer2: '[6,0,9,"Candy"]', answer2value: 'true', answer3: '[6,0,9]', answer3value: 'false', type: 'arrays'});
33 | questions = shuffle(questions);
34 | var htmlToRender = '';
35 | for(var i = 0; i < questions.length; i++) {
36 | htmlToRender += generateQuestion(i+1, questions[i].qDesc, questions[i].answer1, questions[i].answer1value, questions[i].answer2, questions[i].answer2value, questions[i].answer3, questions[i].answer3value );
37 | }
38 | questionsElement.innerHTML = htmlToRender;
39 | }
40 |
41 | function generateQuestion(id, qDesc, answer1, answer1value, answer2, answer2value, answer3, answer3value){
42 | var htmlToRender = '[ and ends with a closing square bracket ].';
41 | document.getElementById('question-0-message').className = 'failure';
42 | if(user['arraysMistakes'][questionId] == 0) {
43 | user['arraysMistakes'][questionId] = 1;
44 | user['stereotype'] -= 5;
45 | localStorage.setItem('learn-js-user', JSON.stringify(user));
46 | }
47 | }
48 | else if(userInput == 'no-comma'){
49 | document.getElementById('question-0-message').innerHTML = 'Between each array entry should be a comma.';
50 | document.getElementById('question-0-message').className = 'failure';
51 | if(user['arraysMistakes'][questionId] == 0) {
52 | user['arraysMistakes'][questionId] = 1;
53 | user['stereotype'] -= 5;
54 | localStorage.setItem('learn-js-user', JSON.stringify(user));
55 | }
56 | }
57 | else{
58 | document.getElementById('question-0-message').innerHTML = 'Correct!';
59 | document.getElementById('question-0-message').className = 'success';
60 | if(user['arraysMistakes'][questionId] == 0) {
61 | user['arraysMistakes'][questionId] = -1;
62 | localStorage.setItem('learn-js-user', JSON.stringify(user));
63 | }
64 | }
65 | }
66 | else if(questionId == 1){
67 | var userInput = document.querySelector('input[name="question-1"]:checked').value;
68 | if(user['arrays'] != 'completed'){
69 | user['arrays-question-1'] = userInput;
70 | localStorage.setItem('learn-js-user',JSON.stringify(user));
71 | }
72 | if(userInput == 'non-zero-indexed'){
73 | document.getElementById('question-1-message').innerHTML = 'Remember that Javascript uses zero-based indexing.';
74 | document.getElementById('question-1-message').className = 'failure';
75 | if(user['arraysMistakes'][questionId] == 0) {
76 | user['arraysMistakes'][questionId] = 1;
77 | user['stereotype'] -= 5;
78 | localStorage.setItem('learn-js-user', JSON.stringify(user));
79 | }
80 | }
81 | else{
82 | document.getElementById('question-1-message').innerHTML = 'Correct!';
83 | document.getElementById('question-1-message').className = 'success';
84 | if(user['arraysMistakes'][questionId] == 0) {
85 | user['arraysMistakes'][questionId] = -1;
86 | localStorage.setItem('learn-js-user', JSON.stringify(user));
87 | }
88 | }
89 | }
90 | else if(questionId == 2){
91 | var userInput = document.querySelector('input[name="question-2"]:checked').value;
92 | if(user['arrays'] != 'completed'){
93 | user['arrays-question-2'] = userInput;
94 | localStorage.setItem('learn-js-user',JSON.stringify(user));
95 | }
96 | if(userInput == 'beginning'){
97 | document.getElementById('question-2-message').innerHTML = 'The .push() function append data to the end of an array.';
98 | document.getElementById('question-2-message').className = 'failure';
99 | if(user['arraysMistakes'][questionId] == 0) {
100 | user['arraysMistakes'][questionId] = 1;
101 | user['stereotype'] -= 5;
102 | localStorage.setItem('learn-js-user', JSON.stringify(user));
103 | }
104 | }
105 | else{
106 | document.getElementById('question-2-message').innerHTML = 'Correct!';
107 | document.getElementById('question-2-message').className = 'success';
108 | if(user['arraysMistakes'][questionId] == 0) {
109 | user['arraysMistakes'][questionId] = -1;
110 | localStorage.setItem('learn-js-user', JSON.stringify(user));
111 | }
112 | }
113 | }
114 | if(questionId == 3){
115 | var userInput = document.querySelector('input[name="question-3"]:checked').value;
116 | if(user['arrays'] != 'completed'){
117 | user['arrays-question-3'] = userInput;
118 | localStorage.setItem('learn-js-user',JSON.stringify(user));
119 | }
120 | if(userInput == 'beginning'){
121 | document.getElementById('question-3-message').innerHTML = 'The .pop() function extracts the last element of an array.';
122 | document.getElementById('question-3-message').className = 'failure';
123 | if(user['arraysMistakes'][questionId] == 0) {
124 | user['arraysMistakes'][questionId] = 1;
125 | user['stereotype'] -= 5;
126 | localStorage.setItem('learn-js-user', JSON.stringify(user));
127 | }
128 | }
129 | else{
130 | document.getElementById('question-3-message').innerHTML = 'Correct!';
131 | document.getElementById('question-3-message').className = 'success';
132 | if(user['arraysMistakes'][questionId] == 0) {
133 | user['arraysMistakes'][questionId] = -1;
134 | localStorage.setItem('learn-js-user', JSON.stringify(user));
135 | }
136 | }
137 | }
138 | if(questionId == 4){
139 | var userInput = document.querySelector('input[name="question-4"]:checked').value;
140 | if(user['arrays'] != 'completed'){
141 | user['arrays-question-4'] = userInput;
142 | localStorage.setItem('learn-js-user',JSON.stringify(user));
143 | }
144 | if(userInput == 'not-shift'){
145 | document.getElementById('question-4-message').innerHTML = 'The .unshift() function inserts elements, instead of removing them.';
146 | document.getElementById('question-4-message').className = 'failure';
147 | if(user['arraysMistakes'][questionId] == 0) {
148 | user['arraysMistakes'][questionId] = 1;
149 | user['stereotype'] -= 5;
150 | localStorage.setItem('learn-js-user', JSON.stringify(user));
151 | }
152 | }
153 | if(userInput == 'not-at-end'){
154 | document.getElementById('question-4-message').innerHTML = 'The .unshift() function does not insert elements at the end of the array.';
155 | document.getElementById('question-4-message').className = 'failure';
156 | if(user['arraysMistakes'][questionId] == 0) {
157 | user['arraysMistakes'][questionId] = 1;
158 | user['stereotype'] -= 5;
159 | localStorage.setItem('learn-js-user', JSON.stringify(user));
160 | }
161 | }
162 | else{
163 | document.getElementById('question-4-message').innerHTML = 'Correct!';
164 | document.getElementById('question-4-message').className = 'success';
165 | user['arraysEntryStereotype'] = user['stereotype'];
166 | localStorage.setItem('learn-js-user', JSON.stringify(user));
167 | if(user['arraysMistakes'][questionId] == 0) {
168 | user['arraysMistakes'][questionId] = -1;
169 | localStorage.setItem('learn-js-user', JSON.stringify(user));
170 | }
171 | }
172 | }
173 | if(typeof user['arrays-question-0'] !== 'undefined' && typeof user['arrays-question-1'] !== 'undefined'
174 | && typeof user['arrays-question-2'] !== 'undefined' && typeof user['arrays-question-3'] !== 'undefined' &&
175 | (typeof user['arrays-question-4'] !== 'undefined' || user['arraysEntryStereotype'] < 1250) )
176 | if(user['arrays-question-0'] == 'true' && user['arrays-question-1'] == 'true'
177 | && user['arrays-question-2'] == 'true' && user['arrays-question-3'] == 'true'&&
178 | (user['arrays-question-4'] == 'true' || user['arraysEntryStereotype'] < 1250) ) {
179 | if(user['arrays'] != 'completed') user['stereotype'] += 50;
180 | user['arrays'] = 'completed';
181 | if(user['conditionals'] == 'restricted')
182 | user['conditionals'] = 'available';
183 | localStorage.setItem('learn-js-user',JSON.stringify(user));
184 | }
185 | }
186 |
--------------------------------------------------------------------------------
/chapter3.js:
--------------------------------------------------------------------------------
1 | document.addEventListener('DOMContentLoaded', function(event){
2 | // Check if saved info, otherwise administer test
3 | if (localStorage.getItem('learn-js-user') === null){
4 | window.location="./index.html";
5 | }
6 | else {
7 | user = JSON.parse(localStorage.getItem('learn-js-user'));
8 | }
9 | generateQuestions();
10 | });
11 |
12 | var user = {};
13 | var questions = [];
14 | function generateQuestions(){
15 | var questionsElement = document.getElementById('questions');
16 | var q1Num = Math.floor(Math.random() * 20);
17 | questions.push({qDesc: 'What is the value of num after the following code is executed?num = 5;', answer1: '
if(num > 5) {
num = num + 1;
}
if(num < 6) {
num = num - 1;
}
6', answer1value: 'false', answer2: '4', answer2value: 'true', answer3: '5', answer3value: 'false', type: 'conditionals'});
18 | questions.push({qDesc: 'Consider the following code:if ("fun" == 0) {
console.log("I don\'t know!");
} else if ("fun" == "fun") {
console.log("Piña colada");
} else {
console.log("People are strange!");
} What will be printed to the console?', answer1: 'I don\'t know!', answer1value: 'false', answer2: 'People are strange!', answer2value: 'false', answer3: 'Piña colada', answer3value: 'true', type: 'conditionals'});
19 | questions.push({qDesc: 'Consider the following switch statment:switch(val) {
case 1:
console.log("alpha");
break;
case 2:
console.log("beta");
break;
case 3:
console.log("gamma");
break;
} If val = 2 , what will be printed to the console?', answer1: 'alpha', answer1value: 'false', answer2: 'beta', answer2value: 'true', answer3: 'gamma', answer3value: 'false', type: 'conditionals'});
20 | questions.push({qDesc: 'Consider the following code. If today is neither Saturday nor Sunday, what will be printed to the console?switch (day) {
case 6:
console.log("Today is Saturday");
break;
case 0:
console.log("Today is Sunday");
break;
default:
console.log("Looking forward to the Weekend");
}', answer1: '"Today is Saturday"', answer1value: 'false', answer2: '"Looking forward to the Weekend"', answer2value: 'true', answer3: '"Today is Sunday"', answer3value: 'false', type: 'conditionals'});
21 | if(user['conditionalsEntryStereotype'] >= 1350)
22 | questions.push({qDesc: 'Consider the following code:var title = (married)?"Mrs":"Ms";What is the value of
title if the value of married is false?', answer1: '"Mrs"', answer1value: 'false', answer2: 'false', answer2value: 'false', answer3: '"Ms"', answer3value: 'true', type: 'conditionals'});
23 | else
24 | questions.push({qDesc: 'What will be printed to the console?bus = 5;', answer1: '
if (bus < 3 || bus > 6 && bus < 8) {
console.log("Take the bus!");
} else if (bus > 8) {
console.log("Too late!");
} else {
console.log("Stay put!");
}
"Take the bus!"', answer1value: 'false', answer2: '"Stay put!"', answer2value: 'true', answer3: '"Too late!"', answer3value: 'false', type: 'conditionals'});
25 | questions.push({qDesc: 'Which of the following is the end condition for this for loop? for (var condition = 0; condition < 5; condition ++) {
return condition;
}', answer1: 'condition < 5', answer1value: 'true', answer2: 'condition = 0', answer2value: 'false', answer3: 'condition ++', answer3value: 'false', type: 'loops'});
26 | questions.push({qDesc: 'Consider the following code. After the loop stops executing what does the array workDays equal to ?var workDays = [];', answer1: '
for (var i = 1; i < 6; i++) {
myArray.push(i);
}
[1,2,3,4,5,6]', answer1value: 'false', answer2: '[1,2,3,4,5]', answer2value: 'true', answer3: '[0,1,2,3,4,5]', answer3value: 'false', type: 'loops'});
27 | questions.push({qDesc: 'Given the following code, what value does the variable total hold?var myArr = [0, 1, 2, 3, 4, 5];', answer1: '
var total = 0;
for (var i = 0; i < 5; i++) {
total += myArr[i];
}
"012345"', answer1value: 'false', answer2: '10', answer2value: 'true', answer3: '15', answer3value: 'false', type: 'loops'});
28 | questions.push({qDesc: 'Consider the following code. After the loop stops executing what does the array myArray equal to ?var myArray = ["Simple","as"];', answer1: '
var i = 1;
while(i < 4) {
myArray.push(i);
i++;
}
["Simple","as",1,2,3,4]', answer1value: 'false', answer2: '["Simple","as",1,2,3]', answer2value: 'true', answer3: '[1,2,3]', answer3value: 'false', type: 'loops'});
29 | if(user['loopsEntryStereotype'] >= 1400)
30 | questions.push({qDesc: 'Consider the following code:var x = 0;How many times will
do {
if (x == 0) x = 5; else x = 0;
console.log("Looping");
} while(x > 0);
Looping will be printed?', answer1: '2', answer1value: 'true', answer2: '0', answer2value: 'false', answer3: '1', answer3value: 'false', type: 'loops'});
31 | else
32 | questions.push({qDesc: 'Consider the following code:var x = 0;How many times will
while(x > 0){
if (x == 0) x = 5; else x = 0;
console.log("Looping");
}
Looping will be printed?', answer1: '2', answer1value: 'false', answer2: '0', answer2value: 'true', answer3: '1', answer3value: 'false', type: 'loops'});
33 | questions = shuffle(questions);
34 | var htmlToRender = '';
35 | for(var i = 0; i < questions.length; i++) {
36 | htmlToRender += generateQuestion(i+1, questions[i].qDesc, questions[i].answer1, questions[i].answer1value, questions[i].answer2, questions[i].answer2value, questions[i].answer3, questions[i].answer3value );
37 | }
38 | questionsElement.innerHTML = htmlToRender;
39 | }
40 |
41 | function generateQuestion(id, qDesc, answer1, answer1value, answer2, answer2value, answer3, answer3value){
42 | var htmlToRender = 'Variables allow computers to label and store data, while their labels can be used similarly to the x and y variables you use in mathematics. The only difference between computer and mathematical variables is that computer variables can store any of the seven data types, not just numbers.
var keyword.';
52 | document.getElementById('question-0-message').className = 'failure';
53 | }
54 | else if(!inputValues.definedName){
55 | document.getElementById('question-0-message').innerHTML = 'You need to define a variable named myVar.';
56 | document.getElementById('question-0-message').className = 'failure';
57 | }
58 | else if(!inputValues.usedSemicolon){
59 | document.getElementById('question-0-message').innerHTML = 'Your variable definition should be followed by a ;.';
60 | document.getElementById('question-0-message').className = 'failure';
61 | }
62 | else if(!inputValues.nameAfterVar){
63 | document.getElementById('question-0-message').innerHTML = 'Your variable\'s name should be after the var keyword.';
64 | document.getElementById('question-0-message').className = 'failure';
65 | }
66 | else if(!inputValues.semicolonAfterName){
67 | document.getElementById('question-0-message').innerHTML = 'You should put the ; at the end of the variable definition.';
68 | document.getElementById('question-0-message').className = 'failure';
69 | }
70 | else{
71 | document.getElementById('question-0-message').innerHTML = 'Correct!';
72 | document.getElementById('question-0-message').className = 'success';
73 | user['variables-question-0'] = 'true';
74 | localStorage.setItem('learn-js-user',JSON.stringify(user));
75 | }
76 | }
77 | else if(questionId == 1){
78 | var userInput = document.querySelector('input[name="question-1"]:checked').value;
79 | if(user['variables'] != 'completed'){
80 | user['variables-question-1'] = userInput;
81 | localStorage.setItem('learn-js-user',JSON.stringify(user));
82 | }
83 | if(userInput == 'assign-not-initialize'){
84 | document.getElementById('question-1-message').innerHTML = 'You should assign a value to myNum, not initialize the variable.';
85 | document.getElementById('question-1-message').className = 'failure';
86 | }
87 | else if(userInput == 'not-a-number'){
88 | document.getElementById('question-1-message').innerHTML = 'The value of myNum should be a number.';
89 | document.getElementById('question-1-message').className = 'failure';
90 | }
91 | else{
92 | document.getElementById('question-1-message').innerHTML = 'Correct!';
93 | document.getElementById('question-1-message').className = 'success';
94 | }
95 | }
96 | else if(questionId == 2){
97 | var userInput = document.querySelector('input[name="question-2"]:checked').value;
98 | if(user['variables'] != 'completed'){
99 | user['variables-question-2'] = userInput;
100 | localStorage.setItem('learn-js-user',JSON.stringify(user));
101 | }
102 | if(userInput == 'reverse'){
103 | document.getElementById('question-2-message').innerHTML = 'You should assign the value of a to b, not the other way around.';
104 | document.getElementById('question-2-message').className = 'failure';
105 | }
106 | else{
107 | document.getElementById('question-2-message').innerHTML = 'Correct!';
108 | document.getElementById('question-2-message').className = 'success';
109 | }
110 | }
111 | else if(questionId == 3){
112 | var userInput = document.querySelector('input[name="question-3"]:checked').value;
113 | if(user['variables'] != 'completed'){
114 | user['variables-question-3'] = userInput;
115 | localStorage.setItem('learn-js-user',JSON.stringify(user));
116 | }
117 | if(userInput == 'initialize-not-assign'){
118 | document.getElementById('question-3-message').innerHTML = 'You should initialize the variable myCat, not just assign a value to it.';
119 | document.getElementById('question-3-message').className = 'failure';
120 | }
121 | else if(userInput == 'not-a-string'){
122 | document.getElementById('question-3-message').innerHTML = 'The value of myCat should be a string.';
123 | document.getElementById('question-3-message').className = 'failure';
124 | }
125 | else{
126 | document.getElementById('question-3-message').innerHTML = 'Correct!';
127 | document.getElementById('question-3-message').className = 'success';
128 | }
129 | }
130 | else if(questionId == 4){
131 | var userInput = document.querySelector('input[name="question-4"]:checked').value;
132 | if(user['variables'] != 'completed'){
133 | user['variables-question-3'] = userInput;
134 | localStorage.setItem('learn-js-user',JSON.stringify(user));
135 | }
136 | if(userInput == 'initialize-not-assign'){
137 | document.getElementById('question-4-message').innerHTML = 'You should initialize the variable myDog, not just assign a value to it.';
138 | document.getElementById('question-4-message').className = 'failure';
139 | }
140 | else if(userInput == 'not-a-string'){
141 | document.getElementById('question-4-message').innerHTML = 'The value of myDog should be a string.';
142 | document.getElementById('question-4-message').className = 'failure';
143 | }
144 | else{
145 | document.getElementById('question-4-message').innerHTML = 'Correct!';
146 | document.getElementById('question-4-message').className = 'success';
147 | }
148 | }
149 | else if(questionId == 5){
150 | var userInput = document.querySelector('input[name="question-5"]:checked').value;
151 | if(user['variables'] != 'completed'){
152 | user['variables-question-5'] = userInput;
153 | localStorage.setItem('learn-js-user',JSON.stringify(user));
154 | }
155 | if(userInput == 'not-nan'){
156 | document.getElementById('question-5-message').innerHTML = 'No mathematical operation is applied on variable a.';
157 | document.getElementById('question-5-message').className = 'failure';
158 | }
159 | else if(userInput == 'not-zero'){
160 | document.getElementById('question-5-message').innerHTML = 'Variable a is not explicitly assigned a value of zero.';
161 | document.getElementById('question-5-message').className = 'failure';
162 | }
163 | else{
164 | document.getElementById('question-5-message').innerHTML = 'Correct!';
165 | document.getElementById('question-5-message').className = 'success';
166 | user['variablesEntryStereotype'] = user['stereotype'];
167 | localStorage.setItem('learn-js-user', JSON.stringify(user));
168 | }
169 | }
170 | if(typeof user['variables-question-0'] !== 'undefined' && typeof user['variables-question-1'] !== 'undefined'
171 | && typeof user['variables-question-2'] !== 'undefined' && typeof user['variables-question-3'] !== 'undefined' &&
172 | (typeof user['variables-question-5'] !== 'undefined' || user['variablesEntryStereotype'] < 1250) )
173 | if(user['variables-question-0'] == 'true' && user['variables-question-1'] == 'true'
174 | && user['variables-question-2'] == 'true' && user['variables-question-3'] == 'true' &&
175 | (user['variables-question-5'] == 'true' || user['variablesEntryStereotype'] < 1250) ) {
176 | if(user['variables'] != 'completed') user['stereotype'] += 100;
177 | user['variables'] = 'completed';
178 | if(user['expressions'] == 'restricted')
179 | user['expressions'] = 'available';
180 | localStorage.setItem('learn-js-user',JSON.stringify(user));
181 | }
182 | }
183 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Hello and welcome to Learn Javascript, the interactive Javascript lessons that adapt to your personality and learning style to better teach you Javascript.
25 |Before we can begin, we would like to ask you some questions in order to customize your learning environment for you. Remember to only answer questions that you know the answers to, otherwise press I don't know.
Number is a data type in JavaScript which represents numeric data. Now let's try to add two numbers using JavaScript.
35 |JavaScript uses the + symbol as addition operation when placed between two numbers.
myVar = 5 + 10; // assigned 1537 |
We can also subtract one number from another. JavaScript uses the - symbol for subtraction.
myVar = 12 - 6; // assigned 639 |
We can also multiply one number by another. JavaScript uses the * symbol for multiplication of two numbers.
myVar = 13 * 13; // assigned 16941 |
We can also divide one number by another. JavaScript uses the / symbol for division.
myVar = 16 / 2; // assigned 843 |
In JavaScript, you can also get the remainder (or modulo) of an integer division using the % symbol.
myVar = 11 % 2; // assigned 148 |
Please, take the time to read the lesson, before you answer these questions.
63 |i from 1 up to (but not including) 6';
85 | document.getElementById('question-1-message').className = 'failure';
86 | if(user['loopsMistakes'][questionId] == 0) {
87 | user['loopsMistakes'][questionId] = 1;
88 | user['stereotype'] -= 5;
89 | localStorage.setItem('learn-js-user', JSON.stringify(user));
90 | }
91 | }
92 | else if(userInput == 'iValue'){
93 | document.getElementById('question-1-message').innerHTML = 'The loop variable i is initialized to start at 1.';
94 | document.getElementById('question-1-message').className = 'failure';
95 | if(user['loopsMistakes'][questionId] == 0) {
96 | user['loopsMistakes'][questionId] = 1;
97 | user['stereotype'] -= 5;
98 | localStorage.setItem('learn-js-user', JSON.stringify(user));
99 | }
100 | }
101 | else{
102 | document.getElementById('question-1-message').innerHTML = 'Correct!';
103 | document.getElementById('question-1-message').className = 'success';
104 | if(user['loopsMistakes'][questionId] == 0) {
105 | user['loopsMistakes'][questionId] = -1;
106 | localStorage.setItem('learn-js-user', JSON.stringify(user));
107 | }
108 | }
109 | }
110 | else if(questionId == 2){
111 | var userInput = document.getElementById('question-2').value;
112 | if(user['loops'] != 'completed'){
113 | user['loops-question-2'] = userInput;
114 | localStorage.setItem('learn-js-user',JSON.stringify(user));
115 | }
116 | if(userInput < 10 || userInput > 10 && userInput != 15){
117 | document.getElementById('question-2-message').innerHTML = 'The loop stop executing when i = 5';
118 | document.getElementById('question-2-message').className = 'failure';
119 | if(user['loopsMistakes'][questionId] == 0) {
120 | user['loopsMistakes'][questionId] = 1;
121 | user['stereotype'] -= 5;
122 | localStorage.setItem('learn-js-user', JSON.stringify(user));
123 | }
124 | }
125 | else if(userInput == 15){
126 | document.getElementById('question-2-message').innerHTML = 'The loop runs for i from 0 up to (but not including) 5';
127 | document.getElementById('question-2-message').className = 'failure';
128 | if(user['loopsMistakes'][questionId] == 0) {
129 | user['loopsMistakes'][questionId] = 1;
130 | user['stereotype'] -= 5;
131 | localStorage.setItem('learn-js-user', JSON.stringify(user));
132 | }
133 | }
134 | else{
135 | document.getElementById('question-2-message').innerHTML = 'Correct!';
136 | document.getElementById('question-2-message').className = 'success';
137 | if(user['loopsMistakes'][questionId] == 0) {
138 | user['loopsMistakes'][questionId] = -1;
139 | localStorage.setItem('learn-js-user', JSON.stringify(user));
140 | }
141 | if(user['loops'] != 'completed'){
142 | user['loops-question-2'] = 'true';
143 | localStorage.setItem('learn-js-user',JSON.stringify(user));
144 | }
145 | }
146 | }
147 | else if(questionId == 3){
148 | var userInput = document.querySelector('input[name="question-3"]:checked').value;
149 | if(user['loops'] != 'completed'){
150 | user['loops-question-3'] = userInput;
151 | localStorage.setItem('learn-js-user',JSON.stringify(user));
152 | }
153 | if(userInput == 'iteration'){
154 | document.getElementById('question-3-message').innerHTML = 'The loop runs for i from 1 up to (but not including) 4';
155 | document.getElementById('question-3-message').className = 'failure';
156 | if(user['loopsMistakes'][questionId] == 0) {
157 | user['loopsMistakes'][questionId] = 1;
158 | user['stereotype'] -= 5;
159 | localStorage.setItem('learn-js-user', JSON.stringify(user));
160 | }
161 | }
162 | else if(userInput == 'append'){
163 | document.getElementById('question-3-message').innerHTML = 'Remember that the .push() function appends data to the end of an array';
164 | document.getElementById('question-3-message').className = 'failure';
165 | if(user['loopsMistakes'][questionId] == 0) {
166 | user['loopsMistakes'][questionId] = 1;
167 | user['stereotype'] -= 5;
168 | localStorage.setItem('learn-js-user', JSON.stringify(user));
169 | }
170 | }
171 | else{
172 | document.getElementById('question-3-message').innerHTML = 'Correct!';
173 | document.getElementById('question-3-message').className = 'success';
174 | user['loopsEntryStereotype'] = user['stereotype'];
175 | localStorage.setItem('learn-js-user', JSON.stringify(user));
176 | if(user['loopsMistakes'][questionId] == 0) {
177 | user['loopsMistakes'][questionId] = -1;
178 | localStorage.setItem('learn-js-user', JSON.stringify(user));
179 | }
180 | }
181 | }
182 |
183 | else if(questionId == 4){
184 | var userInput = document.querySelector('input[name="question-4"]:checked').value;
185 | if(user['loops'] != 'completed'){
186 | user['loops-question-4'] = userInput;
187 | localStorage.setItem('learn-js-user',JSON.stringify(user));
188 | }
189 | if(userInput == 'condition-at-end'){
190 | document.getElementById('question-4-message').innerHTML = 'Remember that the condition is evaluated at the end of the loop, after the code inside the loop is executed.';
191 | document.getElementById('question-4-message').className = 'failure';
192 | if(user['loopsMistakes'][questionId] == 0) {
193 | user['loopsMistakes'][questionId] = 1;
194 | user['stereotype'] -= 5;
195 | localStorage.setItem('learn-js-user', JSON.stringify(user));
196 | }
197 | }
198 | else{
199 | document.getElementById('question-4-message').innerHTML = 'Correct!';
200 | document.getElementById('question-4-message').className = 'success';
201 | if(user['loopsMistakes'][questionId] == 0) {
202 | user['loopsMistakes'][questionId] = -1;
203 | localStorage.setItem('learn-js-user', JSON.stringify(user));
204 | }
205 | }
206 | }
207 | if(typeof user['loops-question-0'] !== 'undefined' && typeof user['loops-question-1'] !== 'undefined'
208 | && typeof user['loops-question-2'] !== 'undefined' && typeof user['loops-question-3'] !== 'undefined' &&
209 | (typeof user['loops-question-4'] !== 'undefined' || user['loopsEntryStereotype'] < 1400) )
210 | if(user['loops-question-0'] == 'true' && user['loops-question-1'] == 'true'
211 | && user['loops-question-2'] == 'true' && user['loops-question-3'] == 'true'&&
212 | (user['loops-question-4'] == 'true' || user['loopsEntryStereotype'] < 1400) ) {
213 | user['loops'] = 'completed';
214 | if(user['loops'] != 'completed') user['stereotype'] += 50;
215 | // if(user['expressions'] == 'restricted')
216 | // user['expressions'] = 'available';
217 | localStorage.setItem('learn-js-user',JSON.stringify(user));
218 | }
219 | }
220 |
--------------------------------------------------------------------------------
/3_strings.js:
--------------------------------------------------------------------------------
1 | document.addEventListener('DOMContentLoaded', function(event){
2 | // Check if saved info, otherwise administer test
3 | if (localStorage.getItem('learn-js-user') === null){
4 | window.location="./index.html";
5 | }
6 | else {
7 | user = JSON.parse(localStorage.getItem('learn-js-user'));
8 | if(user['stringsEntryStereotype'] < 0){
9 | user['stringsEntryStereotype'] = user['stereotype'];
10 | localStorage.setItem('learn-js-user',JSON.stringify(user));
11 | }
12 | if (user['stringsEntryStereotype'] >= 1300 || user['stereotype'] >= 1300 || user['chapter2Score'] > 60)
13 | document.getElementsByTagName('style')[0].innerHTML += 'div.advanced-1300{ display: block;}';
14 | if(user['animal'] == 'cat'){
15 | document.getElementById('cat-question').className = 'card fluid rounded';
16 | document.getElementById('dog-question').className = 'card fluid rounded hidden';
17 | }
18 | if (user['videos'] == 'yes')
19 | document.getElementsByTagName('style')[0].innerHTML += 'div.videos-further{ display: block;}';
20 | if (user['desiredJsKnowledge'] == 'full' || user['desiredProgrammingKnowledge'] == 'full')
21 | document.getElementsByTagName('style')[0].innerHTML += 'div.read-further{ display: block;}';
22 | if (user['desiredJsKnowledge'] == 'full')
23 | document.getElementsByTagName('style')[0].innerHTML += 'li.js-further{ display: list-item;}';
24 | if (user['desiredProgrammingKnowledge'] == 'full')
25 | document.getElementsByTagName('style')[0].innerHTML += 'li.programming-further{ display: list-item;}';
26 | if (user['desiredJsKnowledge'] == 'full' && user['desiredProgrammingKnowledge'] == 'full')
27 | document.getElementsByTagName('style')[0].innerHTML += 'li.js-p-further{ display: list-item;}';
28 | }
29 | window.setTimeout(function(){
30 | if(user['strings'] == 'available' || user['strings'] == 'restricted')
31 | user['strings'] = 'seen';
32 | localStorage.setItem('learn-js-user',JSON.stringify(user));
33 | },5000);
34 | });
35 |
36 | user = {};
37 |
38 | function checkQuestion(questionId){
39 | if(questionId == 0){
40 | var userInput = document.querySelector('input[name="question-0"]:checked').value;
41 | if(user['strings'] != 'completed'){
42 | user['strings-question-0'] = userInput;
43 | localStorage.setItem('learn-js-user',JSON.stringify(user));
44 | }
45 | if(userInput == 'false'){
46 | document.getElementById('question-0-message').innerHTML = 'Remember that a string literal is a series of zero or more characters enclosed in single or double quotes.';
47 | document.getElementById('question-0-message').className = 'failure';
48 | if(user['stringsMistakes'][questionId] == 0) {
49 | user['stringsMistakes'][questionId] = 1;
50 | user['stereotype'] -= 5;
51 | localStorage.setItem('learn-js-user', JSON.stringify(user));
52 | }
53 | }
54 | else{
55 | document.getElementById('question-0-message').innerHTML = 'Correct!';
56 | document.getElementById('question-0-message').className = 'success';
57 | if(user['stringsMistakes'][questionId] == 0) {
58 | user['stringsMistakes'][questionId] = -1;
59 | localStorage.setItem('learn-js-user', JSON.stringify(user));
60 | }
61 | }
62 | }
63 | else if(questionId == 1){
64 | var userInput = document.getElementById('question-1').value;
65 | if(user['strings'] != 'completed'){
66 | user['strings-question-1'] = userInput;
67 | localStorage.setItem('learn-js-user',JSON.stringify(user));
68 | }
69 | if(userInput < 14 || userInput > 17 || userInput == 16){
70 | document.getElementById('question-1-message').innerHTML = 'The .length of a string is the number of characters in the string.';
71 | document.getElementById('question-1-message').className = 'failure';
72 | if(user['stringsMistakes'][questionId] == 0) {
73 | user['stringsMistakes'][questionId] = 1;
74 | user['stereotype'] -= 5;
75 | localStorage.setItem('learn-js-user', JSON.stringify(user));
76 | }
77 | }
78 | else if(userInput == 14){
79 | document.getElementById('question-1-message').innerHTML = 'The .length of a string is not zero-indexed.';
80 | document.getElementById('question-1-message').className = 'failure';
81 | if(user['stringsMistakes'][questionId] == 0) {
82 | user['stringsMistakes'][questionId] = 1;
83 | user['stereotype'] -= 5;
84 | localStorage.setItem('learn-js-user', JSON.stringify(user));
85 | }
86 | }
87 | else if(userInput == 17){
88 | document.getElementById('question-1-message').innerHTML = 'The .length of a string doesn\'t take quotations into account.';
89 | document.getElementById('question-1-message').className = 'failure';
90 | if(user['stringsMistakes'][questionId] == 0) {
91 | user['stringsMistakes'][questionId] = 1;
92 | user['stereotype'] -= 5;
93 | localStorage.setItem('learn-js-user', JSON.stringify(user));
94 | }
95 | }
96 | else{
97 | document.getElementById('question-1-message').innerHTML = 'Correct!';
98 | document.getElementById('question-1-message').className = 'success';
99 | if(user['strings'] != 'completed'){
100 | user['strings-question-1'] = 'true';
101 | localStorage.setItem('learn-js-user',JSON.stringify(user));
102 | if(user['stringsMistakes'][questionId] == 0) {
103 | user['stringsMistakes'][questionId] = -1;
104 | localStorage.setItem('learn-js-user', JSON.stringify(user));
105 | }
106 | }
107 | }
108 | }
109 | else if(questionId == 2){
110 | var userInput = document.querySelector('input[name="question-2"]:checked').value;
111 | if(user['strings'] != 'completed'){
112 | user['strings-question-2'] = userInput;
113 | localStorage.setItem('learn-js-user',JSON.stringify(user));
114 | }
115 | if(userInput == 'spaced'){
116 | document.getElementById('question-2-message').innerHTML = 'Remember that string concatenation doesn\'t add spaces between concatenated strings.';
117 | document.getElementById('question-2-message').className = 'failure';
118 | if(user['stringsMistakes'][questionId] == 0) {
119 | user['stringsMistakes'][questionId] = 1;
120 | user['stereotype'] -= 5;
121 | localStorage.setItem('learn-js-user', JSON.stringify(user));
122 | }
123 | }
124 | else{
125 | document.getElementById('question-2-message').innerHTML = 'Correct!';
126 | document.getElementById('question-2-message').className = 'success';
127 | if(user['stringsMistakes'][questionId] == 0) {
128 | user['stringsMistakes'][questionId] = -1;
129 | localStorage.setItem('learn-js-user', JSON.stringify(user));
130 | }
131 | }
132 | }
133 | else if(questionId == 3){
134 | var userInput = document.querySelector('input[name="question-3"]:checked').value;
135 | if(user['strings'] != 'completed'){
136 | user['strings-question-3'] = userInput;
137 | localStorage.setItem('learn-js-user',JSON.stringify(user));
138 | }
139 | if(userInput == 'non-zero-indexed'){
140 | document.getElementById('question-3-message').innerHTML = 'Remember that Javascript used zero-based indexing.';
141 | document.getElementById('question-3-message').className = 'failure';
142 | if(user['stringsMistakes'][3] == 0) {
143 | user['stringsMistakes'][3] = 1;
144 | user['stereotype'] -= 5;
145 | localStorage.setItem('learn-js-user', JSON.stringify(user));
146 | }
147 | }
148 | else{
149 | document.getElementById('question-3-message').innerHTML = 'Correct!';
150 | document.getElementById('question-3-message').className = 'success';
151 | if(user['stringsMistakes'][3] == 0) {
152 | user['stringsMistakes'][3] = -1;
153 | localStorage.setItem('learn-js-user', JSON.stringify(user));
154 | }
155 | }
156 | }
157 | else if(questionId == 4){
158 | var userInput = document.querySelector('input[name="question-4"]:checked').value;
159 | if(user['strings'] != 'completed'){
160 | user['strings-question-3'] = userInput;
161 | localStorage.setItem('learn-js-user',JSON.stringify(user));
162 | }
163 | if(userInput == 'non-zero-indexed'){
164 | document.getElementById('question-4-message').innerHTML = 'Remember that Javascript used zero-based indexing.';
165 | document.getElementById('question-4-message').className = 'failure';
166 | if(user['stringsMistakes'][3] == 0) {
167 | user['stringsMistakes'][3] = 1;
168 | user['stereotype'] -= 5;
169 | localStorage.setItem('learn-js-user', JSON.stringify(user));
170 | }
171 | }
172 | else{
173 | document.getElementById('question-4-message').innerHTML = 'Correct!';
174 | document.getElementById('question-4-message').className = 'success';
175 | if(user['stringsMistakes'][3] == 0) {
176 | user['stringsMistakes'][3] = -1;
177 | localStorage.setItem('learn-js-user', JSON.stringify(user));
178 | }
179 | }
180 | }
181 | else if(questionId == 5){
182 | var userInput = document.querySelector('input[name="question-5"]:checked').value;
183 | if(user['strings'] != 'completed'){
184 | user['strings-question-4'] = userInput;
185 | localStorage.setItem('learn-js-user',JSON.stringify(user));
186 | }
187 | if(userInput == 'not-addition'){
188 | document.getElementById('question-5-message').innerHTML = 'Using the + operator on a string and a numeric variable performs concatenation, not addition.';
189 | document.getElementById('question-5-message').className = 'failure';
190 | if(user['stringsMistakes'][4] == 0) {
191 | user['stringsMistakes'][4] = 1;
192 | user['stereotype'] -= 5;
193 | localStorage.setItem('learn-js-user', JSON.stringify(user));
194 | }
195 | }
196 | if(userInput == 'not-a-number'){
197 | document.getElementById('question-5-message').innerHTML = 'The result of a concatenation between a string and a numeric variable is not a number.';
198 | document.getElementById('question-5-message').className = 'failure';
199 | if(user['stringsMistakes'][4] == 0) {
200 | user['stringsMistakes'][4] = 1;
201 | user['stereotype'] -= 5;
202 | localStorage.setItem('learn-js-user', JSON.stringify(user));
203 | }
204 | }
205 | else{
206 | document.getElementById('question-5-message').innerHTML = 'Correct!';
207 | document.getElementById('question-5-message').className = 'success';
208 | user['stringsEntryStereotype'] = user['stereotype'];
209 | localStorage.setItem('learn-js-user', JSON.stringify(user));
210 | if(user['stringsMistakes'][4] == 0) {
211 | user['stringsMistakes'][4] = -1;
212 | localStorage.setItem('learn-js-user', JSON.stringify(user));
213 | }
214 | }
215 | }
216 | if(typeof user['strings-question-0'] !== 'undefined' && typeof user['strings-question-1'] !== 'undefined'
217 | && typeof user['strings-question-2'] !== 'undefined' && typeof user['strings-question-3'] !== 'undefined' &&
218 | (typeof user['strings-question-4'] !== 'undefined' || user['stringsEntryStereotype'] < 1300) )
219 | if(user['strings-question-0'] == 'true' && user['strings-question-1'] == 'true'
220 | && user['strings-question-2'] == 'true' && user['strings-question-3'] == 'true'&&
221 | (user['strings-question-4'] == 'true' || user['stringsEntryStereotype'] < 1300) ) {
222 | if(user['strings'] != 'completed') user['stereotype'] += 50;
223 | user['strings'] = 'completed';
224 | if(user['arrays'] == 'restricted')
225 | user['arrays'] = 'available';
226 | localStorage.setItem('learn-js-user',JSON.stringify(user));
227 | }
228 | }
229 |
--------------------------------------------------------------------------------
/3_strings.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Previously we have used the following code:
35 |var myName = "your name";36 |
"your name" is called a string literal. It is a string because it is a series of zero or more characters enclosed in single or double quotes.
In JavaScript, when the + operator is used with a String value, it is called the concatenation operator. You can build a new string out of other strings by concatenating them together. For example:
'My name is Alan,' + ' I concatenate.'42 |
Remember to watch out for spaces. Concatenation does not add spaces between concatenated strings, so you'll need to add them yourself.
43 |You can find the length of a String value by writing .length after the string variable or string literal.
"Alan Peter".length; // 1048 |
For example, if we created a variable var firstName = "Charles", we could find out how long the string "Charles" is by using the firstName.length property.
Bracket notation is a way to get a character at a specific index within a string.
53 |Most modern programming languages, like JavaScript, don't start counting at 1 like humans do. They start at 0. This is referred to as zero-based indexing.
For example, the character at index 0 in the word "Charles" is "C". So if var firstName = "Charles", you can get the value of the first letter of the string by using firstName[0].
You can also use bracket notation to get the character at other positions within a string. For example:
56 |"Charles"[2] // "a"57 |
Apart from concatenating two strings, you can also concatenate a string with any other type of variable For example:
61 |var age = 25; 62 | var ageString = "I am " + age + " years old.";63 |
Please, take the time to read the lesson, before you answer these questions.
85 |In computer science, data is anything that is meaningful to the computer. JavaScript provides seven different data types which are undefined, null, boolean, string, symbol, number, and object.
For example, computers distinguish between numbers, such as the number 12, and strings, such as "12", "dog", or "123 cats", which are collections of characters. Computers can perform mathematical operations on a number, but not on a string.
Variables allow computers to store and manipulate data in a dynamic fashion. They do this by using a label to point to the data rather than using the data itself. Any of the seven data types may be stored in a variable.
38 |Variables are similar to the x and y variables you use in mathematics, which means they're a simple name to represent the data we want to refer to. Computer variables differ from mathematical variables in that they can store different values at different times.
We tell JavaScript to create or declare a variable by putting the keyword var in front of it, like so:
var ourName;42 |
The above code creates a variable called ourName. In JavaScript we end statements with semicolons.
Variable names can be made up of numbers, letters, and $ or _, but may not contain spaces or start with a number.
In JavaScript, you can store a value in a variable with the assignment operator.
48 |myVariable = 5;49 |
The above code assigns the Number value 5 to myVariable.
Assignment always goes from right to left. Everything to the right of the = operator is resolved before the value is assigned to the variable to the left of the operator.
myVar = 5; 52 | myNum = myVar;53 |
The above code assigns 5 to myVar and then resolves myVar to 5 again and assigns it to myNum.
It is common to initialize a variable to an initial value in the same line as it is declared.
58 |var myVar = 0;59 |
The above code creates a new variable called myVar and assigns it an initial value of 0.
When JavaScript variables are declared, they have an initial value of undefined. If you do a mathematical operation on an undefined variable your result will be NaN which means Not a Number.
var - MDNPlease, take the time to read the lesson, before you answer these questions.
87 |With JavaScript array variables, we can store several pieces of data in one place. You start an array declaration with an opening square bracket, end it with a closing square bracket, and put a comma between each entry, like this:
35 |var sandwich = ["peanut butter", "jelly", "bread"]36 |
We can access the data inside arrays using indexes. Array indexes are written in the same bracket notation that strings use, except that instead of specifying a character, they are specifying an entry in the array. Like strings, arrays use zero-based indexing, so the first element in an array is element 0. For example:
var array = [1,2,3]; 41 | array[0]; // equals 1 42 | var data = array[1]; // equals 243 |
Unlike strings, the entries of arrays are mutable and can be changed freely. For example:
47 |var ourArray = [3,2,1]; 48 | ourArray[0] = 1; // equals [1,2,1]49 |
An easy way to append data to the end of an array is via the .push() function.
.push() takes one or more parameters and pushes them onto the end of the array. For example:
var arr = [1,2,3]; 55 | arr.push(4); 56 | // arr is now [1,2,3,4]57 |
Another way to change the data in an array is with the .pop() function.
.pop() is used to pop a value off of the end of an array. We can store this popped off value by assigning it to a variable. Any type of entry can be popped off of an array - numbers, strings, even nested arrays. For example:
var oneDown = [1, 4, 6].pop();63 |
In the above code, the variable oneDown now holds the value 6 and the array becomes [1, 4].
pop() always removes the last element of an array. What if you want to remove the first? That's where .shift() comes in. It works just like .pop()), except it removes the first element instead of the last. For example:
var oneDown = [1, 4, 6].shift();69 |
In the above code, the variable oneDown now holds the value 1 and the array becomes [4, 6].
Not only can you shift elements off of the beginning of an array, you can also unshift elements to the beginning of an array i.e. add elements in front of the array. .unshift() works exactly like .push(), but instead of adding the element at the end of the array, unshift() adds the element at the beginning of the array. For example:
var arr = [1,2,3]; 74 | arr.push(0); 75 | // arr is now [0,1,2,3]76 |
Please, take the time to read the lesson, before you answer these questions.
97 |You can run the same code multiple times by using a loop. The most common type of JavaScript loop is called a for loop because it runs for a specific number of times. For loops are declared with three optional expressions separated by semicolons:
35 |for ([initialization]; [condition]; [final-expression])36 |
The initialization statement is executed one time only before the loop starts. It is typically used to define and setup your loop variable.
37 |The condition statement is evaluated at the beginning of every loop iteration and will continue as long as it evaluates to true. When condition is false at the start of the iteration, the loop will stop executing. This means if condition starts as false, your loop will never execute.
The final-expression is executed at the end of each loop iteration, prior to the next condition check and is usually used to increment or decrement your loop counter.
39 |In the following example we initialize with i = 0 and iterate while our condition i < 5 is true. We'll increment i by 1 in each loop iteration with i++ as our final-expression.
var ourArray = [];
41 | for (var i = 0; i < 5; i++) {
42 | ourArray.push(i);
43 | }
44 | // The array now contains [0,1,2,3,4]
45 | A common task in JavaScript is to iterate through the contents of an array. One way to do that is with a for loop. This code will output each element of the array arr to the console:
var arr = [10,9,8,7,6];
50 | for (var i=0; i < arr.length; i++) {
51 | console.log(arr[i]);
52 | }
53 | Remember that arrays have zero-based numbering, which means the last index of the array is length - 1. Our condition for this loop is i < arr.length, which stops when i is at length - 1.
Another type of JavaScript loop is called a while loop, because it runs while a specified condition is true and stops once that condition is no longer true.
58 |var ourArray = [];
59 | var i = 0;
60 | while(i < 5) {
61 | ourArray.push(i);
62 | i++;
63 | }
64 | // The array now contains [0,1,2,3,4]Apart from the while loop, you can also use the do...while loop. The only difference between the two is that in the second one the condition is evaluated after the loop's body is executed for the first time, instead of before.
68 |var ourArray = [];
69 | var i = 0;
70 | do {
71 | ourArray.push(i);
72 | i++;
73 | } while(i < 5);
74 | // The array now contains [0,1,2,3,4]Please, take the time to read the lesson, before you answer these questions.
98 |if statements are used to make decisions in code. The keyword if tells JavaScript to execute the code in the curly braces under certain conditions, defined in the parentheses. These conditions are known as Boolean conditions because they may only be true or false. For example:
if(num > 0) {
35 | console.log("Greater than zero.");
36 | }
37 | When the condition evaluates to true, the program executes the statement inside the curly braces. When the Boolean condition evaluates to false, the statement inside the curly braces will not execute. For example:
When a condition for an if statement is true, the block of code following it is executed. What about when that condition is false? Normally nothing would happen. With an else statement, an alternate block of code can be executed.
if (num > 10) {
43 | console.log("Bigger than 10");
44 | } else {
45 | console.log("10 or Less");
46 | }
47 | If you have many options to choose from, use a switch statement. A switch statement tests a value and can have many case statements which defines various possible values. Statements are executed from the first matched case value until a break is encountered. For example:
switch(num) {
52 | case 1:
53 | console.log("1");
54 | break;
55 | case 2:
56 | console.log("2");
57 | break;
58 | }
59 | case values are tested with strict equality (===). The break tells JavaScript to stop executing statements. If the break is omitted, the next statement will be executed.
In a switch statement you may not be able to specify all possible values as case statements. Instead, you can add the default statement which will be executed if no matching case statements are found. Think of it like the final else statement in an if/else chain. A default statement should be the last case. For example:
switch(num) {
65 | case 1:
66 | console.log("One");
67 | break;
68 | case 2:
69 | console.log("Two");
70 | break;
71 | default:
72 | console.log("Not one or two");
73 | }
74 | Sometimes you will need to test more than one thing at a time. The logical AND operator (&&) returns true if and only if the operands to the left and right of it are true. The same effect could be achieved by nesting an if statement inside another if:
if (num > 5) {
79 | if (num < 10) {
80 | console.log("Yes");
81 | }
82 | The above code will only print Yes if num is between 6 and 9 (6 and 9 included). The same logic can be written as:
if (num > 5 && num < 10) {
84 | console.log("Yes");
85 | }
86 | The logical OR operator (||) returns true if either of the operands is true. Otherwise, it returns false. The same effect could be achieved using multiple if statements:
if (num > 10) {
88 | console.log("No");
89 | }
90 | if (num < 5) {
91 | console.log("No");
92 | }
93 | The above code will print No only if num is below 5 or above 10. The same logic can be written as:
if (num > 10 || num < 5) {
95 | console.log("No");
96 | }It is not uncommon to set a variable's value based on a condition. Instead of using an if...else statement, you can use the ternary ? operator. For example, you can transform the following code:
if (num < 10) {
101 | var x = "Under 10";
102 | }
103 | else {
104 | var x = "Over 10";
105 | }
106 | To this, more compact form using the ? operator:
var x = (num < 10) ? "Under 10" : "Over 10";108 |
Please, take the time to read the lesson, before you answer these questions.
132 |