|
18 | 18 | } |
19 | 19 |
|
20 | 20 | // Regular |
| 21 | + console.log('anything'); |
21 | 22 |
|
22 | 23 | // Interpolated |
| 24 | + console.log('this is a %s string!', 'word'); |
| 25 | + //better version of that ^ is this: |
| 26 | + const word = 'word'; |
| 27 | + console.log(`this is a ${word} string!`); |
23 | 28 |
|
24 | 29 | // Styled |
| 30 | + console.log('%c I am some great text', 'font-size: 50px'); |
| 31 | + //changes the font size in the console |
25 | 32 |
|
26 | 33 | // warning! |
| 34 | + console.warn('sample warning'); |
| 35 | + //will give you stack trace as to where the error was called |
27 | 36 |
|
28 | 37 | // Error :| |
| 38 | + console.error('sample error'); |
| 39 | + //will display error and give you stack trace |
29 | 40 |
|
30 | 41 | // Info |
| 42 | + console.info('info statement'); |
31 | 43 |
|
32 | 44 | // Testing |
| 45 | + console.assert(1 === 1, 'That is wrong'); |
| 46 | + //will tell you assertion failed; will only show up if it is false |
| 47 | + console.assert(4 === 1, 'That is wrong'); |
| 48 | + //this will print |
| 49 | + |
| 50 | + const p = document.querySelector('p'); |
| 51 | + console.assert(p.classList.contains('ouch'), 'That is incorrect'); |
33 | 52 |
|
34 | 53 | // clearing |
| 54 | + // console.clear(); |
| 55 | + |
35 | 56 |
|
36 | 57 | // Viewing DOM Elements |
| 58 | + console.dir(p); |
| 59 | + //gives you the dropdown of the properties and methods of the element |
37 | 60 |
|
38 | 61 | // Grouping together |
| 62 | + dogs.forEach(dog =>{ |
| 63 | + console.groupCollapsed(`${dog.name}`); |
| 64 | + // console.group(`${dog.name}`); |
| 65 | + console.log(`This is ${dog.name}`); |
| 66 | + console.log(`${dog.age} years old`); |
| 67 | + console.groupEnd(`${dog.name}`); |
| 68 | + |
| 69 | + }) |
| 70 | + |
39 | 71 |
|
40 | 72 | // counting |
| 73 | + console.count('Mention of things'); |
| 74 | + console.count('Mention of places'); |
| 75 | + console.count('Mention of places'); |
| 76 | + console.count('Mention of places'); |
| 77 | + console.count('Mention of people'); |
41 | 78 |
|
42 | 79 | // timing |
| 80 | + console.log('fetching data'); |
| 81 | + fetch('insert link here') |
| 82 | + .then(data => data.json()) |
| 83 | + .then(data=>{ |
| 84 | + console.timeEnd('fetching data'); |
| 85 | + console.log(data); |
| 86 | + }) |
| 87 | + //will tell you how long the fetch took |
| 88 | + |
| 89 | + console.table(dogs); |
| 90 | + //use for array of objects that have the same properties |
43 | 91 |
|
44 | 92 | </script> |
45 | 93 | </body> |
|
0 commit comments