课程链接
注释
//
输出
变量与常量
变量
var
(少用)
let
(常用)
1 2 3 4 let age = 30 ;age = 31 ; console .log (age);
输出结果
常量
const
需要在声明时赋值。本身不可变。若声明的是数组或对象,其内部元素可变,只是不能将整个数组或对象完全更改.
原生数据类型
string, number, boolean, null, undefined
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 const username = 'John' ;const age = 30 ;const rate = 4.5 ; const isCool = true ;const x = null ;const y = undefined ;let z;console .log (typeof username);console .log (typeof age);console .log (typeof rate);console .log (typeof isCool);console .log (typeof x);console .log (typeof y);console .log (typeof z);
输出结果
1 2 3 4 5 6 7 string number number boolean object undefined undefined
模板字符串
1 2 3 4 5 6 const username = 'John' ;const age = 30 ;console .log ("My name is " + username + " and I am " + age +" years old." );console .log (`My name is ${username} and I am ${age} years old.` );
输出结果
1 2 My name is John and I am 30 years old. My name is John and I am 30 years old.
字符串的内置方法
1 2 3 4 5 6 7 const s = "hello world" ;console .log (s.length ); console .log (s.toUpperCase ()); console .log (s.toLowerCase ()); console .log (s.substring (1 , 3 )); console .log (s.split (" " ));
输出结果
1 2 3 4 5 11 HELLO WORLD hello world el [ 'hello' , 'world' ]
数组
1 2 3 4 5 6 7 8 9 10 11 const fruits = ['apple' , 'banana' , 'orange' ];fruits[3 ] = "grape" ; fruits.push ("mango" ); fruits.unshift ("lemon" ); fruits.pop (); fruits.shift (); console .log (fruits[3 ]);console .log (Array .isArray (fruits)); console .log (fruits.indexOf ("banana" ));
输出结果
对象
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 const person = { name : 'John' , age : 30 , isMarried : true , skills : ['JavaScript' , 'React' , 'Node.js' ], address :{ street : '123 Main St' , city : 'New York' , state : 'NY' } }; console .log (person.name );console .log (person.age );console .log (person.isMarried );console .log (person.skills [0 ]);console .log (person.address .street );const {name, age, isMarried, skills, address :{city}} = person; console .log (city);person.email = 'john@example.com' ; console .log (person.email );
输出结果
1 2 3 4 5 6 7 John 30 true JavaScript 123 Main St New York john@example.com
对象数组与 Json
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 const todos = [ { id : 1 , content : "HTML" , isCompleted : false }, { id : 2 , content : "CSS" , isCompleted : true }, { id : 3 , content : "Javascript" , isCompleted : false } ]; console .log (todos[1 ].content );const todosJSON = JSON .stringify (todos); console .log (todosJSON);
输出结果
1 2 CSS [{"id" :1,"content" :"HTML" ,"isCompleted" :false },{"id" :2,"content" :"CSS" ,"isCompleted" :true },{"id" :3,"content" :"Javascript" ,"isCompleted" :false }]
逻辑运算符
与 &&
或 ||
非 !
if 条件语句
1 2 3 4 5 6 7 8 9 const x = 10 ;if (x === 10 ) { console .log ("x is 10" ); } else if (x > 10 ) { console .log ("x is greater than 10" ); } else { console .log ("x is less than 10" ); }
输出结果
三目运算符
1 2 3 const x = 11 ;const colour = x > 10 ? "red" : "blue" ; console .log (colour);
输出结果
Switch 语句
1 2 3 4 5 6 7 8 9 10 11 12 13 const x = 11 ;const colour = x > 10 ? "red" : "blue" ;switch (colour){ case "red" : console .log ("colour is red" ); break ; case "blue" : console .log ("colour is blue" ); break ; default : console .log ("colour is not red or blue" ); }
输出结果
循环语句
for
1 2 3 for (let i = 0 ; i < 3 ; i++) { console .log (i); }
输出结果
while
1 2 3 4 5 let i = 0 ;while (i < 3 ) { console .log (i); i++; }
输出结果
do-while
1 2 3 4 5 let j = 0 ;do { console .log (j); j++; } while (j < 3 );
遍历对象数组
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 const todos = [ { id : 1 , content : "HTML" , isCompleted : false }, { id : 2 , content : "CSS" , isCompleted : true }, { id : 3 , content : "Javascript" , isCompleted : false } ]; for (let i = 0 ; i < todos.length ; i++) { console .log (todos[i].content ); } for (let todo of todos) { console .log (todo.id ); }
输出结果
1 2 3 4 5 6 HTML CSS Javascript 1 2 3