方式1
在HTML代码中直接使用：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=<device-width>, initial-scale=1.0"> <title>Document</title> </head> <body> <header> <h1>JS Crash Course</h1> </header> <!-- 一般在body的最后写javascript代码，因为希望html页面和css样式加载好后再执行JavaScript代码 --> <script> alert('Hello World!') </script> </body> </html>方式2
调用单独的js文件，可以在和html文件同级目录下新建一个.js文件，然后在html文件中调用即可
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=<device-width>, initial-scale=1.0"> <title>Document</title> </head> <body> <header> <h1>JS Crash Course</h1> </header> <!-- 一般在body的最后写javascript代码，因为希望html页面和css样式加载好后再执行JavaScript代码 --> <!-- 调用js代码 --> <script src="main.js"></script> </body> </html>js代码：
alert('Hello World!')方式一和方式二输出结果都是一样的，出现一个Hello World的弹窗。
Console 对象用于 JavaScript 调试。常见的两个用途
显示网页代码运行时的错误信息提供了一个命令行接口，用来与网页代码互动。Console窗口可以在浏览器的开发者选项中找到
方法描述assert()ssert方法接受两个参数，第一个参数是表达式，第二个参数是字符串。只有当第一个参数为false，才会输出第二个参数，否则不会有任何结果。clear()清除当前控制台的所有输出，将光标回置到第一行。count()用于计数，输出它被调用了多少次。error()输出信息时，在最前面加一个红色的叉，表示出错，同时会显示错误发生的堆栈。group()用于将显示的信息分组，可以把信息进行折叠和展开。groupCollapsed()与console.group方法很类似，唯一的区别是该组的内容，在第一次显示时是收起的（collapsed），而不是展开的。groupEnd()结束内联分组info()console.log 别名，输出信息log()输出信息table()将复合类型的数据转为表格显示。time()计时开始timeEnd()计时结束trace()追踪函数的调用过程warn()输出警告信息JS代码：
console.log('Hello World') console.warn('This is a warn') console.error('This is an error')实现效果：
常用有三种变量定义方式：var,let,const，而var是全局定义，有时会造成不必要的麻烦，所以一般使用let和const
let用于定义变量，const用与定义常量（值不能进行修改）
let score; score = 10; console.log(score);然后就能在console中输出10
主要的数据类型有：string, numbers, boolean, null, undefined，symbol（symbol在ES6中提出，在此没有介绍）
可以看下面一个简单的例子轻松了解（js代码）：
// string, numbers, boolean, null, undefined const name = 'John'; //String const age = 30; //Numbers const rating = 0.8; //Numbers const isCool = true; //Boolean const x = null; //null const y = undefined; //undefined let z; //undefined console.log(typeof name) console.log(typeof age) console.log(typeof rating) console.log(typeof isCool) console.log(typeof x) console.log(typeof y) console.log(typeof z)console输出结果：
关于字符串的一些更多的说明
由于经常会涉及一些字符串的一些操作，所以简单介绍以下，看下面代码就能很快理解一些方法。
//字符串的使用 const name = 'John'; //String const age = 30; //Numbers //字符串拼接 console.log('My name is ' + name + ' and my age is ' + age); //模板字符串 console.log(`My name is ${name} and my age is ${age}`) //获取字符串的长度 console.log(name.length) //大写 console.log(name.toUpperCase()) //小写 console.log(name.toLowerCase()) //获取字串,参数填写始末位置 console.log(name.substring(0,2)) //分割字符串,参数填写要以什么字符作为为分割依据 //这里没有填写任何字符，所以会将原字符串分割为单个的字符 console.log(name.split(''))输出结果
JS的数组使用起来非常方便，而且其数组不要求数组元素的数据类型相同（这在许多其他编程语言中都是不允许的）
可以参考以下代码快速了解JS数组
//数组 //数组的两种定义方式，一般用第二种 //JS的数组不要求同一数组的数据类型相同，可参考第二个数组的定义 const numbers = new Array(1,2,3,4,5); const fruits = ['apples', 'oranges', 'pears', 1, true]; //在末尾添加元素的两种方法 //（const定义的数组是可以添加元素的，只是不能重新定义） fruits[5] = 'grapes'; fruits.push('grapes'); //往数组头添加元素 fruits.unshift('strawberries'); //获取元素下标 console.log(fruits.indexOf('apples')); //判断是否为数组 console.log(Array.isArray(fruits)); //打印数组 console.log(fruits);输出结果：
JS对象其实就是键值对，和JSON格式非常相似，可以参考下面代码快速入门
//对象的定义 const person = { firstName: 'John', lastName: 'Doe', age: 30, hobbies: ['music', 'movies', 'sports'], //对象的嵌套定义 address: { street: '50 main st', city: 'Boston', state: 'MA' } } //输出整个对象 console.log(person); //输出对象的键值 console.log(person.firstName, person.hobbies[1], person.address.city); //对象的解构 const {firstName, lastName, address:{ city }} = person; console.log(firstName, lastName, city); //对象添加属性 person.email = 'John@gmail.com'; console.log(person.email)输出结果：
数组中存储对象
数组中存储对象，与JSON格式更为相似了，但是JSON要求的键名为字符串，并且JSON只能用双引号（JS单双引号都可以），所以可以将存储对象的数组直接转化为JSON。
可以尝试下面代码轻松了解
//数组中存储对象 const todos = [ { id:1, text: 'Take out trash', isCompleted: true }, { id:2, text:'Meeting with boss', isCompleted: true }, { id:3, text:'Dentist', isCompleted: false } ]; //输出一个对象的键值 console.log(todos[1].text) //转化为JSON const todoJSON = JSON.stringify(todos) console.log(todos)输出结果：
Map就是一组键值对（构成一个一一映射），比较好理解，直接上代码：
var m = new Map(); m.set('Adam', 67); m.set('Bob', 59); console.log(m.has('Adam')); // 是否存在Adam console.log(m.get('Adam')); // 67 m.delete('Adam'); // 删除Adam console.log(m.has('Adam'));Set就是集合，集合的特性就是不存在相同的元素（重复元素会被去除）
var s = new Set([1,2,3]); s.add(3); // 添加元素 for(var x of s){ console.log(x); } s.delete(3); // 删除元素 for(var x of s){ console.log(x); }[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eZj8x9Pu-1599235932823)(https://s1.ax1x.com/2020/09/04/wAr9yj.png)]
使用迭代器可以访问数组、Map、Set等结构，有两种写法for...in和for...of，其中for...in是访问属性名称，而for...of则是直接访问其中的元素。
var s = ['a','b','c']; for(var x in s){ console.log(x); } for(var x of s){ console.log(x); }