学习内容：JavaScript

文章目录

学习内容：JavaScript

1. JavaScript 介绍

Javascript 语言诞生主要是完成页面的数据验证。因此它运行在客户端，需要运行浏览器来解析执行 JavaScript 代码。
JS 是 Netscape 网景公司的产品，最早取名为 LiveScript;为了吸引更多 java 程序员。更名为 JavaScript。
JS 是弱类型，Java 是强类型。

2. JavaScript 和 html 代码的结合方式

2.1、第一种方式：在 head 标签中，或者在 body 标签中，使用 script 标签来书写 JavaScript 代码。
例：
（alert()方法的功能是弹出消息对话框）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    
    <script type="text/javascript">
        alert("Hello World")
    </script>
    
</head>
<body>
</body>
</html>

在这里插入图片描述
2.2、第二种方式：使用 script 标签引入单独的 JavaScript 代码文件
例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="1.js">
    </script>
</head>
<body>
</body>
</html>

在这里插入图片描述
注意：两种方法不能同时使用

<script type="text/javascript" src="1.js">
        alert("我想飞！")
</script>

如上代码，同时使用，只会出现1.js中的信息。

3. 变量

3.1、什么是变量？
变量是可以存放某些值的内存的命名。

3.2、JavaScript 的变量类型：
数值类型： number
字符串类型： string
对象类型： object
布尔类型： boolean
函数类型： function

JavaScript 里特殊的值：
undefined 未定义，所有 js 变量未赋于初始值的时候，默认值都是 undefined.
null 空值
NaN 全称是：Not a Number。非数字。非数值。

3.3、JS 中的定义变量格式：

var 变量名;
var 变量名 = 值;

例：

<script type="text/javascript">
        var i;
        // alert(i); // undefined
        x = 12;
        // typeof()是JavaScript语言提供的一个函数。
        // alert( typeof(x) ); // number

        y = "abc";
        // 它可以取变量的数据类型返回
        // alert( typeof(y) ); // String

        var a = 12;
        var b = "abc";

        alert( a * b ); // NaN是非数字，非数值。

    </script>

4. 关系（比较）运算

和java中的一样（>,<,>=,<=,==）
和java中不一样的：全等于===

等于： == 等于是简单的做字面值的比较
全等于： === 除了做字面值的比较之外，还会比较两个变量的数据类型

    <script type="text/javascript">
        var a = "12";//字符串
        var b = 12;//数值

        alert( a == b ); // true
        alert( a === b ); // false

    </script>

5. 逻辑运算

5.1、运算符
且运算： &&
或运算： ||
取反运算： !

注意：在 JavaScript 语言中，所有的变量，都可以做为一个 boolean 类型的变量去使用。（0 、null、 undefined、””(空串) 都认为是 false；）

<script type="text/javascript">
		var a = 0;
        if (a) {
            alert("零为真");
        } else {
            alert("零为假");
        }

        var b = null;
        if (b) {
            alert("null为真");
        } else {
            alert("null为假");
        }

        var c = undefined;
        if (c) {
            alert("undefined为真");
        } else {
            alert("undefined为假");
        }

        var d = "";
        if (d) {
            alert("空串为真");
        } else {
            alert("空串为假");
        }
</script>

在这里插入图片描述

5.2、运算符的规则
&& 且运算。
有两种情况：
第一种：当表达式全为真的时候。返回最后一个表达式的值。
第二种：当表达式中，有一个为假的时候。返回第一个为假的表达式的值

<script type="text/javascript">
var a = "abc";
var b = true;
var d = false;
var c = null;

alert( a && b );//返回true
alert( b && a );//返回abc
alert( a && d ); //返回false
alert( a && c ); //返回null
</script>

|| 或运算
第一种情况：当表达式全为假时，返回最后一个表达式的值
第二种情况：只要有一个表达式为真。就会把回第一个为真的表达式的值
并且 && 与运算和 ||或运算有短路。
短路就是说，当这个&&或||运算有结果了之后。后面的表达式不再执行

<script type="text/javascript">
var a = "abc";
var b = true;
var d = false;
var c = null;
alert( d || c ); //返回null
alert( c|| d ); //返回false

alert( a || c ); //返回abc
alert( b || c ); //返回true
</script>

6. 数组

6.1、数组的定义方式
JS 中数组的定义：

var 数组名 = []; // 空数组
var 数组名 = [1 , ’abc’ , true]; // 定义数组同时赋值元素

var arr = []; // 定义一个空数组
        //获取数组的长度
alert( arr.length ); // 0

//在java中，当数组长度为0的时候，是不能给其赋值的
//但是在JavaScript是可以赋值的
//并且赋值之后，其数组长度也会改变
arr[0] = 12;
alert( arr[0] );//12
alert( arr.length ); // 1

// javaScript语言中的数组，只要我们通过数组下标赋值，那么最大的下标值，就会自动的给数组做扩容操作。
arr[2] = "abc";
alert(arr.length); //3

//那么数组中的第二个元素是什么呢？
alert(arr[1]);// undefined