• javascript中的toString()


    基本介绍

    javascript中的toString方法是我们在写前端时经常要用的一个函数,也就是将我们的变量转换成字符串的方法。

    javascript中各种类型的toString方法

    javascript中定义了7种数据类型,其中包含了6种原始的数据类型:Boolean Null Undefined Number String Symbol(ECMAScript 6 新定义)Object,在这7中数据类型中,除了undefined和null类型之外,都有toString方法。

    Boolean 类型的toString()

    对于Boolean对象或值,内置的 toString 方法返回字符串 "true" 或 "false",具体返回哪个取决于布尔对象的值。

    Number类型的toString()

    Number对象的toString方法返回指定 Number 对象的字符串表示形式。其toString方法可以传递一个参数radix,这个参数的值得取值范围为(2到36)表示进行toString时候所选用的进制,默认情况下选用10进制,如果radix的值不在2到36之间的话,则会抛出一个异常。

    如果Number对象的toString方法的进制大于10的话,则会用字母代替,这就是为什么最大值为36了,其实就是0到9这十个数字再加上26个英文字母。如果对象为负数则保留负号。

    var count = 10;
    console.log(count.toString());    // 输出 '10'
    console.log((17).toString());     // 输出 '17'
    console.log((17.2).toString());   // 输出 '17.2'
    var x = 6;
    console.log(x.toString(2));       // 输出 '110'
    console.log((254).toString(16));  // 输出 'fe'
    console.log((35).toString(36));   // 输出 'z'
    console.log((-10).toString(2));   // 输出 '-1010'
    console.log((-0xff).toString(2)); // 输出 '-11111111'
    console.log((-12.111).toString(16)) // 输出 '-c.1c6a7ef9db23'
    

    针对于数字的toString,其实还有一些坑需要爬:

    • 如归对数字直接使用toString方法的话,浏览器会报错这个时候就需要我们用括号将数字个扩起来,再进行toString,这是因为javascript引擎在解释代码时对于“1.toString()”认为“.”是浮点符号,但因小数点后面的字符是非法的,所以报语法错误;而后面的“1..toString()和1.2.toStirng()”写法,javascript引擎认为第一个“.”小数点,的二个为属性访问语法,所以都能正确解释执行;对于“(1).toStirng()”的写法,用“()”排除了“.”被视为小数点的语法解释,所以这种写法能够被解释执行;

    • 纯小数的小数点后面有连续6或6个以上的“0”时,小数将用e表示法进行输出;

      var num = 0.000006;//小数点后面有5个“0”
      console.log(num.toString());//"0.000006"
      var num = 0.0000006;//小数点后面有6个“0”
      console.log(num.toString());//"6e-7"
      
    • 浮点数整数部分的位数大于21时,输出时采用e表示法

      ar num = 1234567890123456789012;
      console.log(num.toString());//"1.2345678901234568e+21"
      

    String 类型的toString()

    String 类型的toString() 方法返回指定对象的字符串形式。

    var str = 'nihao'
    console.log(str.toString()) // 输出nihao
    

    object 类型的toString()

    对于object类型,也就是对象类型。每个对象都有一个toString()方法,当该对象被表示为一个文本值时,或者一个对象以预期的字符串方式引用时自动调用。默认情况下,toString()方法被每个Object对象继承。如果此方法在自定义对象中未被覆盖,toString() 返回 "[object type]",其中type是对象的类型。

    可以自定义一个方法来取代默认的 toString() 方法。该 toString() 方法不能传入参数并且必须返回一个字符串。自定义的 toString() 方法可以是任何需要的值,但如果它附带有关对象的信息,它将变的非常有用。

    例如

    function Dog(name,breed,color,sex) {
    	this.name=name;
    	this.breed=breed;
    	this.color=color;
    	this.sex=sex;
    }
    
    var theDog = new Dog("Gabby","Lab","chocolate","female");
    

    如果使用theDog.toString()的话,则会返回出来一个'[object Object]',接下来定义一toString方法来覆盖object自带的toString方法:

    Dog.prototype.toString = function dogToString() {
    	var ret = "Dog " + this.name + " is a " + this.sex + " " + this.color + " " + this.breed;
    	return ret;
    }
    

    然后使用toString则返回 "Dog Gabby is a female chocolate Lab"

    对于object的toString方法来说们不仅仅是将一个对象转换成'[object Object]'这个用途,其实很多时候会使用object.toString.call()来检测变量的类型。

    var toString = Object.prototype.toString;
    
    toString.call(new Date); // [object Date]
    toString.call(new String); // [object String]
    toString.call(Math); // [object Math]
    
    //Since JavaScript 1.8.5
    toString.call(undefined); // [object Undefined]
    toString.call(null); // [object Null]
    

    所以很多时候我们能够通过toString这个方法来做一些类型检测的工作。

    数组类型的toString

    对于数组的toString方法,其实有一个不同的地方,就是在我们调用数组的toString方法的时候。其实是调用数组中的每个元素的toString方法,最后将结果串联起来。

    [new Date(), 123, '23'].toString() // Wed May 20 2020 08:50:49 GMT+0800 (中国标准时间),123,23
    [{}, 123].toString() // [object Object],123
    [1,2, [3, 4]].toString() // 1,2,3,4
    

    从上面的例子中,我们会发现一个如果是多维数组,通过toString转换出来的结果其实和一维数组调用toString转换出来的结果是一样的。这个时候我们就能考虑到数组的toString的另外一个用法就是可以将多维数组一维化(或者说是数组的扁平化),其实这个将数组进行一维化的方是有一个弊端的,就是不区分数字类型的值字符串的值举个例子:

    [1, [2,3,4]].toString() // 1,2,3,4
    ['1', [2, '3', 4]].toString() // 1,2,3,4
    
  • 相关阅读:
    第二周总结
    币值转换
    抓老鼠
    秋季学习总结
    第七周作业
    第六周作业
    2019年春季第五周
    2019年春季学期第四周作业
    2019年春季学期第三周作业
    2019年春季学期第二周作业
  • 原文地址:https://www.cnblogs.com/ShuiNian/p/8421961.html
Copyright © 2020-2023  润新知