JS — 01 变量和数据类型

最新推荐文章于 2022-12-25 11:12:30 发布

小郭呀~

最新推荐文章于 2022-12-25 11:12:30 发布

阅读量131

点赞数 1

分类专栏： JS上课笔记

本文链接：https://blog.csdn.net/weixin_46448458/article/details/106677226

版权

JS上课笔记专栏收录该内容

20 篇文章 0 订阅

订阅专栏

定义变量、定义变量的注意点、定义变量的写法、数据类型、对象类型的数据、嵌套存值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <title></title>
</head>
<body>
    <script>
        //JavaScript => 弱语言

        /******************************************************/
        //赋值 右边的值给左边,让左边的变量存起来
        //定义变量的关键词 => let var const
        let num1 = 10;//遇到 = 从右往左读

        /******************************************************/
        /*
        *   定义变量的注意点
        *       1.变量的命名规则
        *           字母 数字 _ $  (不能以数字开头)
        *           严格区分大小写
        *           不要无中生有,也不要重复声明 => 重复声明会报错
        *           不要使用关键词和保留词
        * */

        /******************************************************/
        console.log( num1 );//在控制台打印值
        console.dir( num1 );//在控制台展开打印

        /******************************************************/
        //给变量重新赋值
        let num2 = 10;
        console.log( num2 );//打印结果 => 10
        num2 = 20;//给num2重新赋值
        console.log( num2 );//打印结果 => 20

        /******************************************************/
        //const 定义的变量称为常量,不允许重新赋值,重新赋值会报错.
        //定义常量时变量名通常会全部大写,并且写在最开始.
        const NUM3 = 30;
        console.log( NUM3 );

        /******************************************************/
        //定义变量的几种写法
        //方法一:
        let a = 10,
            b = 20,
            c = 30;
        //方法二:
        let d;//只定义变量,不赋值,后面使用的时候再赋值.

        /******************************************************/
        /*
        *   数据类型:
        *       基础数据类型(简单数据类型):
        *           Number 数字
        *           String 字符串
        *           Boolean 布尔值
        *           Undefined 未定义
        *           Null 空指针
        *       引用数据类型(复杂数据类型):
         *           Object 对象
        * */
        let num_a = 10;//Number
        let str_a = "小郭";//String 双引号
        let str_b = '小郭';//String 单引号
        let str_c = `小郭`;//String 模板字符串
        let boo_a = true;//Boolean
        let boo_b = false;//Boolean
        let und_a;//Undefined => 定义时还不知道赋什么类型的数值,但之后可以赋任何类型的数值
        let und_b = undefined;//Undefined
        let nul_a = null;//空指针 => 定义时还不知道赋什么类型的数值,但之后赋值的数据类型一定是对象
        /*
        *   Object对象类型的数据:
        *       Array 数组数据
        *       Object 对象数据
        *
        *
        * */
        //Array数组 => 数组的作用是用来存储一组数据
        let arr_a = [ "小郭" , 123 , undefined , true ];
        console.log( arr_a );//打印数组
        console.log( arr_a[0] );//arr_a数组中下标为0的数据
        console.log( arr_a.length );//取数组的长度
        arr_a[1] = 456;//arr_a数组中下标为1的这一项重新赋值
        console.log( arr_a[1] );//此时arr_a[1]的值为456

        //Object对象 => 对一个事物的描述 => 属性(键) : 值 => json格式的对象
        let obj_a = {
            name : "小郭",
            age : 20,
            height : "157cm",
            hobby : "web",
            boyFriend : undefined,
            marry : false
        };
        console.log( obj_a );
        console.log( obj_a.name );//取值 => 对象.属性
        obj_a.age = 21;//给对象的某个属性重新赋值
        console.log( obj_a.age );//此时age的值为21
        delete obj_a.boyFriend;//删除对象的某个属性
        console.log( obj_a );//此时这个对象的属性就没有boyFriend这个属性了
        obj_a.tel = "110";//在对象中添加新属性
        console.log( obj_a );//此时对象中会新增加一个属性tel

        /******************************************************/
        //嵌套存值
        let arr_b = [
            "小郭",
            100,
            true,
            [
              "aaa",
              "bbb",
              "ccc"
            ]
        ];
        console.log( arr_b[3][0] );//打印结果 => "aaa"

        let obj_b = {
            name : "张三",
            age : 22,
            friend : {
                name : "李四",
                age : 22,
                hobby : [ "唱歌" , "画画" , "弹琴" , "吃" ,"喝" ]
            }
        };
        //打印吃
        console.log( obj_b.friend.hobby[3] );
    </script>
</body>
</html>