File tree Expand file tree Collapse file tree
Day 09 - 14 Must Know Dev Tools Tricks Expand file tree Collapse file tree Original file line number Diff line number Diff line change 1+ <!DOCTYPE html>
2+ < html lang ="en ">
3+ < head >
4+ < meta charset ="UTF-8 " />
5+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge " />
6+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 " />
7+ < title > Console Tricks!</ title >
8+ </ head >
9+ < body >
10+ < p onClick ="makeGreen() "> ×BREAK×DOWN×</ p >
11+ < script src ="index.js "> </ script >
12+ </ body >
13+ </ html >
Original file line number Diff line number Diff line change 1+ const dogs = [
2+ { name : "Snickers" , age : 2 } ,
3+ { name : "Hugo" , age : 8 } ,
4+ ] ;
5+
6+ function makeGreen ( ) {
7+ const p = document . querySelector ( "p" ) ;
8+ p . style . color = "#BADA55" ;
9+ p . style . fontSize = "50px" ;
10+ }
11+
12+ // Regular
13+ console . log ( "Hello" ) ;
14+
15+ // Interpolated
16+ console . log ( "Hello I am a %s string" , "💩" ) ;
17+
18+ // Styled
19+ console . log (
20+ "%c I am some great text." ,
21+ "font-size:50px; background-color:yellow; text-shadow: 10px 10px 0 blue"
22+ ) ;
23+
24+ // warning!
25+ console . warn ( "OH NOOO" ) ;
26+
27+ // Error :|
28+ console . error ( "Shit" ) ;
29+
30+ // Info
31+ console . info ( "Crocodiles eat 3-4 people per year" ) ;
32+
33+ // Testing
34+ const p = document . querySelector ( "p" ) ;
35+ console . assert ( p . classList . contains ( "ouch" ) , "That is wrong!" ) ;
36+
37+ // clearing
38+ console . clear ( ) ;
39+
40+ // Viewing DOM Elements
41+ console . log ( p ) ;
42+ console . dir ( p ) ;
43+
44+ // Grouping together
45+ dogs . forEach ( ( dog ) => {
46+ // console.group(`${dog.name}`);
47+ console . groupCollapsed ( `${ dog . name } ) ;
48+ console . log ( `This is ${ dog . name } ) ;
49+ console . log ( `${ dog . name } ${ dog . age } ) ;
50+ console . log ( `${ dog . name } ${ dog . age * 7 } ) ;
51+ console . groupEnd ( `${ dog . name } ) ;
52+ } ) ;
53+
54+ // counting
55+ console . count ( "Wes" ) ;
56+ console . count ( "Wes" ) ;
57+ console . count ( "Steve" ) ;
58+ console . count ( "Steve" ) ;
59+ console . count ( "Wes" ) ;
60+ console . count ( "Wes" ) ;
61+ console . count ( "Steve" ) ;
62+ console . count ( "Steve" ) ;
63+ console . count ( "Wes" ) ;
64+ console . count ( "Steve" ) ;
65+ console . count ( "Steve" ) ;
66+ console . count ( "Wes" ) ;
67+ console . count ( "Wes" ) ;
68+ console . count ( "Steve" ) ;
69+ console . count ( "Steve" ) ;
70+ console . count ( "Wes" ) ;
71+
72+ // timing
73+ console . time ( "fetching data" ) ;
74+ fetch ( "https://api.github.com/users/Susmita-Dey" )
75+ . then ( ( data ) => data . json ( ) )
76+ . then ( ( data ) => {
77+ console . timeEnd ( "fetching data" ) ;
78+ console . log ( data ) ;
79+ } ) ;
80+
81+ // table
82+ console . table ( dogs ) ;
You can’t perform that action at this time.
0 commit comments