Javascript入门速成课1 弹窗，console，变量与数据类型

1.js的document.write() 在script标签内使用直接写入html输出流中

<script>
        document.write("<h1>这是一个标题</h1>")
        document.write("<p>这是一个段落</p>")
</script>

2.alert()和console

alert() 弹窗方便测试程序如下：在button中使用

<button type="button" onclick="alert('欢迎！')">点击此显示欢迎</button>

先弹出弹窗，后在控制台输出、错误、警告
index.html中的代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS Crash Course from YouTube</title>
</head>
<body>
   <header>
        <h1>hahaha</h1>
   </header>
   
   <script src="main.js">
       
   </script>
</body>
</html>

main.js中的代码

alert('Hello World 20211001');
//after alert window closed, following code will be executed:
console.log("Hello ke hahaha");
//show in browser devtool console
console.error("This is an error");
//error 
console.warn("This is a warning");

3.变量

三种声明变量的方法 var let const
let const 是在ES6或ES2015新加入的
let可重新赋值

/*
下面这种方式会报错，因为const是常量
const age = 30;
age = 31;
console.log(age);
*/

let age = 30;
age = 31;
console.log(age);

除非要重新赋值，否则可以设成const
使用const必须设初值

4.数据类型（data types）

String,Numbers,Boolean,null,undefined,Symbol(ES6新增)

const name = "John";//或双引号
const age = 30;
const rating = 4.5
const isCool = true;//注意没有引号
const x = null;//
const y = undefined;
let z;
console.log(typeof name)
//Notes:“name”已弃用。ts(6385)
//Notes:lib.dom.d.ts(18305, 5): 该声明曾在此处标记为已弃用。
console.log(typeof age)
console.log(typeof rating)
console.log(typeof isCool)
console.log(typeof x)
console.log(typeof y)

chrome调试器显示：
string
number
number
boolean
object
undefined

5.String拼接方法:

传统方法：拼接concatenation

console.log("My name is " + name + " and I am " + age);

//ES6新方法：

console.log(`My name is ${name} and I am ${age}`);

//注意，这里是`不是'

const s = 'Hello World !';
console.log(s.length);//长度
console.log(s.toLowerCase());//变小写
console.log(s.toUpperCase());//变大写
console.log(s.substring(0,7));//左闭右开
console.log(s.split(''))//
console.log(s.split(' '))//以空格分隔

const words = 'hie, sjdbv, ejksb.jjsidb'
console.log(words.split(', '))

本文可运行的完整代码：

alert('Hello World 20211001');
//after alert window closed, following code will be executed:
console.log("Hello ke hahaha");
//show in browser devtool console
console.error("This is an error");
//error 
console.warn("This is a warning");

//三种声明变量的方法 var let const
//let const 是在ES6或ES2015新加入的
//let可重新赋值
/*
下面这种方式会报错，因为const是常量
const age = 30;
age = 31;
console.log(age);
*/
let age1 = 30;
age1 = 31;
console.log(age1);
// //除非要重新赋值，否则可以设成const
// //使用const必须设初值


//数据类型data types
//String,Numbers,Boolean,null,undefined,Symbol(ES6新增)
const name = "John";//或双引号
const age = 30;
const rating = 4.5
const isCool = true;//注意没有引号
const x = null;//
const y = undefined;
let z;
console.log(typeof name)
//Notes:“name”已弃用。ts(6385)
//Notes:lib.dom.d.ts(18305, 5): 该声明曾在此处标记为已弃用。
console.log(typeof age)
console.log(typeof rating)
console.log(typeof isCool)
console.log(typeof x)
console.log(typeof y)
/* chrome调试器显示：
string
number
number
boolean
object
undefined
*/

//String拼接方法:

//传统方法：拼接concatenation
console.log("My name is " + name + " and I am " + age);

//ES6新方法：
console.log(`My name is ${name} and I am ${age}`);
//注意，这里是`不是'

const s = 'Hello World !';
console.log(s.length);//长度
console.log(s.toLowerCase());//变小写
console.log(s.toUpperCase());//变大写
console.log(s.substring(0,7));//左闭右开
console.log(s.split(''))//
console.log(s.split(' '))//以空格分隔

const words = 'hie, sjdbv, ejksb.jjsidb'
console.log(words.split(', '))