【JS基础回归】关于parseInt 与 numberObj.toString 中的“raidx”

一、关于radix的疑问

parseInt以及toString是经常用到的两个方法,如下所示

parseInt (string [, radix])

numberObj.toString ( [ radix ] )

我们通常会这样使用:

parseInt('123abc');  //输出 123

var num = 123;
num.toString();  //输出 '123'

那么,radix这个参数的作用是?神马场景下会用到?有什么注意事项?下文会简单讲解

二、关于parseInt与toString里的radix

parseInt (string [, radix])

作用

讲解可见:http://www.w3school.com.cn/js/jsref_parseInt.asp

常见使用场景

  1. 将字符串转成对应整数
  2. 将2进制数据转成对应的10进制数据,如canvas API里对像素数据的处理时可以用到(比如将读取的10进制像素数据各种处理,比如低位替换,然后再转回10进制)

注意点:

w3school里的解释其实挺详细了,归纳起来要点如下:

  1. radix可选,取值范围为2-36(包含2与36)
  2. 如指定了radix,且radix为合法值,则用radix来解析string;如radix非法,返回NaN
  3. 如无指定radix,且string不以'0x'或者'0X'开头,则radix默认为10;
  4. 如无指定radix,且string以'0x'或者'0X'开头,则radix默认为16;

简单看如下demo,大致可以不同情况下radix对于最终结果的影响。至于对于string的解析,不再这里进行讨论,可参考上面那个链接

parseInt(11);  //输出 11

parseInt(11, 2);  //输出 3
parseInt(11, 36);  //输出 37
parseInt(11, 38);  //输出 NaN

parseInt('0x11');  //输出 17
parseInt('0x11', 10);  //输出 0

numberObj.toString ( [ radix ] )

作用

  将数字numberObj转成其对应radix进制的字符串

常见使用场景

  1. 将10进制数据转成对应的2进制数据。比如canvas里对像素点的低二位数据进行处理,需现将像素点的RGB值转成对应的二进制数据(默认读取到的是10进制的)

参见:

  http://www.w3school.com.cn/js/jsref_tostring_number.asp

注意点

  1. radix可选,默认为10,合法值为2-36(包含2与36)
  2. 当radix不是2-36的整数时,会抛出RangeError错误,而不是想parseInt那样简单返回NaN之类的
  3. “当调用toString方法的对象不是Number时,抛出typeError错误”,这句话略费解。其实这里指的是Number.prototype.toString,即Number对象的原型方法,这个看下demo可能更直观点

demo如下,Number.prototype.toString.call('123')这种调用方式是相当奇怪的,至今没有这种需求的场景,所以知道有这么回事就可以了

var num = 123;

num.toString();  //输出 '123'
num.toString(2);  //输出 '1111011'

num.toString(37);  //输出 'RangeError: toString() radix argument must be between 2 and 36'

'123'.toString(2);  //输出 '123'
Number.prototype.toString.call('123');  //输出 'TypeError: Number.prototype.toString is not generic'

三、关于radix取值范围的限制

看了下EC 5里面对radix的限制,没有说明这个取值范围的原因,于是问了下hax大神,hax大神简单明了地回答

36 = 10数字 + 26字母。

于是仿佛明白了什么。。。0 1 2 3 4 5 ... A B C ... Y Z

有种被鄙视的感觉,羞惭满面。。。

 

四、写在后面

文中示例如有错漏,请指出;如觉得文章对您有用,可点击“推荐” :)

时间: 2024-11-08 19:55:14

【JS基础回归】关于parseInt 与 numberObj.toString 中的“raidx”的相关文章

JS基础教程——正则表达式示例(推荐)

正则表达式的() [] {}有不同的意思. () 是为了提取匹配的字符串.表达式中有几个()就有几个相应的匹配字符串. (\s*)表示连续空格的字符串. []是定义匹配的字符范围.比如 [a-zA-Z0-9] 表示相应位置的字符要匹配英文字符和数字.[\s*]表示空格或者*号. {}一般用来表示匹配的长度,比如 \s{3} 表示匹配三个空格,\s[1,3]表示匹配一到三个空格. (0-9) 匹配 '0-9′ 本身. [0-9]* 匹配数字(注意后面有 *,可以为空)[0-9]+ 匹配数字(注意后

