基本包装类型

Posted 决起而飞

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了基本包装类型相关的知识,希望对你有一定的参考价值。

为了方便操作基本类型值,这里有三个特殊的引用类型,Boolean,Number,String,也具有与各自的基本类型相应的特殊行为。实际上,每当读取这个类型时,后台就会创建一个对应的基本包装类型的对象。

var s1="some text"

var s2=s1.substring(2)

在读取模式中访问字符串时,后台自动完成:创建string类型的实例;在实例上调用指定的方法;销毁实例;

引用类型和基本包装类型的区别

主要在于对象的生命期,使用new操作符创建的引用类型的实例,在离开作用域前都会保存在内存中;而基本包装类型的对象,只存在于一行代码的执行瞬间。

同时,所有的基本包装类型的对象在转换为布尔类型时,都是true

       //object构造函数会根据传入值的类型返回相应基本包装类型的实例
       var obj=new Object("some text")
       console.log(obj instanceof String)   //true

       //使用new调用基本包装类型的构造函数,与直接调用同名的转型函数是不一样的
       var value="25"
       var number=Number(value)
       console.log(typeof number)    //number

       var obj=new Number(value)
       console.log(obj)              //object

Boolean类型

Boolean类型是布尔值对应的引用类型,其实例重写valueOf方法,返回基本类型值true或false;重写toString方法,返回字符串“true”或“false”;Boolean对象用处不大,容易造成误解

       var falseObject=new Boolean(false)
       var result=falseObject&&true
       console.log(result)    //true 因为任何基本包装类型转为布尔值都是true

       var falseValue=false;
       result=falseValue&&true
       console.log(result)    //false 布尔运算中为false

       console.log(typeof falseObject)      //object
       console.log(typeof falseValue)       //boolean
       console.log(falseObject instanceof Boolean)   //true      instanceof 检测引用类型
       console.log(falseValue instanceof Boolean)    //false

Number类型

与数字值对应的引用类型,也是重写valueOf()表示基本类型的数值,toLocaleString(),toString(),返回的是字符串;不建议直接创建Number对象,和Boolean对象一样,容易混

       var num1=10
       console.log(typeof num1.toFixed(2))  //toFixed()方法将数值格式转为string;适合货币的处理
       var num2=10.005
       console.log(num2.toFixed(2))         //"10.01" 会四舍五入的
       
       var num3=10
       console.log(num1.toExponential(1))   //1.0e+1   科学计数法

       var num4=99                           
       console.log(num4.toPrecision(1))     //"1e+2"    toPrecision会自动查找适合的
       console.log(num4.toPrecision(2))     //"99"
       console.log(num4.toPrecision(3))     //"99.0"

String类型

是string值得引用类型,有length,索引,许多方法

1、字符方法

两个访问字符串中特定字符

charAt()和charCodeAt(),都接受一个参数即基于0的索引,其中charAt()以单个字符返回该索引字符,charCodeAt()返回的是该索引字符的字符编码

       var str="hello world"
       console.log(str.charAt(2))          //l
       console.log(str.charCodeAt(2))      //108 l的字符编码

2、字符串操作方法

       //concat方法
       var str1="hello"   
       var str2=str1.concat(" world")
       console.log(str1)        //hello   原字符串没有影响,而是新副本,和数组的concat一样
       console.log(str2)        //hello world 
         
//trim方法 此方法也会创建一个副本,删除前置和后缀的所有空格,对原字符串没有影响,IE9支持
var str1=" hello world "
var str2=str1.trim()
console.log(str1) //" hello world "
console.log(str2) //"hello world"
//字符串截取 var str="hello world" console.log(str.slice(3)) //lo world console.log(str.substring(3)) //lo world console.log(str.substr(3)) //lo world console.log(str.slice(3,7)) //lo w console.log(str.substring(3,7)) //lo w 第二个参数代表截取的最终位置,不包括 console.log(str.substr(3,7)) //lo worl 第二个参数代表截取的个数 //有负数的情况 var str2="hello world" console.log(str2.slice(-3)) //rld slice将传入的所有负值加上length console.log(str2.substring(-3)) //hello world substring将负的第一个参数加上length,负的第二个转换为0 console.log(str2.substr(-3)) //rld substr将所有负值都转换为0 console.log(str2.slice(3,-4)) //lo w console.log(str2.substring(3,-4)) //hel console.log(str2.substr(3,-4)) //""

3、字符串位置方法

        //字符串位置
        var str="hello world"
        console.log(str.indexOf("o"))        //4   从前开始查找    当然找不到直接返回-1
        console.log(str.lastIndexOf("o"))    //7   从后开始查找 

        varstr2="hello world"
        console.log(str.indexOf("o",4))      //4  从位置4向后找   
        console.log(str.lastIndexOf("o",4))  //4  从位置4向前找

      
        var str3="hello world for us to solve it"
        var position=[]
        var pos=str3.indexOf("o")
        while(pos>-1){
             position.push(pos)
             pos=str3.indexOf("o",pos+1)
        }
        console.log(position)                //4,7,13,20,23

4、大小写的转换toLowerCase()和toUpperCase()

