初识JavaScript ———（2）！！！

一、关于JavaScript中的数据类型

虽然在JS中的变量在声明的时候不需要指定数据类型，但是在赋值的时候，每一个数据还是有类型的，所以还是需要学习JS中的数据类型。

JS的数据类型遵循ES规范（ECMAScipt规范），在ES6之后，又基于以下的六种类型之外添加了一种新的类型：Symbol

1.数据类型的分类

（1）原始类型

在JS中的原始的数据类型有：Undefined、Number、String、Boolean、Null

（2）引用类型

在JS中的引用的数据类型有：Object以及Object的子类

JS中有一个运算符叫做typeof，这个运算符可以在程序的运行阶段动态的获取变量的数据类型。以下是typeof运算符的语法格式：

typeof 变量名

typeof运算符的运算结果是以下6个字符串之一，注意字符串都是全部小写。

“undefined” “number” “string”

“boolean” “object” “function”

在JS中比较字符串是否相等使用“==”完成，不是使用equals。

Demo：要求a变量和b变量的数据类型必须是数字，不能是其他变量，也就是限制了变量的数据类型

<html>
    <head>
        <meta charset="UTF-8">
        <title>My_javascript</title>
    </head>
    <body>
        <script type = "text/javascript">
               function sum(a,b) {
      
      
                    if(typeof a == "number" && typeof b == "number") {
      
      
                        return a + b;
                    }
                    alert(a+","+b+"必须都为数字！");
               }
               //正确的方式：
               var ret = sum(2,3);
               alert("ret = "+ret);
               //错误的方式：
               var ret2 = sum(false,"abc");
               alert("ret = "+ret2);
           </script>
    </body>
</html>

正确的执行结果：

在这里插入图片描述

错误的执行结果：

在这里插入图片描述

由于代码执行到了alert(a+","+b+"必须都为数字！");这句，说明sum函数并没有返回值，即ret2也没有接受到返回值，默认为undefined。

Demo：关于typedef的六种类型

<html>
    <head>
        <meta charset="UTF-8">
        <title>My_javascript</title>
    </head>
    <body>
        <script type = "text/javascript">
               var i;
               alert(i+"的数据类型为"+typeof i);

               var num = 3;
                alert(num+"的数据类型为"+typeof num);

               var str = "abc";
                 alert(str+"的数据类型为"+typeof str);

               var flag = false;
                alert(false+"的数据类型为"+typeof false);

               var d = null;
                alert(d+"的数据类型为"+typeof d);
            
               

           </script>
    </body>
</html>

在这里插入图片描述

注：null属于Null类型，但是typeof运算符的结果类型是“object”.

2.Undefined类型

Undefined类型只有一个值，这个值救赎undefined，当一个变量没有手动赋值，系统默认赋值undefined，或者也可以给一个变量手动赋值undefined。

var i;     //类型为undefined
var k = undefined;    //类型为undefined
alert(i==k);   //true

var j = "undefined";   //类型为string
alert(j==k);   //false

3.Number类型

（1）NUmber类型有哪些值？

整数、小数、负数、正数、不是数字、无穷大都属于Number类型（0、1、1.2、-1、NaN、Infinity）

关于NaN：表示Not a Number，不是一个数字，但属于Number类型。比如当运算结果应该是一个数字，最后算完不是一个数字的时候，结果就是NaN。

如，Demo：

 var a = 100;
 var b = "abc";
 alert("结果="+a/b);

在这里插入图片描述

但是如果做的是加法运算，加号的一边为字符串时，先做字符串的拼接。Demo：

var a = 100;
var b = "abc";
alert("结果="+(a+b));

在这里插入图片描述

4.Infinity类型

关于Infinity类型是当除数为0时，结果为无穷大。

alert(10/0);

在这里插入图片描述

思考：alert(10/3)=?

在这里插入图片描述

5.isNaN函数

用法：isNaN(数据)，这个结果为true表示不是一个数字，结果为false表示是一个数字。因为isNaN的意思为：is Not a Number。

再对于之前，效果可和ypeof关键字替换，Demo：

<html>
    <head>
        <meta charset="UTF-8">
        <title>My_javascript</title>
    </head>
    <body>
        <script type = "text/javascript">
            function sum(a,b){
      
      
                if(isNaN(a) || isNaN(b)){
      
      
                    alert("参与运算的必须是数字！！！");
                    return;
                }
                return a+b;
            }
            var ret = sum(3,2);
            alert("ret="+ret);
        </script>
    </body>
</html>

在这里插入图片描述

6.parseInt( )函数和parseFloat函数

parseInt( )函数作用：可以将字符串自动转换成数字，并且取整数位。

parseFloat( )函数作用：可以将字符串自动转换成数字

Demo：

alert(parseInt("3.9999"));//3
alert(parseInt(3.9999));//3
alert(parseFloat("3.2")+1);//4.2

7.Math.ceil函数

Math.ceil函数作用：将数字进行向上取整，Math是数学类，数学类中有一个ceil( ),作用是向上取整。

alert(Math.ceil(2.1));

结果就是3

8.Boolean类型

JS中的Boolean类型永远就只有两个值，true and false（和Java一样）。

在Boolean类型中有一个函数叫做：Boolean( ).

语法格式：

Boolean(数据)

其作用是将非布尔类型转换成布尔类型。

Demo1：

var username = "";
if(username) {
     alert("欢迎你"+username);
}else {
     alert("用户名不能为空！");
}

Demo2：

var username = "";
if(Boolean(username)) {
     alert("欢迎你"+username);
}else {
     alert("用户名不能为空！");
}

Demo1和Demo2的代码含义是一样的，如果username中包含字符串，经过if语句判断，如果为真，即结果就是true，就会执行第一条语句alert("欢迎你"+username);但是我们一般采用第一种写法，代码底层会自己变化。

alert(Boolean(1));//true
alert(Boolean(0));//false
alert(Boolean(""));//false
alert(Boolean("abc"));//true
alert(Boolean(null));//false
alert(Boolean(NaN));//false
alert(Boolean(undefined));//false
alert(Boolean(Infinity));//true

总结：Boolean函数中有内容就转换成true，没有内容就是false。

9.Null类型

Null数据类型就一个值，null

注：alert(typeof null);这个代码的结果是object

10.String数据类型

（1）在JS当中字符串可以使用单引号，也可以使用双引号。

var str1 = "abc";

var str2 = 'abc';

（2）在JS中使用两种方式创建字符串：

var str = "abc";
使用JS中内置的支持类(String)，var str2 = new String("abc");注意，String是一个内置类，可以直接使用，String的父类是Object。

//小string（属于原始类型String）
var x = "abc";
alert(typeof x); //结果为string

//大String（属于Object类型）
var y = new String("abc");
alert(typeof y); //结果为object

但是不管小string 还是大String，他们的属性和函数都是通用的。

（3）关于String类型常用的属性和函数？

常用属性：
- length 获取字符串长度
常用函数：
- indexof 获取指定字符串在当前字符串第一次出现处的下标
- lastIndexof 获取指定字符串在当前字符串最后一次出现处的下标
- replace 替换
- substring 截取子字符串
- toLowerCase 转换成小写
- toUpperCase 转换成大写
- split 拆分字符串

11.Object数据类型

Object是所有类型的超类，自定义的任何类型，默认继承Object。

（1）JS常见的属性

常见的属性：prototype属性（这个属性主要是给类动态的扩展属性和函数）、constructor属性

（2）JS中常见的函数

在JS中有toString、valueOf、tolocaleString函数等等

注：Object当中定义的类默认继承Object，会继承Object类中的所有属性以及函数，也就是说，自己定义的类中也有prototype属性

（3）在JS中如何定义类?又如何new对象？

定义类的第一种方式：
- function 类名(形参){};
定义类的第二种方式：
- 类名 = function(形参){};
创建对象的方式：
- new 类名（构造方法名）(形参);

Demo：

function test() {
            
            }
test();//这样用就是一个函数
            
var obj = new test();//这样用，object就是一个引用，保存内存地址指向堆中的对象。

（4）在JS中类的定义和构造函数的定义是一起完成的。

Demo：

function User(a,b,c) {
//this表示当前对象，User类中有三个属性：name、age、number
	this.name = a;
    this.age = b;
 	this.number = c;
}

//创建对象：
var user1 = new User("zhangsan",18,123);
//访问对象的属性：
alert(user1.name);     //zhangsan
alert(user1.age);      //18
alert(user1.number);   //123

二、null、NaN、undefined这三值的区别

1.数据类型不一样

null数据类型为object、NaN数据类型为number、undefined的数据类型为undefined

alert(null==NaN);        //false
alert(null==undefined);  //true
alert(undefined==NaN);   //false

//所以：null和undefined可以等同

注：在JS中有两个比较运算符

（1）“==”为等同运算符，只判断值是否相等
- 例：alert(1==true);这个的结果就是true
（2）“===”为全等运算符，既判断值是否全等，也判断数据类型是否相等
- 例：alert(1===true);这个的结果就是false，因为这两个的数据类型不一样

好了，本期的博客就到此结束，下一期还会继续讲解JavaScript语言的续集，请大家持续关注，谢谢！！！

既然选择远方，当不负青春，砥砺前行。

续-初识JAVaScript---（2）

初识JavaScript ———（2）！！！

一、关于JavaScript中的数据类型

1.数据类型的分类

（1）原始类型

（2）引用类型

2.Undefined类型

3.Number类型

4.Infinity类型

5.isNaN函数

6.parseInt( )函数和parseFloat函数

7.Math.ceil函数

8.Boolean类型

9.Null类型

10.String数据类型

11.Object数据类型

二、null、NaN、undefined这三值的区别

1.数据类型不一样

猜你喜欢