这是我参与「第四届青训营」笔记创作活动的第6天

1语言结构

js写在<script></script> 里面，例如

<!DOCTYPE HTML>
<html>

<body>

  <p>script 标签之前...</p>

  <script>
    alert('Hello, world!');
  </script>

  <p>...script 标签之后</p>

</body>

</html>
外部脚本:   <script src="/path/to/script.js">  </script>
多个脚本写多个特性就行:
<script src="/path/to/script1.js">  </script>
<script src="/path/to/script2.js">  </script>
<script src="/path/to/script3.js">  </script>

注意 如果设置了 src 特性， script 标签内容将会被忽略

<script src="file.js">
  alert(1); // 此内容会被忽略，因为设定了 src
</script>

1.1组成

ECMAScpriipt

规定了js基础语法的核心知识，例如变量、分支、循环、对象等等

Web APIs:

dom：操作文档，比如对页面进行移动、大小、添加删除等操作

bom: 操作浏览器，比如页面弹窗，检测窗口宽度、存储数据到浏览器等等

2代码结构

大部分时候可以省略分号，但是最好不要省略分号，尤其对新手来说。

3现代模式，"use strict"

JavaScript在更新过程中没有对旧版本进行修改，虽然这样保证了兼容性，但是其错误也不能被改正

于是有了 use strict 使其修改了错误，也就是进入现代模式

确保 “use strict” 出现在最顶部

alert("some code");
// 下面的 "use strict" 会被忽略，必须在最顶部。

"use strict";

// 严格模式没有被激活

4变量

let message;
message = 'Hello!';

alert(message); // 显示变量内容

let message = "This";

// 重复 'let' 会导致 error
let message = "That"; // SyntaxError: 'message' has already been declared

4.1变量命名

JavaScript 的变量命名有两个限制：

变量名称必须仅包含字母、数字、符号 $ 和 _。
首字符必须非数字。
区分大小写（APPLE和apple是两个不同变量）

5数据类型

数字型

字符串型

布尔型：只有true和false

未定义类型：undefined 只声名变量不赋值的情况下，变量都是undefined

开发场景：检测变量若是undefined，就说明没有值传递过来

空类型: null ，将来有个变量里面存放的是对象，但是对象还没创建好，先给赋值个null

null和undefined的区别

null赋值了，但是为空；undefined是没有赋值的情况

6模板字符串

    <script>
        let age = prompt('请输入你的年龄')
        document.write('我今年'+age+'岁啦！')
        document.write(`我今年${age}岁啦！`)
        document.write(`<h1>我今年${age}岁啦！</h1>`)
     </script>

7判断数据类型

1、通过控制台颜色

<script>
        let a = 10;                    //数字
        let b = "hello";               //字符串
        let c = true;                  //布尔
        let d;                         //undefined
        let e = null;                  //null
        let f = [1,2,3,4,5,6];         //数组
        let g = {};                    //对象

        console.log(a)
        console.log(b)
        console.log(true)
        console.log(d)
        console.log(e)
        console.log(f)
        console.log(g)
</script>

2、利用typeof关键字

    <script>
        console.log(typeof'123')
        console.log(typeof 123)
     </script>

8数据类型转换

8.1隐式转换

规则：

+号左右只要有一个字符串，会把另一个转换为字符串类型
除了加号以外，有 - * /时，把另一个转换为数字类型

小技巧：

let num = '10'
console.log(num)  //10 string
console.log(+num) //10 number
console.log(-num) //-10 number

8.2显式类型转换

利用Number,String,Boolean进行强转

其中对与Number有：

    <script>
        console.log(parseInt('10.11'))//字符串转换成int型
        console.log(parseFloat('10.11'))//保留小数
        console.log(parseFloat('123abc'))//123 抹去abc
        //注意parseFloat只能过滤以数字为开头的字符串，abc123abc则是NaN
        console.log(Number('123abc'))//NaN 表示Not a number
        //NaN是number类型的数据，表示非数字
    </script>

其中对与String有：

//第一种
console.log(Stirng(10))
//第二种
let age = 10
console.log(age.toString()) //10
console.log(age.toString(2))    //二进制的10，1010

JavaScript速成 | 青训营笔记