5、字符串的匹配模式

        //match匹配,返回匹配结果数组,没有则为null;一般接受正则
        var str="hello world"
        console.log(str.match("9"))

        var str2="cat,bat,gat,zat"
        var pattern=/.at/
        var matches=str2.match(pattern)
        console.log(matches)            //数组第一项为匹配到的字符

        //search查找,返回查找元素的索引,找不到则为-1
        var str="hello world"
        console.log(str.search("e"))

        //replace替换,接受两个参数;第一个参数为正则或字符串;第二个参数为字符串或函数
        var text="cat,bat,sat,fat"
        var result=text.replace("at","ond")
        console.log(text)        //cat,bat,sat,fat
        console.log(result)      //cond,bat,sat,fat
        var result=text.replace(/.at/g,"ond")     //添加个全局属性
        console.log(result)      //cond,bond,sond,fond

        //第二个是参数还可以使用特殊的字符序列
        var result=text.replace(/(.at)/g,"word($1)")
        console.log(result)

        //第二个参数是函数时
        function htmls(text){
                return text.replace(/[<>"&]/g,function(matchvalue,pos,originalText){
                      switch(matchvalue){
                            case "<":
                               return "&lt;";
                            case ">":
                               return "&gt;";
                            case "\"":
                               return "&quot;";
                      }
                });
        }       
        
        console.log(htmls("<p calss=\"greeting\">hello world</p>"))  //打印出实例

单体内置对象

所谓单体内置对象是有ES实现,不依赖宿主环境的对象,这些对象在ES程序执行之前就已经存在,我们不必再去实例化内置对象,比如array,object,string,现在介绍global和math对象

1、URI编码方法

Global有2种方法对通用资源标识符进行编码

encodeURI用于对整个URI,不会对本身属于URI的特殊字符进行编码(冒号,斜杠,问号,井号)

encodeURIComponent用于对URI中的某一段,对任何非标准字符进行编码

在实践中更多是来查询字符串参数而不是基础URI进行编码

      var uri="http://www.baidu.com/illegal value.htm#start"     
      console.log(encodeURI(uri))      //http://www.baidu.com/illegal%20value.htm#start       只有空格被转换
      console.log(encodeURIComponent(uri))   //http%3A%2F%2Fwww.baidu.com%2Fillegal%20value.htm%23start   所有非规范都被转换

与encodeURI和encodeURIComponent相对应有两种方法:

decodeURI()和encodeURIComponent()方法,前者只能对encodeURI替换的字符进行解码;后者可以对encodeURIComponent替换的字符进行解码,即可以解码所有的字符

      var uri="http://www.baidu.com/illegal%20value.htm#start"
      console.log(decodeURI(uri))      //http://www.baidu.com/illegal value.htm#start  不能对井号进行解码,因为encodeURI不能对井号进行编码

      var uri2="http%3A%2F%2Fwww.baidu.com%2Fillegal%20value.htm%23start"
      console.log(decodeURIComponent(uri2))   //http://www.baidu.com/illegal value.htm#start

2、eval方法

js中强大的语法,充当一个js解析器作用,接受一个参数,即将要执行的js字符串

通过eval方法执行的代码被认为是包含该次调用的执行环境的一部分,被执行的代码具有与该执行环境相同的作用域链;注意:在eval里创建的任何变量和函数都不会被提升,因为它们被包含在一个字符串中,它们只在eval执行的时候被创建。在严格模式下,外部访问不到eval中创建的任何变量和函数。

      eval("alert(‘hi‘)")     //hi

      eval("function say(){alert(‘world‘)}")
      say()                   //world

      var message="hello world"
      eval("alert(message)")  //hello world

3、window对象

web浏览器将全局对象作为window对象的一部分来实现的,在全局作用域中声明的所有变量和函数都成为window对象的属性

      var color="red"
      function say(){
          console.log(window.color)
      }
      window.say()

      var global=function(){
            return this
      }()    //立即调用的函数表达式

Math对象

1、Math对象的属性,大多是一些数学方面的,可查找

2、最大值最小值min(),max()

3、四舍五入方法,ceil,floor,round

      var value=[12,34,3432,435]
      
      //把apply的第一次参数设置为Math对象,从而正确的this值
      var max=Math.max.apply(Math,value)
      console.log(max)
      var min=Math.min.apply(Math,value)
      console.log(min)

      console.log(Math.ceil(23.6))   //24     向上取整
      console.log(Math.floor(23.6))  //23     向下取整
      console.log(Math.round(23.6))  //24     四舍五入
      console.log(Math.round(23.4))  //23

 

4、random()方法

      //Math.random方法返回一个大于等于0,小于1的随机数
      //值=Math.floor(Math.random()*可能值的总数+第一个可能的值)
      var value=Math.floor(Math.random()*10+1)
      console.log(value)    //1——10的随机数

      var value2=Math.floor(Math.random()*9+2)
      console.log(value2)   //2——10的随机数

      //随机值得函数
      function selectFrom(lowerValue,upperValue){
            var choice=upperValue-lowerValue+1
            return Math.floor(Math.random()*choice+lowerValue)
      }
      var num=selectFrom(2,10)
      console.log(num)        //2——10的任意值
 

      var colors=["green","blue","yellow","purple","brown","olive"]
      var colors=colors[selectFrom(0,colors.length-1)]
      console.log(colors)     //数组中的任意个值

其他方法:

      console.log(Math.abs(-1))    //1  返回num的绝对值
      console.log(Math.sqrt(9))    //3  返回num的平方根
      console.log(Math.pow(2,3))   //8  返回num的power次幂

 

以上是关于基本包装类型的主要内容,如果未能解决你的问题,请参考以下文章

基本包装类型

js中基本包装类型详情

JS基础语法---基本包装类型

5.6 JS中基本包装类型

JavaScript 之 基本包装类型

JS中基本包装类型说明需求文档