parseInt()、parseFloat()与Number()的比较
我有一个同学最近在自学JavaScript,偶尔遇到问题了会让我帮忙解决,虽然我也是一个JavaScript菜鸟,但是我还是很乐意帮忙,这样不仅可以帮到别人,也可以让自己在解决问题的过程中学到更多知识。先来看看他的代码吧!
HTML代码:
<input type='text' id='txt1' />
<select id='select'>
<option value='+'>+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type='text' id='txt2' />
<input type='button' value=' = ' onclick="count()" /> <!--通过 = 按钮来调用创建的函数,得到结果-->
<input type='text' id='fruit' />
JavaScript代码:
function count(){
//获取第一个输入框的值
var num1 = document.getElementById("txt1");
//获取第二个输入框的值
var num2 = document.getElementById("txt2");
//获取选择框的值
var fuhao = document.getElementById("select").value;
function yunsuan(){
var num;
if (fuhao == "+") {
num = num1 + num2;
}else if(fuhao == "-"){
num = num1 - num2;
}else if(fuhao == "*"){
num = num1 * num2;
}else if(fuhao == "/"){
num = num1 / num2;
}
}
document.getElementById("fruit").value = num;
}
看完代码后,我发现了三个问题,分别为:
- num1和num2获取的是元素节点,而不是文本框的值,所以应该这样写:var num1 = document.getElementById("txt1").value; num2同num1
- num是一个局部变量,document.getElementById("fruit").value无法得到num的值
- 在JavaScript中+可以用来连接字符串,因此这里需要进行转换
修改后的JavaScript代码如下:
function count(){
var num;
//获取第一个输入框的值
var num1 = parseInt(document.getElementById("txt1").value);
//获取第二个输入框的值
var num2 = parseInt(document.getElementById("txt2").value);
//获取选择框的值
var fuhao = document.getElementById("select").value;
function yunsuan(){
if (fuhao == "+") {
num = num1 + num2;
}else if(fuhao == "-"){
num = num1 - num2;
}else if(fuhao == "*"){
num = num1 * num2;
}else if(fuhao == "/"){
num = num1 / num2;
}
}
document.getElementById("fruit").value = num;
}
但是,经过测试我发现得到的答案永远是undefined。所以我将JavaScript代码进一步修改为:
function count(){
var num;
//获取第一个输入框的值
var num1 = parseInt(document.getElementById("txt1").value);
//获取第二个输入框的值
var num2 = parseInt(document.getElementById("txt2").value);
//获取选择框的值
var fuhao = document.getElementById("select").value;
switch(fuhao){
case "+":
num = num1 + num2;
break;
case "-":
num = num1 - num2;
break;
case "*":
num = num1 * num2;
break;
case "/":
num = num1 / num2;
}
document.getElementById("fruit").value = num;
}
这次可以得到正确答案了,但是无法进行小数运算,所以我用Number()方法替换parseInt()方法,但是Number无法将字符串中的非数字字符过滤掉,所以我用parseFloat()来代替。这下可以很好地解决问题了。
知识链接:
parseInt():parseInt()函数可以解析一个字符串,并返回一个整数。它可接受两个参数,第一个参数是要解析的字符串,第二个参数是要解析的数字的基数,范围为2~36。如果省略该参数或其值为0,则以十进制来解析;如果该参数小于2或者大于36,则parseInt()将返回NaN。该方法可以将非数字字符(非首个字符)过滤掉,例如:parseInt("40d"),返回40,而parseInt("d40")则返回NaN。
parseFloat():parseFloat())函数可以解析一个字符串,并返回一个浮点数。该函数在解析过程中遇到了正负号、数字、小数点或者科学计数法中的指数(e 或 E)以外的字符,则它会忽略该字符以及之后的所有字符,返回当前已经解析到的浮点数。同时参数字符串首尾的空白符会被忽略。
Number():Number()函数把对象的值转换为数字。如果参数是Date对象,Number()返回1970年1月1日至今的毫秒数。如果对象的值无法转换为数字,那么Number()函数返回NaN。
刚开始一直没弄明白为什么使用if...else总是得到undefined,经过反复的测试,终于得到了我想要的结果,代码如下:
function count(){
var num;
//获取第一个输入框的值
var num1 = parseFloat(document.getElementById("txt1").value);
//获取第二个输入框的值
var num2 = parseFloat(document.getElementById("txt2").value);
//获取选择框的值
var fuhao = document.getElementById("select").value;
if (fuhao == "+") {
num = num1 + num2;
}else if(fuhao == "-"){
num = num1 - num2;
}else if(fuhao == "*"){
num = num1 * num2
}else{
num = num1 / num2;
}
document.getElementById("fruit").value = num;
}
parseInt()、parseFloat()与Number()的比较的更多相关文章
- parseInt parseFloat isNaN Number 区别和具体的转换规则及用法
原文链接:https://blog.csdn.net/wulove52/article/details/84953998 在javascript 我经常用到,parseInt.parseFloat.N ...
- parseint和parsefloat总结number。隐形转换
parseint:会认识一些字符+.-.空格,其他的就会截止譬如23hudhchauch结果为:23,对于boollen类型不能转换为1或是0. number:是对整体的转换.对true的转换为1. ...
- Number,parseInt,parseFloat函数
Number,parseInt,parseFloat函数 console.group('Number'); console.log(Number( console.log(Number( consol ...
- Number(),parseInt(),parseFloat(),Math.round(),Math.floor(),Math.ceil()对比横评
首先,这些处理方法可分为三类. 1,只用来处理数字取整问题的:Math.round(),Math.floor(),Math.ceil(): 2,专门用于把字符串转化成数值:parseInt(),par ...
- isNaN与parseInt/parseFloat
isNaN 返回一个 Boolean 值,指明提供的值是否是保留值 NaN (不是数字). NaN 即 Not a Number isNaN(numValue) 必选项 numvalue 参数为要检查 ...
- js字符转换成整型 parseInt()函数规程Number()函数
今天在做一个js加法的时候,忘记将字符转换成整型,导致将加号认为是连接符, 在运算前要先对字符井行类型转换,使用parseInt()函数 使用Number()将字符转换成int型效果更好
- parseFloat 和 Number isNaN 转换
parseFloat(true) // NaN Number( parseFloat(null) // NaN Number( parseFloat('') // NaN Number('') par ...
- js parseInt();parseFloat;Number()
1: parseInt( numString [, radix ] ) [测试浏览器:chromium && firefox] ①parseInt()函数用于将字符串转换为(十进制) ...
- parseInt、parseFloat、Number、Boolean、valueOf总结
parseInt(string, radix) 功能: 将字符串转换为十进制的数字 radix: string的进制,没有时根据string进行判断: 1~9开头 十进制 0x开头 16进制 0开头 ...
随机推荐
- OpenResty
- Codeforces Round #321 (Div. 2) B. Kefa and Company 二分
B. Kefa and Company Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/580/pr ...
- SQL Server 性能优化3 该指数(Index)保养
前言 之前的一篇文章介绍了索引来提高数据库的查询性能,这其实仅仅是个开始.也许假设缺乏适当的保养,索引你以前建立的,甚至成为拖累,成为帮凶下降数据库的性能. 寻找碎片 消除碎片索引维护可能是最常规的任 ...
- InSAR在地面沉降监测中的应用及发展前景
合成孔径雷达(Synthetic Aperture Radar,SAR)的概念始于20世纪50年代,是正在发展中的极具潜力的微波遥感技术.SAR具有全天时.全天候的工作能力,能够穿透云层,对某些地物具 ...
- insert erase和replace的例子
9.43 编写一个函数,接受三个string参数s.oldVal和newVal.使用迭代器及insert和erase函数将s中所有oldval替换为newVal.测试程序,用它替换通用的简写形式,如, ...
- c#_DropdownList Panel Textbox 控件交互使用,有autopostback和没有的区别
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx. ...
- C#_delegate - 值参数和引用参数
值参数不能加,引用参数可以. 引用参数是共享的 using System; using System.Collections.Generic; using System.Linq; using Sys ...
- Android进阶笔记04:Android进程间通讯(IPC)之Messenger
一. Android进程间通讯之Messenger 的引入 (1)引言: 平时一说进程间通讯,大家都会想到AIDL,其实messenger和AIDL作用一样,都可以进行进程间通讯.它是基于消 ...
- 使用SDWebImage 怎么获取指定请求对应的缓存图片呢?
SDWebImage会对我们加载的网络数据进行缓存,但有时候我们想要拿到缓存数据中的图片,可以通过下个方法实现: UIImage *thumbnailImage = [[SDImageCache sh ...
- WebSocket原理及与http1.0/1.1 long poll和 ajax轮询的区别【转自知乎】
一.WebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接的(长连接,循环连接的不算)首先HTTP有1.1和1.0之说,也就是所谓的ke ...