• JavaScript--day02学习(简单数据类型/复杂数据类型)


    数据类型

    为什么需要数据类型

    不同的数据占用的内存是不一样的,为了节省内存,需要给数据分配不同的数据类型,可以占用不同的内存

    注意:js是一种动态分配的动态语言

    数据类型的分类

    • 简单的数据类型
      • number 数值类型 String 字符串类型 Boolean 布尔值 null空值 undefined未定义
    • 复杂的数据类型 --object
      • Array数组 Object对象 Function函数

    检测数据类型

    使用typeof 检测数据类型

    typeof 变量   //返回值就是数据的类型
    
    • 1

    简单的数据类型

    Number 数据类型

    • 整数
            var num = 10
            console.log(typeof num);
    
    • 1
    • 2
    • 小数
    				var num1 = 10.2
            console.log(typeof num1);
            // 注意:小数是有精度缺失的  -- 不要使用小数当做判断条件
            console.log(0.1+0.2);
            console.log(0.3);
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 无穷大 无穷小
    • NaN

    计算错误一定会出现NaN

    console.log(typeof NaN);
    
    • 1
    • 进制 2进制10 8 16
            var num = 0101010; //二进制
            var num1 = 01324567 //八进制
            var num1 = 132456789 //十进制
            var num1 = 0xaf //十六进制
    
    • 1
    • 2
    • 3
    • 4

    String字符串类型

    使用单引号或者双引号的都是字符串,因为样式中使用的是双引号,字符串推荐使用单引号

            // String 字符串类型
            var str = '10' //纯数字字符串
            console.log(typeof str)
    
    • 1
    • 2
    • 3

    字符串拼接

            console.log(10 + 10); //20 
            console.log(10 + '10');//1020
            console.log('10' + '10');//1020
    
    • 1
    • 2
    • 3

    字符串的方法

    字符串是有长度(就是字符串中字符的个数)和下标(从0开始的,每个字符的下标,是字符的位置数 -1)的

    字符串是可读不可写的(也就是说字符串通过)

            var str = "hello word"
            console.log(str.length); //10
            //字符串名称加[] 取下标
            console.log(str[0]); //取字符
            str[0] = 'k' //可读不可写
            console.log(str);
    
            // 使用的小括号, 参数是下标值  --返回值是字符
            console.log(str.charAt(0)); 
            // 使用的小括号, 参数是下标值  -- 是码值,常用来字符串的去重和分类
            console.log(str.charCodeAt(0));
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
            var box =document.getElementById('box');
    
            var num =30
            var num1 =185
            var num2 =150
            var num3 =80
    
            // box.innerHTML = '

    我今年'+num+'岁

    身高'+num1+'

    体重'+num2+'

    腰围'+num3+'

    '
    // box.innerHTML = '

    我今年'+num+'岁

    '+
    // '

    身高'+num1+'

    '+
    // '

    体重'+num2+'

    '+
    // '

    腰围'+num3+'

    '
    //es6 模板语法 box.innerHTML = `

    我今年${num}

    身高'+num1+'

    体重'+num2+'

    腰围'+num3+'

    `
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16

    Boolean布尔值

    有俩个值 true (真–1)false(假 --0)

    常用于判断条件的返回值

            //Boolean 布尔值
            console.log(true + false);
            console.log(10 > 90);
    
    • 1
    • 2
    • 3

    null 空值 和 undefined 未定义

    undefined: 变量声明了但是没有赋值

    null : 空值,但是占用内存,提前分配一块内存,用来存放一个对象

    console.log(typeof null);
    
    • 1

    复杂数据类型 --object

    Array 数组

    数组是一组无序的数据集合

    声明数组

    • 字变量
    var arr = [1,'str',true,false,null,undefined,function,[],{}] 
    
    • 1
            var arr = [1,2,3,4,5]
            console.log(arr.length); // 数组中元素的个数
            console.log(arr[0]); //取值 -- 数组中必须通过下标存储值或者取值
            arr[5] = 6
            console.log(arr);
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 使用关键字 new
    var arr = new Array() //实例化一个数组对象
    
    • 1
            // 有一个值是长度,也就是这个数组中,只能存储四个值
            // var arr = new Array(4);
            var arr = new Array();
            console.log(arr);
            arr[0] = 1
            arr[1] = 1
            arr[2] = 1
            arr[3] = 1
            console.log(arr);
            arr[100] = 1
            console.log(arr);
    
            var arr1 = ['./img/1.png','./img/2.png','./img/3.png','./img/4.png']
            document.body.innerHTML = arr1[0]
    
            var img = document.getElementById('img')
            img.scr = arr1[0]
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17

    Object对象

    万物皆对象

    对象是有属性和方法的

    对象:名称

    属性:形容词

    方法:动词

    • 关键字
    var obj =new Object()  //实例化一个对象
    
    • 1
    • 字变量
    var obj = {} //对象
    
    • 1
            // 对象  -- 是键值(有属性名,属性值,并且:隔开)对的集合
            //属性名对于程序员是没用的,需要的属性值,但是必须通过属性名才可以取到属性值
            var obj = {
                name: '张三',
                age: 30,
                eat:function(){
                    console.log('我很能吃');
                }
            }
            console.log(obj.name);
            obj.eat()
            var obj1 = new Object();
            obj1.name = '李四'
            var a = 'name'
            console.log(obj1);
            console.log(obj1[a]);
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16

    Function函数

    函数就是一段可以重复执行的代码块

    • 字变量
    var fn = function(){
    	//代码块
    }
    
    • 1
    • 2
    • 3
    • 关键字 function
    function add(){
    //代码块
    }
    
    • 1
    • 2
    • 3
            // Function 函数
            function add(){
                console.log('代码块');
            }
            // 函数必须调用,否则不会执行 -- 函数名+()  也就是add()
            add()
    
            var num = function(){
                console.log('代码块');
            }
            num()
            console.log(typeof num);
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12

    数据类型转换

    为了防止计算错误

    • Number()

    把其他的数据类型转换成Number类型,但是,只能转换成纯数字的字符串

            // 只能转换纯数字的字符串
            console.log(Number('1') + 1);
            // 如果遇到不能转换的,直接返回NaN
            console.log(Number('1a') + 1);
    
    • 1
    • 2
    • 3
    • 4
    • parseInt

    把其他的数据类型转换成整数的Number类型,也就是保留整数

    遇到转换就直接转化,如果遇到不能转换的

            console.log(parseInt('1') + 1); //2
            console.log(parseInt('1.5') + 1); //2
            console.log(perseInt('100px') + 10); //110
    
    • 1
    • 2
    • 3
    • parseFloat

    把其他的数据类型转换成小数的Number类型,保留整体

    遇到转换,遇到不能转换的,返回转换完成的

            console.log(parseFloat('1') + 1); //2
            console.log(parseFloat('1.5') + 1); //2
            console.log(parseFloat('100px') + 10); //110
    
    • 1
    • 2
    • 3
    • Boolean

    把其他数据类型转换成布尔类型

            console.log(Boolean(null));
            console.log(Boolean(undefined));
            console.log('');
            console.log(false);
            console.log(NaN);
            console.log(0);
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • String()

    把其他数据类型转换成字符串类型

    console.log(typeof (1).toString);
    
    • 1

    运算符

    • 算数运算符
    +-*/ 加减乘除     %取余
    // 代码
    +: 加法 如果是字符串 就是连接符
    
    • 1
    • 2
    • 3
    • 自增自减
    ++  --
    如果自增或者自减 是在变量的后面,就是后置自增或后置自减 先参与计算 再自增自减
    如果自增或者自减 是在变量的前面,
    
    • 1
    • 2
    • 3
    • 比较运算符 --结构的返回值是布尔值
     >  <  >=  <=  ==等于  ===全等于(类型与值都比较)
            var a = 1
            var b = ++a   //加完赋值
            console.log(a,b);
    
    • 1
    • 2
    • 3
    • 4
    • 逻辑运算符
    &&||     !
    
            console.log(10 > 1 && 1 > 0); //true
            console.log(10 > 1 && 1 > 2); //false
            console.log(!true);
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 赋值运算符
    =  +=  -=  *= /= %=
    a+=1  ===  a=a+1
    
    • 1
    • 2
  • 相关阅读:
    Node.js的readline模块 命令行交互的模块
    linux 下MySQL本地安装mysql - u root - p 无法登入
    一文看懂推荐系统:概要01:推荐系统的基本概念
    cookie、session、token的关系及测试
    【无标题】行操作DataFrame
    设计模式-Observer模式(观察者模式)
    学不会的博弈论——进阶篇
    linux上使用docker安装redis
    对极几何与三角化求3D空间坐标
    VulnHub-Lord Of The Root_1.0.1(打个靶机玩一下)
  • 原文地址:https://blog.csdn.net/AO_AEO/article/details/126181915