JavaScript的第1天

最新推荐文章于 2024-06-10 22:52:06 发布

竹叶依旧

最新推荐文章于 2024-06-10 22:52:06 发布

阅读量958

点赞数

分类专栏： JavaScript基础文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_46426476/article/details/121981216

版权

JavaScript基础专栏收录该内容

16 篇文章 0 订阅

订阅专栏

HelloWorld

<!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>Document</title>
    <script type="text/javaScript">
        // 窗口弹窗  alert
        alert("这是一个入门程序")
        // 向控制台输出   console.log
        console.log("这是易购入门程序")
        // 在页面中输出   document.write
        document.write("这是一个入门程序")
    </script>
</head>
<body>
    
</body>
</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>Document</title>
    <!-- 一旦script标签用于引入外部js文件，那这个标签就不可以再写入内部js代码了】
    只能再创建一个标签 -->
    <script src="./js/print.js"></script>
</head>
<body>
    <!-- 可以将js代码写在标签的onclick属性里面 -->
    <button onclick="alert('这是写在标签里面的js代码')">点我button</button>
    <!-- 可以把js代码写在a链接的href属性里面 -->
    <a href="javascript:alert('这是写在a链接href属性里面的js代码')">点我</a>
</body>
</html>

js注释

<!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>Document</title>
    <script>
        // 这是单行注释
        /*
            这是一个多行注释
        */
       
        // js注意事项
        // 1，js中严格区分大小写
        // 2，js中每一条语句已分号结尾，不写系统也会自动添加，但是会消耗系统性能，且有时候系统会添加错分号
        // 3，js会忽略多个空格和换行，可以用空格和换行对代码进行格式化
        
    </script>
</head>
<body>
    <!--  -->
</body>
</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>Document</title>
    <script>
        /**     
         * 字面量:是一些不可改变的值，字面量是可以直接使用的，但一般都会赋值给变量再使用
         * 
         * 变量:变量可以用来保存字面量，而且变量的值是可以任意改变的
         *      变量更加方便我们的使用
        **/
        
        // 1
        //  声明变量
        // var a;
        // 给变量赋值
        // a=10;
        // alert(a);


        // 2
        // 声明变量并赋值
        var a=10;
        alert(a);
    </script>
</head>
<body>
    
</body>
</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>Document</title>
    <script>
        /*
        标识符:
        -  在js中可以由我们自主命名的都可以被称为标识符
        -  命名一个标识符需要遵守如下的规则:
            1.标识符中可以含有字母，数字，_，$
            2，标识符不能以数字开头
            3,标识符不能是ES中的关键字或保留字
            （不是硬性规定）4，标识符一般都采用驼峰命名法
               --首字母小写，后面每个开头字母大写
            （不是硬性规定）5,js底层保存标识符实际上采用的是Unicode编码
                            所以理论上讲，所以utf-8中含有的内容都可以作为标识符
        */
    </script>
</head>
<body>
    
</body>
</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>Document</title>
    <script>
        /*
            数据类型指的是字面量的数据类型
            在js中一共有六种数据类型:
            string 字符串
            Number 数值
            Boolean 布尔值
            Null 空值
            Undefined  未定义
            Object  对象
        其中String Number Boolean Null Undefined属于基本数据类型
        而Object属于引用数据类型


        \  转义字符
        当表示一些特殊字符时可以使用\进行转义
        str="这是一段测试代码\"测试代码里面的内容\"";
        alert(str);

        \n 表示换行
        str="这是一段测试代码\"测试\n代码里面的内容\"";
        alert(str);

        \t 表示制表符 tab键
        str="这是一段\t测试代码\"测试\t代码里面的内容\"";
        alert(str);

        \\ 表示\
        str="这是\\一段\t测试代码\"测试\t代码里面的内容\"";
        alert(str);
        */


        // 表示输出变量str
        alert(str);
        // 表示输出字符串str
        alert("str");
    </script>
</head>
<body>
    
</body>
</html>

Number

<!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>Document</title>
    <script>
        /*
            在js中所有的数值都是Number类型
                包括浮点数和整数

            js中可以使用typeof检查数字的数据的类型
            语法: typeof 数据

            js中可以表示数字的最大值
            Number.MAX_VALUE
                1.7976931348623157e+308   e+308表示10的308次方

            还可以表示数字的最小值
            Number.MIN_VALUE
                5e-324 (正数的最小值)

            如果使用Number表示的数字超过了最大值，则会返回一个
            Infinity   表示正无穷
            -Infinity   表示负无穷
            使用typeof检查Infinity的类型为number

            NaN是一个特殊的数字，表示Not A Number,即非法字符
            使用typeof检查NaN的类型为number
            
            用js进行浮点运算时，可能得到一个不精确的结果
            所有不能用js进行对精确度要求较高的运算
            

        */
       var a=Number.MAX_VALUE*Number.MAX_VALUE;
    //    alert(typeof a)

       var str=NaN;
    //    alert(typeof str)

        var u=0.1+0.2;
        alert(u);  //0.30000000000000004
    </script>
</head>
<body>
    
</body>
</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>Document</title>
    <script>
        /*
            Boolean  布尔值
             布尔值只有两个，主要用来做逻辑判断
                true
                  ---表示真
                false
                  ---表示假

                用typeof来检查true/false是boolean类型
        */

        var bool=true;
        console.log(bool)
    </script>
</head>
<body>

</body>
</html>

null和undefined

<!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>Document</title>
    <script>
        /*
            Null(空值)类型只有一个，就是null
                null这个值专门用来表示一个为空的对象
                使用typeof检查一个null值时，返回object
            
            Undefined（未定义）类型的值只有一个，就undefined
                当声明一个变量，但不给变量赋值时，那么它的值就是undefined
                使用typeof检查一个undefined时也会返回undefined
        */
        var a=null;
        // alert(typeof a);  //object
        var b;
        alert(typeof b);  //undefined
    </script>
</head>
<body>
    
</body>
</html>

将其他数据强制类型转换为string

<!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>Document</title>
    <script>
        /*
            强制类型转换:
                -指将一个数据类型强制转换为其他的数据类型
                -类型转换主要指，将其他的数据类型，转换为
                            String  Number  Boolean

            将其他类型转换为String
                方式1:使用toString方法  
                当被转换的值为null或undefined时，无法转换，其没有toString方法
                    var a=221;
                    var b=a.toString();
                    alert(b);
                    alert(typeof b);
                方式2:使用String函数  String(被转换的值) 
                 转换string Number Boolean时，是调用其toString方法
                 当转换null或者undefined时，是直接将其转换为"null","undefined"
                        var a=221;
                        var b=String(a);
                        alert(b);
                        alert(typeof b);
        */
       var a=221;
       var b=String(a);
       alert(b);
       alert(typeof b);
    </script>
</head>
<body>
    
</body>
</html>