随笔 - 0, 文章 - 75, 评论 - 0, 引用 - 0
数据加载中……

js的类型转换详解

js的类型转换是js的基础,必须要掌握的,我做了一下例子分析,大家可以直接复制运行:



<script type="text/javascript">
var str =
"100";
var num = 100;
var bool = true;
var obj =
{};

//string transform to number
var str_num1 =
Number(str);
var str_num2 = str - 2;
var str_num3 =
parseInt(str,8);//parseInt只能用于字符串转为数字
//string transform to
bool
var str_bool1 = Boolean(str);
var str_bool2 =
!!(str);
//string transform to object
var str_obj1=
Object(str);
document.write("string to num:<br>type:"+
typeof(str_num1) + "&nbsp;&nbsp;&nbsp;str_num1:" +
str_num1);
  document.write("<br>type:"+ typeof(str_num2) +
"&nbsp;&nbsp;&nbsp;str_num2:" +
str_num2);
document.write("<br>type:"+ typeof(str_num3) +
"&nbsp;&nbsp;&nbsp;str_num3:" +
str_num3);
document.write("<br><br>string to
bool:<br>type:"+ typeof(str_bool1) +
"&nbsp;&nbsp;&nbsp;str_bool1:" +
str_bool1);
document.write("<br>type:"+ typeof(str_bool2) +
"&nbsp;&nbsp;&nbsp;str_bool2:" +
str_bool2);
document.write("<br><br>string to
object:<br>type:"+ typeof(str_obj1) +
"&nbsp;&nbsp;&nbsp;str_obj1:" +
str_obj1);

//number transform to string
var num_str1
= String(num);
var num_str2 = num.toFixed(2);
var num_str3 =
num + "1";
var num_str4 = num.toString();
//number transform
to bool
var num_bool1 = Boolean(num);
var num_bool2 =
!!(num);
//number transform to object
var num_obj1 =
Object(num);
document.write("<br><br><br><br>num
to string:<br>type:"+ typeof(num_str1) +
"&nbsp;&nbsp;&nbsp;num_str1:" +
num_str1);
document.write("<br>type:"+ typeof(num_str2) +
"&nbsp;&nbsp;&nbsp;num_str2:" +
num_str2);
document.write("<br>type:"+ typeof(num_str3) +
"&nbsp;&nbsp;&nbsp;num_str3:" +
num_str3);
document.write("<br>type:"+ typeof(num_str4) +
"&nbsp;&nbsp;&nbsp;num_str4:" +
num_str4);
document.write("<br><br>num to
bool:<br>type:"+ typeof(num_bool1) +
"&nbsp;&nbsp;&nbsp;num_bool1:" +
num_bool1);
document.write("<br>type:"+ typeof(num_bool2) +
"&nbsp;&nbsp;&nbsp;num_bool2:" +
num_bool2);
document.write("<br><br>num to
object:<br>type:"+ typeof(num_obj1) +
"&nbsp;&nbsp;&nbsp;num_obj1:" + num_obj1);

//bool
transform to num
var bool_num1 = Number(bool);
var bool_num2 =
bool - 2;
var bool_num3 = parseInt(bool);
//bool transform to
string
var bool_str1 = String(bool);
var bool_str2 = bool +
"2";
var bool_str3 = bool.toString();
//bool transform to
object
var bool_obj1 =
Object(bool);
document.write("<br><br><br><br>bool
to number:<br>type:"+ typeof(bool_num1) +
"&nbsp;&nbsp;&nbsp;bool_num1:" +
bool_num1);
document.write("<br>type:"+ typeof(bool_num2) +
"&nbsp;&nbsp;&nbsp;bool_num2:" +
bool_num2);
document.write("<br>type:"+ typeof(bool_num3) +
"&nbsp;&nbsp;&nbsp;bool_num3:" +
bool_num3);
document.write("<br><br>bool to
string:<br>type:"+ typeof(bool_str1) +
"&nbsp;&nbsp;&nbsp;bool_str1:" +
bool_str1);
document.write("<br>type:"+ typeof(bool_str2) +
"&nbsp;&nbsp;&nbsp;bool_str2:" +
bool_str2);
document.write("<br>type:"+ typeof(bool_str3) +
"&nbsp;&nbsp;&nbsp;bool_str3:" +
bool_str3);
document.write("<br><br>bool to
object:<br>type:"+ typeof(bool_obj1) +
"&nbsp;&nbsp;&nbsp;bool_obj1:" +
bool_obj1);

