JavaScript-数据类型-typeof动态判断数据类型-prototype扩展函数

js中变量原始类型:

Undefined:

Undefined类型只有一个值就是:undefined;当变量没有手动赋值,系统默认undefined,也可以手动给变量赋值undefined

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Undefined类型</title>
    </head>
    <body>
        <script type="text/javascript">
            
           var i;  //值是undefined
           var k = undefined;//undefined
           
           alert(i==k);//true
           
           var y = "undefined";//undefined
           alert(k==y);//false
            
        </script>
    </body>
</html>

Number:

包含整数,小数,正数,负数,NaN(not a number)

NaN不是一个数字,但是属于Number类型

NaN:运算结果本来应该是一个数字,最后算完之后不是数字的时候结果是NaN

NaN:在做加法运算时,如果加了一个字符串优先做字符串拼接

1、isNaN函数:含义不是一个数字;true表示不是数字;false表示是一个数字

2、isInfinity :当除数是0的时候结果为无穷大

3、parseInt():将字符串自动转化为数字,并且取整数位

4、parseFloat():将字符串自动转换为数字

5、Math.ceil():向上取整数 1.2 取整数2

<body>
        <script type="text/javascript">
           var a=100;
           var b="asdf";
           alert(a/b);//NaN;结果应该是数字,那么最后不是数字
           
           //NaN在加号中有字符串优先做字符串拼接
           var e="asd";
           var f=111;
           alert(e+f)//"asd111"
           
           //Infinity:除数为0.结果无穷大
           alert(10/0)
           
           //在js中10/3 =?
           alert(10/3);//3.3333333333333335
           
           //关于isNaN函数
           //结果为:true 不是一个数字;
           //结果是false是一个数字
           function sum(a,b){
               if(isNaN(a) || isNaN(b)){
                   alert("参与运算的必须是数字");
                   return;
               }
               return a + b;               
           }
           //调用函数
           sum(111,"asd");
           alert(sum(100,111));
           
           //parseInt(""):将字符串自动换为数字,并且取整数位
           alert(parseInt("3.9999"));//3
           alert(parseInt(3.9999));//3
           
           //parseFloat();将字符串自动转为数字
           alert(parseFloat("3.14")+1);//4.14
           
           //Math.ceil();
           alert(Math.ceil(1.2));//2</script>

String:

js中字符串可以使用单引号 var s1 = 'asdf'。也可以使用双引号var s2 = "asdf"

js中创建字符串对象:

1、直接写:var s2 = "asdf"

2、js内置支持类String:var s2 = new String("asdf");

String是一个内置类,可以直接使用,父类是Object

3、大String小String 的属性都是通用:length 获取字符换长度

subStr(start,length) 包含start下标;后面length个子字符串

subString(start,end) 不包含end子字符串

4、常用函数

indexof  获取指定字符串在当前字符串中第一次出现 处的索引

lastIndexOf 获取指定字符串在当前字符串中最后一次出现处的索引

replace     替换 只替换一次。想要全部替换需要正则表达式

toLowerCase    转小写

toUpperCase    转大写

<body>
          <script type="text/javascript">
             //小String 属于原始类型
             var x="asdf";
             alert(typeof x);
             
             //大String 属于Object类型
             var y =new String("asdf");
             alert(typeof y);//obejct;
             
               //获取字符串长度
             alert(x.length);//4
             alert(y.length);//4
             
             //indexOf()
            alert("http://www.baidu.com".indexOf("http"))//0
            alert("http://www.baidu.com".indexOf("https"))//-1
            
            //indexOf():三目运算符
            alert("http://www.baidu.com".indexOf("https")>=0? "包含":"不包含");
            
            //replace() 只能替换一个,想要全部替换需要正则表达式
            
            //subStr() 和subString() 有什么区别:
            //subStr(start,length) 包含start下标 后面length个子字符串
            //subString(start,end) 不包含end子字符串
            alert("asdfafhjqwer".substr(2,4));//dfaf
            alert("asdfafhjqwer".substring(2,4));//df
            
          </script>
        
    </body>

Boolean:

js中只有两个值:true和false;“有” 转化为true;“没有” 转化为false

Boolean()函数:作用就是将数据转化为布尔类型

<body>
          <script type="text/javascript">
           var username="  ";
           //if(Boolean(username)){}这里会自动调用Boolean()函数
           if(username){
                alert("欢迎你"+username);       
           }else{
                alert("用户名不能为空!"); 
           }
           
           //规律:"有" 就转化为true;没有;就是false;
           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 

           for(var i = 0;i<10;i++){
               alert("i="+i);
           }
          </script>
    </body>

Null:

这个类型只有一个值就是:null

js中变量引用类型:

Object:

1、Object:是所有类型的超类,自定义的类,默认继承Object,当然会继承object类中所有属性以及函数

也就是自定义的类也有prototype属性

2、prototype属性:会自动给类动态扩展属性和函数

String.prototype.suiyi=funtion(){

  alert("给S听扩展函数")

}

3、js中类的定义,也是一个构造函数的定义;他们是放在一起完成的

1、function 类名(形参){ }
2、类名 = function(形参){ }
创建对象new:new 构造方法名(形参) 构造方法名和和类名一致
function sayHello(){} sayHello(); //把sayHello当作普通函数调用
var boj = new sayHello(); //这个方式把sayHello当作一个类,创建对象 //obj是一个引用,保存内存地址指向堆中的对象 //访问对象的属性 alert(u1.sno);
//访问对象属性,另一种语法 //alert(u1[sno]);
<body>
        <script type="text/javascript">
            function Strudent(){
                alert("Student....");
            }
            //当作普通函数调用
            Strudent();
       
             //当作类来创建对象
            var stu = new Strudent();
            alert(stu);//[object Object]
        
            //js中的类的定义,同时又是一个构造函数的定义
            //在js中类的定义和构造函数的定义是放在一起来完成的
            function User(a,b,c){
               //声明属性 this表示当前对象
                //User的三个属性
               this.sno=a;
               this.sname=b;
               this.sage=c;
            }
        
            //创建对象
            var u1 = new User(111,"zz",29);
            //访问对象的属性
            alert(u1.sno);
            alert(u1.sname);
            alert(u1.sage);
        
            //访问对象属性,另一种语法
            //alert(u1[sno]);
            //alert(u1[sname]);
            //alert(u1[sage]);
        
        
            Emp=function(ename,sal){
               this.ename=ename;
               this.sal=sal; 
            }
        
            var e1= new Emp("sss",12000);
            alert(e1["ename"]+","+e1.sal);
        
       
            Product=function(pno,pname,price){
                //属性
                this.pno=pno;
                this.pname=pname;
                this.price=price;
                //函数
                this.getPrice=function(){
                    return this.price;
                }
            }
            
            var caomei = new Product(1234,"草莓",12);
            var pri =caomei.getPrice();
            alert(pri);
            
            //可以通过prototype这个属性来给类动态扩展属性以及函数
            Product.prototype.getPname = function() {
                return this.pname;
            };
            
            //调用后期扩展的getPname()函数;
            var pname=caomei.getPname();
            alert(pname)
            
            //给String扩展函数
            String.prototype.suiyi=function(){
                alert("这个是给String扩展的函数")
            }
            "asd".suiyi()
        </script>
    </body>

2、typeof 运算符:

在程序运行阶段会动态获取变量的数据类型

typeof:运算结果时以下6个字符串之一,注意字符串都是小写

undefined---------number------string---------boolean--------object---------function

<body>
          <script type="text/javascript">
           //求和要求变量a 和变量b 将来阿德数据类型必须是数字,不能是其他类型
           //因为一下的定义这个sum函数是为了完成两个数字的求和
           function sum(a,b){
               if(typeof a=="number" && typeof b=="number"){
                   return a+b;                   
               }
               alert(a + "," + b + "必须都是数字");
           }
           var retValue = sum(1,"ghf");
           alert(retValue);//undefined
           
           
           var retValue2 = sum(2,6);
           alert(retValue2);//8
           alert(3<<3)//24
           
           var i;
           alert(typeof i);//"undefined"
           
           var k= 10;
           alert(typeof k);//"number"
           
           var f="asd";
           alert(typeof f);//"string"
           
           var d=null;
           alert(typeof d);//"object"
           
           var flag= false;
           alert(typeof flag);//"boolean"
           
           var obj = new Object();
           alert(typeof obj);//"object"  
          </script>
    </body>

3、js中两个比较特殊的运算符

null-NaN-undefined区别:

1、数据类型不一样null-object NaN-Number undefined-Undefined

2、null等同于undefined

 js中有两个比较特殊的运算符

== 等同运算符:只判断是否相等

=== 全等运算符:即判断是否相等,又判断数据类型是否相等

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>null-NaN-undefined区别</title>
    </head>
    <body>
         <script type="text/javascript">
            
              alert(1==true);//true
              alert(1===true);//false
              
                alert(typeof null);//object
               alert(typeof NaN);//number
               alert(typeof undefined)//undefined
               
               //null和undefined 可以等同
               alert(null==NaN);//false
               alert(null==undefined)//true
               alert(NaN==undefined)//false
               
               alert(null===NaN);//false
               alert(null===undefined)//false
               alert(NaN===undefined)//false
               
         </script>
    </body>
</html>

 

posted @ 2022-06-13 12:39  280887072  阅读(93)  评论(0编辑  收藏  举报