7个JS基础知识总结

 这篇文章主要介绍了7个JS基础知识,需要的朋友可以参考下 1.如何在一个对象上添加属性?  方法一:var b = {}; b["name"] = "test"; delete b.name 删除对象的属性 方法二:b.name ="test"; 2.如何判断一个变量是否声明? typeof(a) =="undefined" typeof(d) =="function" 是否为函数   3.怎么表示为字符

JS基础系列之正则表达式_正则表达式

正则表达式是一个很牛逼的东东,今天在这里只是简单的给刚刚接触JS的人普及一下,里面若有争议的地方欢迎大家留言! 1.1 什么是正则表达式 ​ 正则表达式(regular expression)是一个描述字符模式的对象,ECMAScript的RegExp 类表示正则表达式,而String和RegExp都定义了使用正则表达式进行强大的模式匹配和文本检索与替换的函数. ​ 正则表达式用于对字符串模式匹配及检索替换,是对字符串执行模式匹配的强大工具. 1.2 正则表达式的作用 ​ 正则表达式主要用来验证

js基础知识(公有方法、私有方法、特权方法)_基础知识

本文涉及的主题虽然很基础,在许多人看来属于小伎俩,但在JavaScript基础知识中属于一个综合性的话题.这里会涉及到对象属性的封装.原型.构造函数.闭包以及立即执行表达式等知识. 公有方法 公有方法就是能被外部访问并调用的方法. // 在对象中 var Restaurant = { name: 'McDonald', // 公有方法 getName: function() { return this.name; } } // 在构造函数中 function Person(name, age)

js基础之DOM中document对象的常用属性方法详解_javascript技巧

-----引入 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1  document.anchors  返回对文档中所有 Anchor 对象的引用.还有document.links/document.forms/document.images等 2  document.URL       返回当前文档的url 3  document.title       返回当前文档的标题 4  do

js基础之DOM中元素对象的属性方法详解_javascript技巧

在 HTML DOM (文档对象模型)中,每个部分都是节点. 节点是DOM结构中最基本的组成单元,每一个HTML标签都是DOM结构的节点. 文档是一个    文档节点 . 所有的HTML元素都是    元素节点 所有 HTML 属性都是    属性节点 文本插入到 HTML 元素是    文本节点 注释是    注释节点. 最基本的节点类型是Node类型,其他所有类型都继承自Node,DOM操作往往是js中开销最大的部分,因而NodeList导致的问题最多.要注意:NodeList是'动态的',

最细致的vue.js基础语法 值得收藏!_javascript技巧

介绍 前段时间接触到一个库叫做Vue.js, 个人感觉很棒,所以整理了一篇博文做个介绍. Vue读音/vju:/,和view类似.是一个数据驱动的web界面库.Vue.js只聚焦于视图层,可以很容易的和其他库整合.代码压缩后只有24kb. 可以去 这里下载 .自己整理了一个Vue.js的demo, https://github.com/chenhao-ch/demo-vue 快速入门以下代码是Vue.js最简单的例子, 当input中的内容变化时,p节点的内容会跟着变化. <!-- html -

node.js基础模块http、网页分析工具cherrio实现爬虫_node.js

一.前言       说是爬虫初探,其实并没有用到爬虫相关第三方类库,主要用了node.js基础模块http.网页分析工具cherrio. 使用http直接获取url路径对应网页资源,然后使用cherrio分析. 这里我主要学习过的案例自己敲了一遍,加深理解.在coding的过程中,我第一次把jq获取后的对象直接用forEach遍历,直接报错,是因为jq没有对应的这个方法,只有js数组可以调用. 二.知识点     ①:superagent抓去网页工具.我暂时未用到.     ②:cherrio

JS基础随笔(菜鸟必看篇)_基础知识

在学习的过程中总会一次次的冒出以前囫囵吞枣的地方,下面将今天学到的一下知识点记录下来方便以后查看. JavaScript中的数据类型 简单(基本)数据类型:Number.String.Boolean.Undefined.Null 复杂(引用)数据类型: Object.Array.Date.function等 下面介绍一下简单(基本)数据类型和复杂(引用)数据类型的区别: 简单数据类型:在栈内直接存储值,如下图所示