├── .devcontainer └── devcontainer.json ├── .github ├── CODEOWNERS ├── ISSUE_TEMPLATE.md ├── PULL_REQUEST_TEMPLATE.md └── workflows │ └── main.yml ├── .gitignore ├── .node-version ├── .prettierignore ├── .vscode └── settings.json ├── CONTRIBUTING.md ├── Ch01 ├── 01_04 │ ├── editors.txt │ └── jquery-3.6.3.slim.js └── 01_05 │ └── resources.txt ├── Ch02 ├── 02_01 │ └── transcript.js ├── 02_02 │ └── transcript.js ├── 02_03 │ └── transcript.js ├── 02_04 │ └── transcript.js ├── 02_05 │ └── transcript.js └── 02_06 │ └── transcript.js ├── Ch03 ├── 03_01 │ └── transcript.js ├── 03_02 │ └── transcript.js ├── 03_03 │ └── transcript.js ├── 03_04 │ └── transcript.js ├── 03_05 │ └── transcript.js ├── 03_06 │ └── transcript.js ├── 03_07 │ └── transcript.js ├── 03_08 │ ├── jquery-3.6.3.slim.js │ └── transcript.js └── 03_09 │ └── transcript.js ├── Ch04 ├── 04_01 │ └── transcript.js ├── 04_02 │ └── transcript.js ├── 04_03 │ └── transcript.js ├── 04_04 │ └── transcript.js ├── 04_05 │ └── transcript.js ├── 04_06 │ └── transcript.js ├── 04_07 │ └── transcript.js └── 04_08 │ └── transcript.js ├── Ch05 ├── 05_01 │ ├── sandbox.html │ └── transcript.js ├── 05_02 │ └── transcript.js ├── 05_03 │ └── transcript.js └── 05_04 │ └── transcript.js ├── Ch06 ├── 06_01 │ └── transcript.js ├── 06_02 │ └── transcript.js ├── 06_03 │ └── transcript.js ├── 06_04 │ └── transcript.js ├── 06_05 │ └── transcript.js ├── 06_07 │ └── transcript.js ├── 06_08 │ └── transcript.js ├── 06_09 │ └── transcript.js └── 06_10 │ └── transcript.js ├── Ch07 ├── 07_02 │ └── examples.js └── 07_03 │ └── examples.js ├── LICENSE ├── NOTICE ├── README.md ├── favicon.ico ├── package-lock.json └── package.json /.devcontainer/devcontainer.json: -------------------------------------------------------------------------------- 1 | { 2 | "extensions": [ 3 | "GitHub.github-vscode-theme", 4 | "esbenp.prettier-vscode", 5 | "dbaeumer.vscode-eslint", 6 | "ritwickdey.LiveServer", 7 | "stylelint.vscode-stylelint" 8 | ], 9 | "settings": { 10 | "workbench.colorTheme": "Default Light+", 11 | "extensions.autoCheckUpdates": false, 12 | "editor.minimap.enabled": false, 13 | "editor.wordWrap": "on", 14 | "extensions.autoUpdate": false, 15 | "editor.defaultFormatter": null, 16 | "editor.formatOnSave": false, 17 | "[javascript]": { 18 | "editor.defaultFormatter": "esbenp.prettier-vscode", 19 | "editor.formatOnSave": true 20 | }, 21 | "terminal.integrated.fontSize": 18, 22 | "editor.fontSize": 18 23 | }, 24 | "onCreateCommand": "echo PS1='\"$ \"' >> ~/.bashrc", // Set Terminal Prompt to $ 25 | "waitFor": "onCreateCommand", 26 | "updateContentCommand": "npm install" 27 | } 28 | // DevContainer Reference: https://code.visualstudio.com/docs/remote/devcontainerjson-reference -------------------------------------------------------------------------------- /.github/CODEOWNERS: -------------------------------------------------------------------------------- 1 | # Codeowners for these exercise files: 2 | # * (asterisk) denotes "all files and folders" 3 | # Example: * @producer @instructor 4 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | 7 | 8 | ## Issue Overview 9 | 10 | 11 | ## Describe your environment 12 | 13 | 14 | ## Steps to Reproduce 15 | 16 | 1. 17 | 2. 18 | 3. 19 | 4. 20 | 21 | ## Expected Behavior 22 | 23 | 24 | ## Current Behavior 25 | 26 | 27 | ## Possible Solution 28 | 29 | 30 | ## Screenshots / Video 31 | 32 | 33 | ## Related Issues 34 | 35 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /.github/workflows/main.yml: -------------------------------------------------------------------------------- 1 | name: Copy To Branches 2 | on: 3 | workflow_dispatch: 4 | jobs: 5 | copy-to-branches: 6 | runs-on: ubuntu-latest 7 | steps: 8 | - uses: actions/checkout@v2 9 | with: 10 | fetch-depth: 0 11 | - name: Copy To Branches Action 12 | uses: planetoftheweb/copy-to-branches@v1.2 13 | env: 14 | key: main 15 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | .tmp 4 | npm-debug.log 5 | -------------------------------------------------------------------------------- /.node-version: -------------------------------------------------------------------------------- 1 | 16.19.0 2 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | Ch02/02_04/transcript.js 2 | Ch03/03_07/transcript.js 3 | Ch04/04_03/transcript.js 4 | Ch06/06_03/transcript.js 5 | Ch06/0603.js -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "editor.bracketPairColorization.enabled": true, 3 | "editor.cursorBlinking": "solid", 4 | "editor.fontFamily": "ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono', 'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro', 'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace", 5 | "editor.fontLigatures": false, 6 | "editor.fontSize": 22, 7 | "editor.formatOnPaste": true, 8 | "editor.formatOnSave": true, 9 | "editor.lineNumbers": "on", 10 | "editor.matchBrackets": "always", 11 | "editor.minimap.enabled": false, 12 | "editor.smoothScrolling": true, 13 | "editor.tabSize": 2, 14 | "editor.useTabStops": true, 15 | "emmet.triggerExpansionOnTab": true, 16 | "explorer.openEditors.visible": 0, 17 | "files.autoSave": "afterDelay", 18 | "screencastMode.onlyKeyboardShortcuts": true, 19 | "terminal.integrated.fontSize": 18, 20 | "workbench.activityBar.visible": true, 21 | "workbench.colorTheme": "Visual Studio Dark", 22 | "workbench.fontAliasing": "antialiased", 23 | "workbench.statusBar.visible": true, 24 | "liveServer.settings.root": "/docs", 25 | "prettier.enable": true, 26 | "eslint.alwaysShowStatus": false, 27 | "liveServer.settings.donotVerifyTags": true 28 | } 29 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | 2 | Contribution Agreement 3 | ====================== 4 | 5 | This repository does not accept pull requests (PRs). All pull requests will be closed. 6 | 7 | However, if any contributions (through pull requests, issues, feedback or otherwise) are provided, as a contributor, you represent that the code you submit is your original work or that of your employer (in which case you represent you have the right to bind your employer). By submitting code (or otherwise providing feedback), you (and, if applicable, your employer) are licensing the submitted code (and/or feedback) to LinkedIn and the open source community subject to the BSD 2-Clause license. 8 | -------------------------------------------------------------------------------- /Ch01/01_04/editors.txt: -------------------------------------------------------------------------------- 1 | https://code.visualstudio.com/ 2 | https://www.sublimetext.com/ 3 | http://brackets.io/ 4 | https://www.jetbrains.com/phpstorm/ 5 | https://www.jetbrains.com/webstorm/ -------------------------------------------------------------------------------- /Ch01/01_05/resources.txt: -------------------------------------------------------------------------------- 1 | http://eloquentjavascript.net/ 2 | http://exploringjs.com/ 3 | https://github.com/getify/You-Dont-Know-JS 4 | https://shop.oreilly.com/product/9780596517748.do 5 | https://github.com/dwyl/Javascript-the-Good-Parts-notes 6 | https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference 7 | https://caniuse.com/ 8 | https://quirksmode.org/ -------------------------------------------------------------------------------- /Ch02/02_01/transcript.js: -------------------------------------------------------------------------------- 1 | // This is a transcript of the lines of code from the lesson. 2 | // You can copy and paste each line into a JavaScript console to execute it and see the result. 3 | 4 | var x = 32; 5 | x; 6 | 7 | var whereAmI = "Santa Barbara, CA"; 8 | whereAmI; 9 | 10 | x = 45; 11 | x; 12 | whereAmI = 75; 13 | whereAmI; 14 | 15 | var monster1 = "Grover", monster2 = 'Cookie Monster', monster3 = 'Animal'; 16 | monster1; 17 | monster2; 18 | monster3; 19 | 20 | 21 | // More info: 22 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var -------------------------------------------------------------------------------- /Ch02/02_02/transcript.js: -------------------------------------------------------------------------------- 1 | // This is a transcript of the lines of code from the lesson. 2 | // You can copy and paste each line into a JavaScript console to execute it and see the result. 3 | 4 | "This is a string"; 5 | "12"; 6 | 12; 7 | 8 | 'This is also a string'; 9 | 'This is a string"; // mismatched quotes - this will not execute 10 | 11 | ''; 12 | ''; 13 | 14 | "This is Joe's favorite string"; 15 | "This is Joe's \"favorite\" string"; 16 | "This is Joe's "favorite" string"; // this line will not work 17 | 18 | "This is \ 19 | Joe's Favorite \ 20 | String EVER"; 21 | 22 | // More info: 23 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#literals 24 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String -------------------------------------------------------------------------------- /Ch02/02_03/transcript.js: -------------------------------------------------------------------------------- 1 | // This is a transcript of the lines of code from the lesson. 2 | // You can copy and paste each line into a JavaScript console to execute it and see the result. 3 | 4 | var myString = "This is my string. Leave it alone"; 5 | myString; 6 | myString.length; 7 | myString.toUpperCase(); 8 | 9 | "This is my string".length; 10 | 11 | let declaration = `This I say to you: "good morning". Huzzah!`; 12 | declaration; 13 | 14 | declaration = `This I say to you: "${myString}". Huzzah!`; 15 | declaration; 16 | 17 | // More info: 18 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#literals 19 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String -------------------------------------------------------------------------------- /Ch02/02_04/transcript.js: -------------------------------------------------------------------------------- 1 | // This is a transcript of the lines of code from the lesson. 2 | // You can copy and paste each line into a JavaScript console to execute it and see the result. 3 | 4 | 12 5 | 12.0 6 | 12.82358972893527582 7 | -12 8 | Infinity 9 | -Infinity 10 | NaN 11 | 12 | var myNumber = 33; 13 | 14 | Math; 15 | Math.round(12.4984012840918); 16 | Math.round(12.92309820948209384); 17 | 18 | Math.random(); 19 | Math.random(); 20 | Math.random(); 21 | Math.random(); 22 | 23 | // More info: 24 | // https://developer.mozilla.org/en-US/docs/Glossary/Number 25 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity 26 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN 27 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math 28 | -------------------------------------------------------------------------------- /Ch02/02_05/transcript.js: -------------------------------------------------------------------------------- 1 | // This is a transcript of the lines of code from the lesson. 2 | // You can copy and paste each line into a JavaScript console to execute it and see the result. 3 | 4 | true; 5 | false; 6 | 7 | True; 8 | FALSE; 9 | tRuE; 10 | true; 11 | false; 12 | 13 | buttonHasBeenClicked = false; 14 | 15 | var myLocation = "Santa Barbara", myOtherLocation = "Los Angeles"; 16 | 17 | myLocation === myOtherLocation; 18 | 19 | myOtherLocation = "Santa Barbara"; 20 | 21 | myLocation === myOtherLocation; 22 | 23 | // More info: 24 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#literals 25 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String 26 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean -------------------------------------------------------------------------------- /Ch02/02_06/transcript.js: -------------------------------------------------------------------------------- 1 | // This is a transcript of the lines of code from the lesson. 2 | // You can copy and paste each line into a JavaScript console to execute it and see the result. 3 | 4 | const dozen = 12, halfDozen = 6, bakersDozen = 13; 5 | 6 | dozen = 13; 7 | 8 | var cookieCount = 5; 9 | let cookieCount = 5; 10 | 11 | // More info: 12 | // http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let 13 | // http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const -------------------------------------------------------------------------------- /Ch03/03_01/transcript.js: -------------------------------------------------------------------------------- 1 | 12; 2 | ("strings"); 3 | true; 4 | 5 | // prettier-ignore 6 | {} 7 | var emptyObject = {}; 8 | emptyObject; 9 | 10 | var notEmptyObject = { 11 | label: "value", 12 | label2: "value2", 13 | }; 14 | notEmptyObject; 15 | 16 | // More info: 17 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects 18 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer 19 | -------------------------------------------------------------------------------- /Ch03/03_02/transcript.js: -------------------------------------------------------------------------------- 1 | let bird = { 2 | genus: "corvus", 3 | species: "corvax", 4 | commonName: "raven", 5 | callType: "squawky", 6 | quote: "Nevermore", 7 | maxOffspring: 5, 8 | noisy: true, 9 | deadly: false, 10 | }; 11 | 12 | let bear = { 13 | genus: "ursus", 14 | species: "arctos", 15 | commonName: "brown bear", 16 | callType: "roar", 17 | quote: "", 18 | maxOffspring: 3, 19 | noisy: true, 20 | deadly: true, 21 | }; 22 | 23 | const bookOfKnowledge = { 24 | "lunch time": "12:30 PM", 25 | "the ultimate answer": 42, 26 | bestSong: "Lonnie's Lament", 27 | earth: "Mostly harmless.", 28 | }; 29 | -------------------------------------------------------------------------------- /Ch03/03_03/transcript.js: -------------------------------------------------------------------------------- 1 | var bird = { 2 | genus : 'corvus', 3 | species : 'corvax', 4 | commonName: 'raven', 5 | callType : 'squawky', 6 | quote : 'Nevermore', 7 | maxOffspring : 5, 8 | noisy : true, 9 | deadly : false 10 | }; 11 | 12 | bird.quote; 13 | 14 | bird."quote"; // this does not work 15 | 16 | bird["quote"]; 17 | 18 | bird.color = "black"; 19 | 20 | bird; 21 | 22 | bird["where it lives"] = "in a tree"; 23 | bird.whereItLives = "in a tree"; 24 | bird.whereItLives; 25 | bird['whereItLives']; 26 | 27 | delete bird.color; 28 | bird; 29 | 30 | // More info: 31 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects 32 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object -------------------------------------------------------------------------------- /Ch03/03_04/transcript.js: -------------------------------------------------------------------------------- 1 | var animal = { 2 | genus: "corvus", 3 | species: "corvax", 4 | commonName: "raven", 5 | callType: "squawky", 6 | quote: "Nevermore", 7 | maxOffspring: 5, 8 | noisy: true, 9 | deadly: false, 10 | }; 11 | animal; 12 | 13 | var animal2 = animal; 14 | animal2; 15 | 16 | animal2.genus = "ursus"; 17 | animal2; 18 | animal; 19 | 20 | animal2 = { 21 | genus: "corvus", 22 | species: "corvax", 23 | commonName: "raven", 24 | callType: "squawky", // there is a deliberate bug here in the course, removed for your convenience :) 25 | quote: "Nevermore", 26 | maxOffspring: 5, 27 | noisy: true, 28 | deadly: false, 29 | }; 30 | 31 | // bonus: make a copy of an object safely 32 | animal2 = Object.assign({}, animal); 33 | animal2 = { ...animal }; 34 | animal2 = JSON.parse(JSON.stringify(animal)); 35 | 36 | animal2.genus = "ursus"; 37 | animal2; 38 | animal; 39 | 40 | // More info: 41 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects 42 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object 43 | -------------------------------------------------------------------------------- /Ch03/03_05/transcript.js: -------------------------------------------------------------------------------- 1 | var myArray = []; 2 | myArray; 3 | 4 | var daysOfTheWeek = ["Sunday", "Monday", "Tuesday", "Wednesday"]; 5 | daysOfTheWeek; 6 | 7 | var myList = [0, 1, 2, "string1", "string2", "string3", true, false]; 8 | myList; 9 | 10 | var counties = ["Belknap", "Strafford", "Carroll", "Rockingham"]; 11 | counties; 12 | 13 | var listOfStuff = [{ name: "value" }, [1, 2, 3], true, "nifty"]; 14 | listOfStuff; 15 | listOfStuff.length; 16 | 17 | // More info: 18 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#array_literals 19 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array 20 | -------------------------------------------------------------------------------- /Ch03/03_06/transcript.js: -------------------------------------------------------------------------------- 1 | var counties = ["Belknap", "Strafford", "Carroll", "Rockingham"]; 2 | 3 | counties[0]; 4 | counties[2]; 5 | 6 | counties[2] = "Cheshire"; 7 | counties; 8 | 9 | counties[4] = "Carroll"; 10 | counties; 11 | 12 | counties[counties.length] = "Merrimack"; 13 | counties; 14 | 15 | counties.push("Coos"); 16 | counties; 17 | 18 | counties.pop(); 19 | 20 | delete counties[2]; 21 | counties; 22 | 23 | counties.splice(2, 1); 24 | counties; 25 | counties.length; 26 | 27 | // More info: 28 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array 29 | -------------------------------------------------------------------------------- /Ch03/03_07/transcript.js: -------------------------------------------------------------------------------- 1 | var year=2012,month='October',day=31,holiday='Halloween'; 2 | 3 | var year = 2012, month = 'October', day = 31, holiday='Halloween'; 4 | 5 | var year = 2012, 6 | month = 'October', 7 | day = 31, 8 | holiday = 'Halloween'; 9 | 10 | var year = 2012, 11 | month = 'October', 12 | day = 31, 13 | holiday = 'Halloween'; 14 | 15 | var tinyAlmanac={'year':2012,'month':'October','day':31,'holiday':'Halloween'}; 16 | 17 | var tinyAlmanac = { 18 | 'year' : 2012, 19 | 'month' : 'October', 20 | 'day' : 31, 21 | 'holiday' : 'Halloween' 22 | }; 23 | 24 | var longString = "Four score \ 25 | and seven years ago \ 26 | our fathers brought forth \ 27 | on this continent \ 28 | a new nation"; 29 | 30 | // More info: 31 | // These are not specifications on whitespace, but the Mozilla code style guide discusses formatting. 32 | // https://developer.mozilla.org/en-US/docs/MDN/Writing_guidelines/Writing_style_guide/Code_style_guide/JavaScript#choosing_a_format 33 | -------------------------------------------------------------------------------- /Ch03/03_08/transcript.js: -------------------------------------------------------------------------------- 1 | // another after the slashes does not execute 2 | var year = 2012, 3 | month = "October", // this is the month 4 | // day = 31, 5 | holiday = "Halloween"; 6 | 7 | /* 8 | You can write comments 9 | across multiple lines 10 | finally ending with: 11 | */ 12 | 13 | var tinyAlmanac = { 14 | year: 2012, 15 | month: "October", 16 | day: 31, 17 | holiday: "Halloween" 18 | }; 19 | 20 | // watch out for block comments here 21 | var myRegExp = /[0-9].*/; 22 | 23 | // More info: 24 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#comments 25 | -------------------------------------------------------------------------------- /Ch03/03_09/transcript.js: -------------------------------------------------------------------------------- 1 | var string1 = "This is the longest string ever."; 2 | var string2 = "This is the shortest string ever."; 3 | var string3 = "Is this the thing called Mount Everest?"; 4 | var string4 = "This is the Sherman on the Mount."; 5 | 6 | var regex = /this/; 7 | 8 | regex.test(string1); 9 | regex.test(string2); 10 | regex.test(string3); 11 | regex.test(string4); 12 | 13 | regex = /this/i; 14 | 15 | regex = /^this/i; 16 | 17 | regex = /this$/i; 18 | 19 | regex = /ever.$/i; 20 | 21 | regex = /ever\.$/i; 22 | 23 | // More info: 24 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions 25 | // http://regex.info/book.html 26 | -------------------------------------------------------------------------------- /Ch04/04_01/transcript.js: -------------------------------------------------------------------------------- 1 | var one = 1, 2 | two = 2; 3 | 4 | one === one; // true 5 | one !== one; // false 6 | one !== two; // true 7 | one === two; // false 8 | 9 | one == one; // true 10 | one == "1"; // true (?!) 11 | one != "1"; // false (?!) 12 | one === "1"; // false 13 | 14 | one < two; // true 15 | 16 | one > two; // false 17 | 18 | one <= two; // true 19 | 20 | one <= one; // true 21 | 22 | one >= two; // false 23 | 24 | 10 >= two; // true 25 | 26 | // More info: 27 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#equality_operators 28 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators#relational_operators 29 | -------------------------------------------------------------------------------- /Ch04/04_02/transcript.js: -------------------------------------------------------------------------------- 1 | 2 + 5; 2 | 4 - 3; 3 | 5 - 9; 4 | 3 * 5; 5 | 36 / 6; 6 | 36 / 5; 7 | 8 | 20 % 2; 9 | 19 % 2; 10 | 11 | // twenty an even number? 12 | 20 % 2 === 0; // true 13 | 14 | const perPage = 20; 15 | const totalResults = 254; 16 | totalResults % perPage; 17 | 18 | var counter = 0; 19 | counter = counter + 1; 20 | 21 | counter += 1; 22 | counter++; 23 | 24 | counter += 5; 25 | counter += -4; 26 | 27 | counter -= 1; 28 | counter--; 29 | counter; 30 | 31 | counter *= 2; 32 | 33 | "cat" + "dog"; 34 | "cat " + "dog"; 35 | "cat" + " and " + "dog"; 36 | 37 | "1" + "2"; 38 | 39 | // More info: 40 | // https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Expressions_and_Operators#Arithmetic_operators 41 | // https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Expressions_and_Operators#String_operators 42 | -------------------------------------------------------------------------------- /Ch04/04_03/transcript.js: -------------------------------------------------------------------------------- 1 | // && 2 | // || 3 | 4 | let animal1 = "monkey", animal2 = "bear", animal3 = "tiger"; 5 | 6 | // Pretend there's code that might change the values of the animal variables here, then… 7 | 8 | animal1 === "monkey" && animal2 === "bear"; // true 9 | animal1 === "ape" && animal2 === "bear"; // false 10 | animal1 === "ape" && animal2 === "bear" && animal3 === "tiger"; // false 11 | animal1 === "monkey" && animal2 === "bear" && animal3 === "tiger"; // true 12 | 13 | animal1 === "monkey" || animal2 === "bear"; // true 14 | animal1 === "ape" || animal2 === "bear"; // true 15 | animal1 === "ape" || animal2 === "ostrich"; // false 16 | 17 | animal1 === "monkey" || animal2 === "monkey" && animal3 === "tiger"; 18 | (animal1 === "monkey" || animal2 === "monkey") && animal3 === "tiger"; 19 | 20 | !true; // false 21 | !false; // true 22 | 23 | animal1 === "monkey" && animal2 === "zebra"; // false 24 | !(animal1 === "monkey" && animal2 === "zebra"); // true 25 | animal1 !== "monkey" && animal2 !== "zebra"; // false 26 | animal1 !== "monkey" || animal2 !== "zebra"; // true 27 | 28 | // More info: 29 | // https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Expressions_and_Operators#Logical_operators 30 | -------------------------------------------------------------------------------- /Ch04/04_04/transcript.js: -------------------------------------------------------------------------------- 1 | // Execute these in a browser 2 | var answer = window.confirm("Click OK, get true. Click cancel, get false."); 3 | 4 | if (answer === true) { 5 | console.log("You said true!"); 6 | } 7 | 8 | if (answer === true) { 9 | console.log("You said true!"); 10 | } else { 11 | console.log("You said something else"); 12 | } 13 | 14 | var answer = window.prompt("Type YES, NO, or MAYBE. Then click OK."); 15 | if (answer === "YES") { 16 | console.log("You said YES!"); 17 | } else if (answer === "MAYBE") { 18 | console.log("You said maybe. I don't know what to make of that."); // note the double primes 19 | } else if (answer === "NO") { 20 | console.log("You said no. :("); 21 | } else { 22 | console.log("You rebel, you!"); 23 | } 24 | 25 | var answer = window.prompt("Type YES, NO, or MAYBE. Then click OK."); 26 | if (answer === "YES" || answer === "NO") { 27 | // Do some common actions for YES and NO 28 | 29 | if (answer === "YES") { 30 | console.log("You said YES!"); 31 | // do some other things 32 | } else { 33 | console.log("You said no. :("); 34 | // do some things only for NO 35 | } 36 | } else if (answer === "MAYBE") { 37 | console.log("You said maybe. I don't know what to make of that."); 38 | } else { 39 | console.log("You rebel, you!"); 40 | } 41 | 42 | // More info: 43 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else 44 | -------------------------------------------------------------------------------- /Ch04/04_05/transcript.js: -------------------------------------------------------------------------------- 1 | var answer = window.prompt("Type YES, NO, or MAYBE. Then click OK."); 2 | 3 | if (answer === "YES") { 4 | console.log("You said YES!"); 5 | } else if (answer === "MAYBE") { 6 | console.log("You said maybe. I don't know what to make of that."); 7 | } else if (answer === "NO") { 8 | console.log("You said no. :("); 9 | } else { 10 | console.log("You rebel, you!"); 11 | } 12 | 13 | switch (answer) { 14 | case "YES": 15 | console.log("You said YES!"); 16 | break; 17 | case "MAYBE": 18 | console.log("You said maybe. I don't know what to make of that."); 19 | break; 20 | case "NO": 21 | console.log("You said no. :("); 22 | break; 23 | default: 24 | console.log("You rebel, you!"); 25 | break; 26 | } 27 | 28 | // More info: 29 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch 30 | -------------------------------------------------------------------------------- /Ch04/04_06/transcript.js: -------------------------------------------------------------------------------- 1 | var cherub = "Cupid"; 2 | // cherub = 'Norman'; 3 | 4 | if (cherub === "Cupid") console.log("Ouch, an arrow! Ooo, I'm in love!"); 5 | 6 | if (cherub === "Cupid") console.log("Ouch, an arrow! Ooo, I'm in love!"); 7 | else console.log("I feel nothing!"); 8 | 9 | let errorMsg = ''; 10 | 11 | if (errorMsg) { 12 | console.error('There was an error', errorMsg); 13 | } 14 | 15 | if (!errorMsg) { 16 | console.log('Yay! No errors!'); 17 | } 18 | 19 | let errors = []; 20 | 21 | // if (errors) { // Nope - empty arrays are truthy 22 | 23 | if (errors.length) { 24 | console.error("Please fix these errors", errors); 25 | } 26 | 27 | // More info: 28 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#if...else_statement 29 | // 30 | // Truthy and falsy values are discussed here: 31 | // https://developer.mozilla.org/en-US/docs/Glossary/Truthy 32 | -------------------------------------------------------------------------------- /Ch04/04_07/transcript.js: -------------------------------------------------------------------------------- 1 | var animal = "cat"; 2 | // animal = 'dog'; 3 | 4 | animal === "cat" 5 | ? console.log("You will be a cat herder.") 6 | : console.log("You will be a dog catcher."); 7 | 8 | var job = animal === "cat" ? "cat herder" : "dog catcher"; 9 | 10 | // prettier-ignore 11 | var job = (animal === "cat") ? "cat herder" : "dog catcher"; 12 | 13 | // More info: 14 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#if...else_statement 15 | // 16 | // Truthy and falsy values are discussed here: 17 | // https://developer.mozilla.org/en-US/docs/Glossary/Truthy 18 | // 19 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator 20 | -------------------------------------------------------------------------------- /Ch04/04_08/transcript.js: -------------------------------------------------------------------------------- 1 | var thing = 12; 2 | thing = "twelve"; 3 | typeof thing; 4 | 5 | thing = 12; 6 | typeof thing; 7 | 8 | thing = false; 9 | typeof thing; 10 | 11 | thing = {}; 12 | typeof thing; 13 | 14 | thing = []; 15 | typeof thing; 16 | typeof thing === "object" && thing.hasOwnProperty("length"); // true 17 | 18 | thing = {}; 19 | typeof thing === "object" && thing.hasOwnProperty("length"); // false 20 | 21 | NaN; 22 | typeof NaN; 23 | Number.isNaN(); 24 | 25 | typeof null; 26 | thing === null; 27 | thing = null; 28 | thing === null; 29 | 30 | let somethingLater; 31 | typeof somethingLater; 32 | typeof nothingSilly; 33 | 34 | // More info: 35 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof 36 | 37 | // https://lodash.com/docs/#isNumber 38 | -------------------------------------------------------------------------------- /Ch05/05_01/sandbox.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | JavaScript Playground 6 | 7 | 8 | 9 |

10 | This file lets you play with JavaScript easily. 11 |

12 | 13 | 14 | -------------------------------------------------------------------------------- /Ch05/05_01/transcript.js: -------------------------------------------------------------------------------- 1 | for (let i = 0; i < 10; i += 1) { 2 | console.log(i); 3 | } 4 | 5 | // very common use case: looping over an array. 6 | var pageNames = [ 7 | "Home", 8 | "About Us", 9 | "Contact Us", 10 | "JavaScript Playground", 11 | "News", 12 | "Blog" 13 | ]; 14 | for (i = 0; i < pageNames.length; i += 1) { 15 | if (document.title === pageNames[i]) { 16 | console.log("We ARE here: " + pageNames[i]); 17 | } else { 18 | console.log("We are not here: " + pageNames[i]); 19 | } 20 | } 21 | 22 | // don't repeat yourself: 23 | var pageNames = [ 24 | "Home", 25 | "About Us", 26 | "Contact Us", 27 | "JavaScript Playground", 28 | "News", 29 | "Blog" 30 | ]; 31 | for (i = 0; i < pageNames.length; i += 1) { 32 | var currentPageTitle = pageNames[i]; 33 | 34 | if (document.title === currentPageTitle) { 35 | console.log("We ARE here: " + currentPageTitle); 36 | } else { 37 | console.log("We are not here: " + currentPageTitle); 38 | } 39 | } 40 | 41 | // More info: 42 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for_statement 43 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for 44 | -------------------------------------------------------------------------------- /Ch05/05_02/transcript.js: -------------------------------------------------------------------------------- 1 | // iterate over an array 2 | var pageNames = [ 3 | "Home", 4 | "About Us", 5 | "Contact Us", 6 | "JavaScript Playground", 7 | "News", 8 | "Blog", 9 | ]; 10 | 11 | for (let i = 0; i < pageNames.length; i += 1) { 12 | console.log(i, pageNames[i]); 13 | } 14 | 15 | for (var p in pageNames) { 16 | console.log(p, pageNames[p]); 17 | } 18 | 19 | for (var v of pageNames) { 20 | console.log(v); 21 | } 22 | 23 | // iterate over an object 24 | var pages = { 25 | first: "Home", 26 | second: "About Us", 27 | third: "Contact Us", 28 | fourth: "JavaScript Playground", 29 | fifth: "Blog", 30 | }; 31 | for (var p in pages) { 32 | if (pages.hasOwnProperty(p)) { 33 | console.log(p, pages[p]); 34 | } 35 | } 36 | 37 | // More info: 38 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in 39 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of 40 | -------------------------------------------------------------------------------- /Ch05/05_03/transcript.js: -------------------------------------------------------------------------------- 1 | // This array has two copies of its first item 2 | let myList = [1, 1, 2, 3, 5, 8, 13, "fibonacci"]; 3 | 4 | // The same thing using the Set API 5 | let mySet = new Set(); 6 | mySet.add(1); 7 | mySet.add(1); // this won't change mySet, since 1 is already in there 8 | mySet.add(2); 9 | mySet.add(3); 10 | // ... this gets tedious 11 | 12 | // An array can be turned into a set 13 | // If you want to quickly remove all duplicates from an array, this is a good tool! 14 | let mySet2 = new Set(myList); 15 | 16 | mySet2.has(3); // true 17 | mySet2.has(12); // false 18 | 19 | // For...of loop iteration works 20 | for (let item of mySet2) { 21 | console.log('mySet contains', item); 22 | } 23 | 24 | // This object is a bird 25 | var bird = { 26 | genus: "corvus", 27 | species: "corvax", 28 | commonName: "raven", 29 | }; 30 | 31 | // Here is a map using the same structure 32 | var birdMap = new Map(); 33 | birdMap.set("genus", "corvus"); 34 | birdMap.set("species", "corvax"); 35 | birdMap.set("commonName", "raven"); 36 | 37 | birdMap.get("genus"); // 'corvus' 38 | 39 | birdMap.has("genus"); // true 40 | birdMap.has("corvus"); // false (keys only) 41 | 42 | // for...of loops work on Maps, with key and value returned 43 | for (let value of birdMap) { 44 | console.log(value); 45 | } 46 | 47 | birdMap.entries(); 48 | 49 | Object.entries(bird); 50 | 51 | birdMap2 = new Map(Object.entries(bird)); -------------------------------------------------------------------------------- /Ch05/05_04/transcript.js: -------------------------------------------------------------------------------- 1 | // for loop 2 | for (let i = 0; i < 10; i += 1) { 3 | console.log(i); 4 | } 5 | 6 | // same thing as a while loop 7 | let i = 0; 8 | while (i < 10) { 9 | console.log(i + "... This will go until we hit 10"); 10 | i += 1; 11 | } 12 | 13 | var myList = [true, true, true, false, true, true]; 14 | 15 | var myItem = null; 16 | 17 | while (myItem !== false) { 18 | console.log( 19 | "myList has " + 20 | myList.length + 21 | " items now. This loop will keep going until we pop a false." 22 | ); 23 | myItem = myList.pop(); 24 | } 25 | 26 | var counter = 1; 27 | while (true) { 28 | console.log(counter); 29 | counter++; 30 | break; // comment out this break statement to make this loop go forever and potentially lock up your web browser 31 | } 32 | 33 | var myList = [true, true, true, false, true, true]; 34 | 35 | var myItem = false; 36 | do { 37 | console.log( 38 | "myList has " + 39 | myList.length + 40 | " items now. This loop will go until we pop a false." 41 | ); 42 | myItem = myList.pop(); 43 | } while (myItem !== false); 44 | 45 | // More info: 46 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while 47 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/do...while 48 | -------------------------------------------------------------------------------- /Ch06/06_01/transcript.js: -------------------------------------------------------------------------------- 1 | console.log('Arf'); 2 | console.log('Woof'); 3 | console.log('Meow'); 4 | console.log('Moooooooooooo'); 5 | 6 | function speak() { 7 | console.log('Arf'); 8 | console.log('Woof'); 9 | console.log('Meow'); 10 | console.log('Moooooooooooo'); 11 | } 12 | 13 | speak(); 14 | 15 | // Function expression assigned to a variable 16 | const speak = function() { 17 | console.log('Arf'); 18 | console.log('Woof'); 19 | console.log('Meow'); 20 | console.log('Moooooooooooo'); 21 | } 22 | 23 | // More info: 24 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions 25 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/function 26 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function -------------------------------------------------------------------------------- /Ch06/06_02/transcript.js: -------------------------------------------------------------------------------- 1 | fuddify("Be very quiet, I'm hunting rabbits."); 2 | fuddify("You screwy rabbit."); 3 | fuddify("Rabbit tracks!"); 4 | 5 | function fuddify(speech) { 6 | // if it's not a string, return an error message 7 | if (typeof speech !== "string") { 8 | console.error("Nice twy, wabbit!"); 9 | return; 10 | } 11 | 12 | // otherwise, make it sound like Elmer Fudd 13 | speech = speech.replace(/r/g, "w"); 14 | speech = speech.replace(/R/g, "W"); 15 | 16 | return speech; 17 | } 18 | 19 | var utterance = fuddify("You screwy rabbit"); 20 | utterance; 21 | 22 | function isEven(num) { 23 | if (num % 2 === 0) { 24 | return true; 25 | } else { 26 | return false; 27 | } 28 | } 29 | 30 | isEven(12); 31 | 12 % 2; 32 | 33 | function isEven(num) { 34 | return num % 2 === 0; 35 | } 36 | 37 | // More info: 38 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions 39 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function -------------------------------------------------------------------------------- /Ch06/06_03/transcript.js: -------------------------------------------------------------------------------- 1 | function speakSomething(what = "Default speech", howMany = 10) { 2 | for (var i = 0; i < howMany; i += 1) { 3 | console.log(what + " (" + i + ")"); 4 | } 5 | } 6 | 7 | speakSomething("Good morning", 5); 8 | speakSomething("Good morning"); 9 | speakSomething(); 10 | 11 | function addingMachine() { 12 | // initialize the total we'll be returning 13 | var total = 0; 14 | 15 | for (var i = 0; i < arguments.length; i += 1) { 16 | // grab the next number 17 | var number = arguments[i]; 18 | 19 | // check if the argument is a number. 20 | // if so, add it to the running total 21 | if (typeof number === "number") { 22 | total += number; 23 | } 24 | } 25 | 26 | // done - return the total 27 | return total; 28 | } 29 | 30 | addingMachine(1, 2, 3); 31 | addingMachine(1, 2, 3, 4, 5, 6, 7, 8, 9, 1204910249014); 32 | 33 | // More info: 34 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions 35 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function -------------------------------------------------------------------------------- /Ch06/06_04/transcript.js: -------------------------------------------------------------------------------- 1 | var calvin = { 2 | name: "Calvin", 3 | bestFriend: "Hobbes", 4 | form: "human boy", 5 | }; 6 | 7 | // you can also pass an object to a function 8 | // because objects are using a copy of a reference, the argument will be modified 9 | function transmogrifier(calvin) { 10 | if (typeof calvin !== "object") { 11 | console.error("Calvin is not an object."); 12 | return; 13 | } 14 | 15 | // generate a random number between 1 and 5 16 | var randomNumber = Math.floor(Math.random() * 5) + 1; 17 | 18 | switch (randomNumber) { 19 | case 1: 20 | calvin.form = "tyrannosaurus"; 21 | break; 22 | case 2: 23 | calvin.form = "grey wolf"; 24 | break; 25 | case 3: 26 | calvin.form = "bengal tiger"; 27 | break; 28 | case 4: 29 | calvin.form = "grizzly bear"; 30 | break; 31 | case 5: 32 | calvin.form = "canary"; 33 | break; 34 | default: 35 | // he stays human 36 | calvin.form = "human boy"; 37 | break; 38 | } 39 | } 40 | 41 | // this version of the transmogifier does return a copy, leaving the original alone 42 | function transmogrifyCopy(calvin) { 43 | if (typeof calvin !== "object") { 44 | console.error("Calvin is not an object."); 45 | return; 46 | } 47 | 48 | // generate a random number between 1 and 5 49 | var randomNumber = Math.floor(Math.random() * 5) + 1; 50 | 51 | var newForm = calvin.form; // by default, do not change 52 | 53 | switch (randomNumber) { 54 | case 1: 55 | newForm = "tyrannosaurus"; 56 | break; 57 | case 2: 58 | newForm = "grey wolf"; 59 | break; 60 | case 3: 61 | newForm = "bengal tiger"; 62 | break; 63 | case 4: 64 | newForm = "grizzly bear"; 65 | break; 66 | case 5: 67 | newForm = "canary"; 68 | break; 69 | default: 70 | // he stays human 71 | newForm = "human boy"; 72 | break; 73 | } 74 | 75 | // return a new object that's just like calvin, 76 | // but transmogrified! 77 | return { 78 | name: calvin.name, 79 | bestFriend: calvin.bestFriend, 80 | form: newForm, 81 | }; 82 | } 83 | 84 | // More info: 85 | // https://en.wikipedia.org/wiki/Calvin_and_Hobbes 86 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions 87 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function 88 | -------------------------------------------------------------------------------- /Ch06/06_05/transcript.js: -------------------------------------------------------------------------------- 1 | function speakSomething(what = 'Speaking!') { 2 | for (var i = 0; i < 10; i += 1) { 3 | console.log(what); 4 | } 5 | } 6 | 7 | var speakSomething = function(what = 'Speaking!') { 8 | for (var i = 0; i < 10; i += 1) { 9 | console.log(what); 10 | } 11 | }; 12 | 13 | setTimeout(speakSomething, 5000); 14 | 15 | var obj = { 16 | sayHello: function() { 17 | console.log("Hello"); 18 | } 19 | }; 20 | 21 | obj.sayHello(); 22 | 23 | // More info: 24 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions 25 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function 26 | // https://developer.mozilla.org/en-US/docs/Glossary/Hoisting -------------------------------------------------------------------------------- /Ch06/06_07/transcript.js: -------------------------------------------------------------------------------- 1 | // Shim allowing this code to work in a browser as well as node 2 | if (!global && typeof window !== 'undefined') { 3 | var global = window; 4 | } 5 | 6 | var myNum = 32; 7 | var myResult = "Success!"; 8 | 9 | function randomizer(limit) { 10 | var randomNumber = Math.floor(Math.random() * limit); 11 | 12 | var myNum = randomNumber; 13 | 14 | console.log("Local myNum is", myNum); 15 | console.log("Global myNum is", global.myNum); 16 | 17 | console.log("Our result is", myResult); 18 | 19 | return myNum; 20 | } 21 | 22 | randomizer(10); 23 | 24 | function doubleIt(num) { 25 | var myNum = num * 2; 26 | 27 | return myNum; 28 | } 29 | 30 | if (1 === 1) { 31 | const oneIsOne = 'Yes indeed.'; 32 | console.log('One is one, right?', oneIsOne); 33 | } 34 | 35 | console.log('One is still one, right?', oneIsOne); // ReferenceError 36 | 37 | // More info: 38 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#function_scope 39 | // http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let 40 | // http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const -------------------------------------------------------------------------------- /Ch06/06_08/transcript.js: -------------------------------------------------------------------------------- 1 | // Before: 2 | const speak = function () { 3 | console.log("Arf"); 4 | console.log("Woof"); 5 | console.log("Meow"); 6 | console.log("Moooooooooooo"); 7 | }; 8 | 9 | // After: 10 | const speak = () => { 11 | console.log("Arf"); 12 | console.log("Woof"); 13 | console.log("Meow"); 14 | console.log("Moooooooooooo"); 15 | }; 16 | 17 | // Before: 18 | function isEven(num) { 19 | return num % 2 === 0; 20 | } 21 | 22 | // After: 23 | let isEven = (num) => { 24 | return num % 2 === 0; 25 | }; 26 | 27 | // or: 28 | isEven = (num) => num % 2 === 0; 29 | 30 | // And most succinctly: 31 | // prettier-ignore 32 | isEven = num => num % 2 === 0; 33 | 34 | // More info: 35 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions 36 | -------------------------------------------------------------------------------- /Ch06/06_09/transcript.js: -------------------------------------------------------------------------------- 1 | // function addingMachine(...terms) 2 | 3 | function addingMachine(...terms) { 4 | // initialize the total we'll be returning 5 | var total = 0; 6 | 7 | // this used to be `arguments` instead of `terms` 8 | for (var i = 0; i < terms.length; i += 1) { 9 | // grab the next number 10 | var number = terms[i]; 11 | 12 | // check if the argument is a number. 13 | // if so, add it to the running total 14 | if (typeof number === "number") { 15 | total += number; 16 | } 17 | } 18 | 19 | // done - return the total 20 | return total; 21 | } 22 | 23 | function bake(temp = 350, time = 35, ...flavors) { 24 | console.log(`Let's bake this cake at ${temp} degrees,`); 25 | console.log(`for ${time} minutes\n`); 26 | 27 | if (flavors.length > 0) { 28 | console.log("And let's not forget these flavors", flavors); 29 | } 30 | 31 | console.log("Arguments contains everything", arguments); 32 | } 33 | 34 | bake(425, 30, 'chocolate', 'lemon', 'black forest'); 35 | bake(300, 30, 'vanilla'); 36 | bake(); 37 | 38 | // More info: 39 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters 40 | -------------------------------------------------------------------------------- /Ch06/06_10/transcript.js: -------------------------------------------------------------------------------- 1 | function doubleIt(number) { 2 | return (number *= 2); 3 | } 4 | 5 | var myNumbers = [1, 2, 3, 4, 5]; 6 | 7 | var myDoubles = myNumbers.map(doubleIt); 8 | 9 | myNumbers.forEach(function (number) { 10 | console.log("My array contains", number); 11 | }); 12 | 13 | myNumbers.forEach((number) => { 14 | console.log("My array contains", number); 15 | }); 16 | 17 | // this is a browser-based example 18 | const myTextField = document.getElementById("myTextField"); 19 | myTextField.addEventListener("keyup", () => { 20 | console.log("Someone is typing!"); 21 | }); 22 | 23 | // https://developer.mozilla.org/en-US/docs/Glossary/Callback_function 24 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map 25 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach 26 | // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every 27 | -------------------------------------------------------------------------------- /Ch07/07_02/examples.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Callbacks 3 | */ 4 | 5 | // With one, it's simple enough 6 | jQuery.get("https://httpbin.org/get?data=1", function(response) { 7 | // Now I have some data 8 | }); 9 | 10 | // Callbacks get nested ad infinitum 11 | jQuery.get("https://httpbin.org/get", function(response) { 12 | // Now I have some data 13 | 14 | jQuery.get("https://httpbin.org/get", function(response) { 15 | // Now I have some more data 16 | 17 | jQuery.get("https://httpbin.org/get", function(response) { 18 | // Now I have even more data! 19 | }); 20 | }); 21 | }); 22 | 23 | /** 24 | * Promises 25 | */ 26 | 27 | // One Promise 28 | axios.get("https://httpbin.org/get").then(function(response) { 29 | // now I have some data 30 | }); 31 | 32 | // Multiple promises in sequence, no nesting 33 | axios 34 | .get("https://httpbin.org/get") 35 | .then(function(response) { 36 | // now I have some data 37 | 38 | return axios.get("https://httpbin.org/get"); 39 | }) 40 | .then(function(response) { 41 | // now I have some data 42 | 43 | return axios.get("https://httpbin.org/get"); 44 | }); 45 | 46 | /** 47 | * Async / Await 48 | */ 49 | 50 | // One request 51 | async function getOneThing() { 52 | var response = await axios.get("https://httpbin.org/get"); 53 | 54 | // now I have some data 55 | } 56 | 57 | // Multiple requests 58 | async function getLotsOfThings() { 59 | var response1 = await axios.get("https://httpbin.org/get"); 60 | var response2 = await axios.get("https://httpbin.org/get"); 61 | var response3 = await axios.get("https://httpbin.org/get"); 62 | 63 | // Now I have lots of data 64 | } 65 | -------------------------------------------------------------------------------- /Ch07/07_03/examples.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Classes 3 | */ 4 | 5 | let Cake = {}; 6 | 7 | Cake.prototype.bake = function(temp, minutes) { 8 | // Bake a cake at a particular temperature 9 | // for a number of minutes 10 | } 11 | 12 | class CakeClass { 13 | bake(temp, minutes) { 14 | 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | LinkedIn Learning Exercise Files License Agreement 2 | ================================================== 3 | 4 | This License Agreement (the "Agreement") is a binding legal agreement 5 | between you (as an individual or entity, as applicable) and LinkedIn 6 | Corporation (“LinkedIn”). By downloading or using the LinkedIn Learning 7 | exercise files in this repository (“Licensed Materials”), you agree to 8 | be bound by the terms of this Agreement. If you do not agree to these 9 | terms, do not download or use the Licensed Materials. 10 | 11 | 1. License. 12 | - a. Subject to the terms of this Agreement, LinkedIn hereby grants LinkedIn 13 | members during their LinkedIn Learning subscription a non-exclusive, 14 | non-transferable copyright license, for internal use only, to 1) make a 15 | reasonable number of copies of the Licensed Materials, and 2) make 16 | derivative works of the Licensed Materials for the sole purpose of 17 | practicing skills taught in LinkedIn Learning courses. 18 | - b. Distribution. Unless otherwise noted in the Licensed Materials, subject 19 | to the terms of this Agreement, LinkedIn hereby grants LinkedIn members 20 | with a LinkedIn Learning subscription a non-exclusive, non-transferable 21 | copyright license to distribute the Licensed Materials, except the 22 | Licensed Materials may not be included in any product or service (or 23 | otherwise used) to instruct or educate others. 24 | 25 | 2. Restrictions and Intellectual Property. 26 | - a. You may not to use, modify, copy, make derivative works of, publish, 27 | distribute, rent, lease, sell, sublicense, assign or otherwise transfer the 28 | Licensed Materials, except as expressly set forth above in Section 1. 29 | - b. Linkedin (and its licensors) retains its intellectual property rights 30 | in the Licensed Materials. Except as expressly set forth in Section 1, 31 | LinkedIn grants no licenses. 32 | - c. You indemnify LinkedIn and its licensors and affiliates for i) any 33 | alleged infringement or misappropriation of any intellectual property rights 34 | of any third party based on modifications you make to the Licensed Materials, 35 | ii) any claims arising from your use or distribution of all or part of the 36 | Licensed Materials and iii) a breach of this Agreement. You will defend, hold 37 | harmless, and indemnify LinkedIn and its affiliates (and our and their 38 | respective employees, shareholders, and directors) from any claim or action 39 | brought by a third party, including all damages, liabilities, costs and 40 | expenses, including reasonable attorneys’ fees, to the extent resulting from, 41 | alleged to have resulted from, or in connection with: (a) your breach of your 42 | obligations herein; or (b) your use or distribution of any Licensed Materials. 43 | 44 | 3. Open source. This code may include open source software, which may be 45 | subject to other license terms as provided in the files. 46 | 47 | 4. Warranty Disclaimer. LINKEDIN PROVIDES THE LICENSED MATERIALS ON AN “AS IS” 48 | AND “AS AVAILABLE” BASIS. LINKEDIN MAKES NO REPRESENTATION OR WARRANTY, 49 | WHETHER EXPRESS OR IMPLIED, ABOUT THE LICENSED MATERIALS, INCLUDING ANY 50 | REPRESENTATION THAT THE LICENSED MATERIALS WILL BE FREE OF ERRORS, BUGS OR 51 | INTERRUPTIONS, OR THAT THE LICENSED MATERIALS ARE ACCURATE, COMPLETE OR 52 | OTHERWISE VALID. TO THE FULLEST EXTENT PERMITTED BY LAW, LINKEDIN AND ITS 53 | AFFILIATES DISCLAIM ANY IMPLIED OR STATUTORY WARRANTY OR CONDITION, INCLUDING 54 | ANY IMPLIED WARRANTY OR CONDITION OF MERCHANTABILITY OR FITNESS FOR A 55 | PARTICULAR PURPOSE, AVAILABILITY, SECURITY, TITLE AND/OR NON-INFRINGEMENT. 56 | YOUR USE OF THE LICENSED MATERIALS IS AT YOUR OWN DISCRETION AND RISK, AND 57 | YOU WILL BE SOLELY RESPONSIBLE FOR ANY DAMAGE THAT RESULTS FROM USE OF THE 58 | LICENSED MATERIALS TO YOUR COMPUTER SYSTEM OR LOSS OF DATA. NO ADVICE OR 59 | INFORMATION, WHETHER ORAL OR WRITTEN, OBTAINED BY YOU FROM US OR THROUGH OR 60 | FROM THE LICENSED MATERIALS WILL CREATE ANY WARRANTY OR CONDITION NOT 61 | EXPRESSLY STATED IN THESE TERMS. 62 | 63 | 5. Limitation of Liability. LINKEDIN SHALL NOT BE LIABLE FOR ANY INDIRECT, 64 | INCIDENTAL, SPECIAL, PUNITIVE, CONSEQUENTIAL OR EXEMPLARY DAMAGES, INCLUDING 65 | BUT NOT LIMITED TO, DAMAGES FOR LOSS OF PROFITS, GOODWILL, USE, DATA OR OTHER 66 | INTANGIBLE LOSSES . IN NO EVENT WILL LINKEDIN'S AGGREGATE LIABILITY TO YOU 67 | EXCEED $100. THIS LIMITATION OF LIABILITY SHALL: 68 | - i. APPLY REGARDLESS OF WHETHER (A) YOU BASE YOUR CLAIM ON CONTRACT, TORT, 69 | STATUTE, OR ANY OTHER LEGAL THEORY, (B) WE KNEW OR SHOULD HAVE KNOWN ABOUT 70 | THE POSSIBILITY OF SUCH DAMAGES, OR (C) THE LIMITED REMEDIES PROVIDED IN THIS 71 | SECTION FAIL OF THEIR ESSENTIAL PURPOSE; AND 72 | - ii. NOT APPLY TO ANY DAMAGE THAT LINKEDIN MAY CAUSE YOU INTENTIONALLY OR 73 | KNOWINGLY IN VIOLATION OF THESE TERMS OR APPLICABLE LAW, OR AS OTHERWISE 74 | MANDATED BY APPLICABLE LAW THAT CANNOT BE DISCLAIMED IN THESE TERMS. 75 | 76 | 6. Termination. This Agreement automatically terminates upon your breach of 77 | this Agreement or termination of your LinkedIn Learning subscription. On 78 | termination, all licenses granted under this Agreement will terminate 79 | immediately and you will delete the Licensed Materials. Sections 2-7 of this 80 | Agreement survive any termination of this Agreement. LinkedIn may discontinue 81 | the availability of some or all of the Licensed Materials at any time for any 82 | reason. 83 | 84 | 7. Miscellaneous. This Agreement will be governed by and construed in 85 | accordance with the laws of the State of California without regard to conflict 86 | of laws principles. The exclusive forum for any disputes arising out of or 87 | relating to this Agreement shall be an appropriate federal or state court 88 | sitting in the County of Santa Clara, State of California. If LinkedIn does 89 | not act to enforce a breach of this Agreement, that does not mean that 90 | LinkedIn has waived its right to enforce this Agreement. The Agreement does 91 | not create a partnership, agency relationship, or joint venture between the 92 | parties. Neither party has the power or authority to bind the other or to 93 | create any obligation or responsibility on behalf of the other. You may not, 94 | without LinkedIn’s prior written consent, assign or delegate any rights or 95 | obligations under these terms, including in connection with a change of 96 | control. Any purported assignment and delegation shall be ineffective. The 97 | Agreement shall bind and inure to the benefit of the parties, their respective 98 | successors and permitted assigns. If any provision of the Agreement is 99 | unenforceable, that provision will be modified to render it enforceable to the 100 | extent possible to give effect to the parties’ intentions and the remaining 101 | provisions will not be affected. This Agreement is the only agreement between 102 | you and LinkedIn regarding the Licensed Materials, and supersedes all prior 103 | agreements relating to the Licensed Materials. 104 | 105 | Last Updated: March 2019 106 | -------------------------------------------------------------------------------- /NOTICE: -------------------------------------------------------------------------------- 1 | Copyright 2023 LinkedIn Corporation 2 | All Rights Reserved. 3 | 4 | Licensed under the LinkedIn Learning Exercise File License (the "License"). 5 | See LICENSE in the project root for license information. 6 | 7 | Please note, this project may automatically load third party code from external 8 | repositories (for example, NPM modules, Composer packages, or other dependencies). 9 | If so, such third party code may be subject to other license terms than as set 10 | forth above. In addition, such third party code may also depend on and load 11 | multiple tiers of dependencies. Please review the applicable licenses of the 12 | additional dependencies. 13 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Learning the JavaScript Language 2 | This is the repository for the LinkedIn Learning course Learning the JavaScript Language. The full course is available from [LinkedIn Learning][lil-course-url]. 3 | 4 | ![Learning the JavaScript Language][lil-thumbnail-url] 5 | 6 | JavaScript is one of the most popular programming languages in the world, used to create dynamic websites along with a host of other applications. And like any language—whether spoken language or programming language—it takes time and practice to become conversant. In this course, Joe Chellman teaches you how to “speak” JavaScript by familiarizing yourself with the most commonly encountered topics and concepts. Joe starts out with some basic JavaScript syntax and jargon, then covers what you need to know about in the JavaScript toolbox, including variables, types, objects, arrays, operators, control structures, loops, and functions. Join Joe in this course to start your path toward JavaScript fluency and unlock the power of this popular language. 7 | 8 | 9 | ### Instructor 10 | 11 | Joe Chellman 12 | 13 | Web Developer 14 | 15 | 16 | 17 | Check out my other courses on [LinkedIn Learning](https://www.linkedin.com/learning/instructors/joe-chellman). 18 | 19 | [lil-course-url]: https://www.linkedin.com/learning/learning-the-javascript-language-22309208?dApp=59033956&leis=LAA 20 | [lil-thumbnail-url]: https://media.licdn.com/dms/image/D560DAQEpa5LhtPUlUg/learning-public-crop_675_1200/0/1683586021773?e=2147483647&v=beta&t=vRDAZPrFPLsfXDXkELzJbOrrJL7wKNCAAkAro6e2Fpw 21 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LinkedInLearning/learning-the-javascript-language-4369302/9998fbd5acbe838b56aa09cd811e4107316fac02/favicon.ico -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "learningjs-exercise-files", 3 | "version": "1.0.0", 4 | "lockfileVersion": 2, 5 | "requires": true, 6 | "packages": { 7 | "": { 8 | "name": "learningjs-exercise-files", 9 | "version": "1.0.0", 10 | "license": "ISC", 11 | "dependencies": { 12 | "prettier": "^2.8.1", 13 | "readline-sync": "^1.4.10" 14 | } 15 | }, 16 | "node_modules/prettier": { 17 | "version": "2.8.2", 18 | "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.2.tgz", 19 | "integrity": "sha512-BtRV9BcncDyI2tsuS19zzhzoxD8Dh8LiCx7j7tHzrkz8GFXAexeWFdi22mjE1d16dftH2qNaytVxqiRTGlMfpw==", 20 | "bin": { 21 | "prettier": "bin-prettier.js" 22 | }, 23 | "engines": { 24 | "node": ">=10.13.0" 25 | }, 26 | "funding": { 27 | "url": "https://github.com/prettier/prettier?sponsor=1" 28 | } 29 | }, 30 | "node_modules/readline-sync": { 31 | "version": "1.4.10", 32 | "resolved": "https://registry.npmjs.org/readline-sync/-/readline-sync-1.4.10.tgz", 33 | "integrity": "sha512-gNva8/6UAe8QYepIQH/jQ2qn91Qj0B9sYjMBBs3QOB8F2CXcKgLxQaJRP76sWVRQt+QU+8fAkCbCvjjMFu7Ycw==", 34 | "engines": { 35 | "node": ">= 0.8.0" 36 | } 37 | } 38 | }, 39 | "dependencies": { 40 | "prettier": { 41 | "version": "2.8.2", 42 | "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.2.tgz", 43 | "integrity": "sha512-BtRV9BcncDyI2tsuS19zzhzoxD8Dh8LiCx7j7tHzrkz8GFXAexeWFdi22mjE1d16dftH2qNaytVxqiRTGlMfpw==" 44 | }, 45 | "readline-sync": { 46 | "version": "1.4.10", 47 | "resolved": "https://registry.npmjs.org/readline-sync/-/readline-sync-1.4.10.tgz", 48 | "integrity": "sha512-gNva8/6UAe8QYepIQH/jQ2qn91Qj0B9sYjMBBs3QOB8F2CXcKgLxQaJRP76sWVRQt+QU+8fAkCbCvjjMFu7Ycw==" 49 | } 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "learningjs-exercise-files", 3 | "version": "1.0.0", 4 | "description": "Exercise files for Learning the JavaScript Language", 5 | "author": "Joe Chellman", 6 | "license": "ISC", 7 | "dependencies": { 8 | "prettier": "^2.8.1", 9 | "readline-sync": "^1.4.10" 10 | } 11 | } 12 | --------------------------------------------------------------------------------