//object transform to num
var obj_num1 =
Number(obj);
var obj_num2 = obj - 2;
var obj_num3 =
parseInt(obj);
//object transform to string
var obj_str1 =
String(obj);
var obj_str2 = obj + "2";
var obj_str3 =
obj.toString();
//object transform to bool
var obj_bool1 =
Boolean(obj);
var obj_bool2 =
!!(obj);
document.write("<br><br><br><br>object
to number:<br>type:"+ typeof(obj_num1) +
"&nbsp;&nbsp;&nbsp;obj_num1:" +
obj_num1);
document.write("<br>type:"+ typeof(obj_num2) +
"&nbsp;&nbsp;&nbsp;obj_num2:" +
obj_num2);
document.write("<br>type:"+ typeof(obj_num3) +
"&nbsp;&nbsp;&nbsp;obj_num3:" +
obj_num3);
document.write("<br><br>object to
string:<br>type:"+ typeof(obj_str1) +
"&nbsp;&nbsp;&nbsp;obj_str1:" +
obj_str1);
document.write("<br>type:"+ typeof(obj_str2) +
"&nbsp;&nbsp;&nbsp;obj_str2:" +
obj_str2);
document.write("<br>type:"+ typeof(obj_str3) +
"&nbsp;&nbsp;&nbsp;obj_str3:" +
obj_str3);
document.write("<br><br>object to
bool:<br>type:"+ typeof(obj_bool1) +
"&nbsp;&nbsp;&nbsp;obj_bool1:" +
obj_bool1);
document.write("<br>type:"+ typeof(obj_bool2) +
"&nbsp;&nbsp;&nbsp;obj_bool2:" + obj_bool2);



//Boolean()用法
document.write("<br><br><br>Boolean()的用法");
document.write(Boolean("")
+ "<br>"); //false
document.write(Boolean(null) + "<br>");
//false
document.write(Boolean("hi") +
"<br>");//true
document.write(Boolean(200) +
"<br>");//true
document.write(Boolean(0) +
"<br>");//false
document.write(Boolean(undefined) +
"<br>");//false
document.write(Boolean(new Object()) +
"<br>");//true


//Number()用法
document.write("<br><br><br>Number()的用法");
document.write(Number("")
+ "<br>"); //0
document.write(Number(null) + "<br>");
//0
document.write(Number("hi") +
"<br>");//NaN
document.write(Number(200) +
"<br>");//200
document.write(Number(0) +
"<br>");//0
document.write(Number(undefined) +
"<br>");//NaN
document.write(Number(new Object()) +
"<br>");//NaN
document.write(false + "<br>");
//0
document.write(true + "<br>");
//1

//Object()的用法
document.write("<br><br><br>Object()的用法");
document.write(Object("")
+ "<br>"); //返回空格
document.write(Object(null) + "<br>");
//[object Object]
document.write(Object("hi") +
"<br>");//h3
document.write(Object(200) +
"<br>");//200
document.write(Object(0) +
"<br>");//0
document.write(Object(undefined) +
"<br>");//[object Object]
document.write(Object(new Object()) +
"<br>");//[object Object]
document.write(false + "<br>");
//false
document.write(true + "<br>");
//true
</script>



结果如下:


string to
num:
type:number str_num1:100
type:number str_num2:98
type:number str_num3:64

string
to
bool:
type:boolean str_bool1:true
type:boolean str_bool2:true

string
to object:
type:object str_obj1:100



num to
string:
type:string num_str1:100
type:string num_str2:100.00
type:string num_str3:1001
type:string num_str4:100

num
to
bool:
type:boolean num_bool1:true
type:boolean num_bool2:true

num
to object:
type:object num_obj1:100



bool to
number:
type:number bool_num1:1
type:number bool_num2:-1
type:number bool_num3:NaN

bool
to
string:
type:string bool_str1:true
type:string bool_str2:true2
type:string bool_str3:true

bool
to object:
type:object bool_obj1:true



object
to
number:
type:number obj_num1:NaN
type:number obj_num2:NaN
type:number obj_num3:NaN

object
to string:
type:string obj_str1:[object
Object]
type:string obj_str2:[object
Object]2
type:string obj_str3:[object Object]

object
to
bool:
type:boolean obj_bool1:true
type:boolean obj_bool2:true


Boolean()的用法false
false
true
true
false
false
true



Number()的用法0
0
NaN
200
0
NaN
NaN
false
true



Object()的用法
[object
Object]
hi
200
0
[object Object]
[object
Object]
false
true




下面是实验总结:


类型转换分为三种方式:(1)强类型转换(2)转换函数转换(3)弱类型转换


  • 强类型转换:Number(value); String(value); Boolean(value); Object(value)
  • 转换函数转换:parseInt(value); parseFloat(value)
  • 弱类型转换:var str = str - 0; var num = num + "2"; var num = !!num;


  1. 转换为number类型方法: Number(value); parseInt(value);
    parseFloat(value),注意:只有对String类型调用这些方法,这两个函数才能正确运行;对其他类型返回的是NaN(Not a Number)
    var value = value - 1; 若value为非数字形式的字符串或对象,返回NaN
  2. 转换为string类型方法: String(value); var value = value + "A"
    若value为对象类型,则对象首先执行toString()方法,转化为字符串再与"A"相连; value.toString();

  3. 转换为boolean类型方法: Boolean(value); !!(value);
  4. 转换为object类型方法: Object(value)

另外,Number(),Boolean(),Object()的用法可以参考实验结果。

posted on 2012-04-22 15:10 hantai 阅读(84) 评论(0)  编辑  收藏


只有注册用户登录后才能发表评论。


网站导航: