亲宝软件园·资讯

展开

typeof和类型转换

前端爱好者080 人气:0
  1. 编程形式

① 面向过程

② 面向对象

③ Js既面向过程又面向对象

  1. typeof(数据)

1)typeof(数据)返回该数据是什么类型的

2)写法:

① typeof(数据)

② typeof 数据

3)typeof(数据)可以返回6个值(number,string,boolean,object,undefined,function),这六个值都是字符串类型的

4)null返回也是一个object

5)把一个没有定义的值,如a,放到typeof()中,输出,不会报错,它会输出字符串类型的undefined

  1. 类型转换

1) 显示类型转换

(1) Number(数据)  

1) 转化为数字

2) 转不成数字的,转化为NaN

3) true:1,false:0,null:0,undefined:NaN

4) 数据转化后不管能不能转成数字,其类型都会变成Number

(2) parseInt(数据,目标进制)

5)  将第一个参数转化为整型数字

6)  第二个参数的取值范围为(2—36)(0)

7)  转不成整型数字的,转化为NaN

8)  以数字位开始到非数字位结束

9)  true,false,null,undefined:NaN

10)  目标进制:以目标进制为基底将数据转化为十进制

11)  parseInt(数据,0)  ==  parseInt(数据) 或者输出NaN

12)  二进制只有0和1  这种写法parseInt(3,2) 输出NaN

(3) parseFloat(数据)

13) 以数字位开始到除了点以外的非数字位结束(如:parseFloat(123.2.3) == 123.2)

14) 转化为浮点型数字

(4) String(数据)

15) 把一切数据转化为字符串

(5) Boolean(数据)

16) 把数据转化为布尔值

17) 除undefined,null,NaN,””,false,0转化为布尔值是false,其余值都为true

(6) 数据.toString(目标进制)

18) 将数据转化为字符串

19) undefined和null没有toString方法,因此他们不能用这个方法

20) 目标进制:以10进制为基底转化为目标进制

(7) 实例解析

21) 题目:把二进制转化为16进制

22) 解析:二进制转化为十进制,然后再把十进制转化为十六进制

23) 方法:先用parseInt()把二进制转化为十进制,然后再用toString()把十进制转化为十六进制

24) 代码:

    //向用户获取这个二进制数

var num1 = parseInt(window.prompt('请输入一个二进制数'));

//把获取二进制数转化为十进制数

var num2 = parseInt(num1,2);

//把转化后的十进制数转化为十六进制数

var num3 = num2.toString(16);

//把转化为十六进制数输出

document.write(num3);

 

2) 隐式类型转换

(1) isNaN(数据)

1) 确定数据是否是NaN,是:true;不是:false

2) 内部机制:Number(数据)  ==> 看输出是否是NaN

(2) 数据 ++/--   ++/-- 数据

1) 内部机制:Number(数据)  ==>  转化后进行++/--计算

2) 转化后就算不是数字,是NaN,但是其类型依然是Number

(3) +/- 数据(一元正负)

1) 内部机制:Number(数据)  ==>  对转化后的数据添加+-号

(4) + (加号)

1) 内部机制:String()

2) 只要加号两边有一个是字符串,则就会在运算时调用String()方法

(5) -*/%

1) 内部机制:Number()

(6) && || !

1) 内部机制:Boolean()

(7) >  <  >=  <=

1) 任何数据类型与数字比较,会把该数据类型转化为数字(Number()),再进行比较

2) 字符串数字与字符串数字比较,会比较他的ascll码

3) 具体情况具体判定

4) 比较后以Boolean输出

(8) ==  !=

1) 任何数据类型与数字比较,会把该数据类型转化为数字(Number()),再进行比较

2) 具体情况具体判定

3) 比较后以Boolean输出

(9) 其他说明:

1) null/undefined 既不大于0,也不小于0,也不等于0

2) null == undefined   null !== undefined

(10) 不进行隐式类型转换

1) ===  !==

2) NaN !== NaN

  1. 作业

(1) typeof和类型转换课后作业

console.log(typeof(a));   //'undefined'

console.log(typeof(undefined)); //'undefined'

console.log(typeof(NaN));   //'number'

console.log(typeof(null));  //'object'

console.log(typeof(NaN));   //'number'

var a = "123abc";

console.log(typeof(+a));  //'number'

console.log(typeof(!!a));  //'boolean'

console.log(typeof(a + "")); //'string'

console.log(1 == "1");  //true

console.log(NaN == NaN); //false

console.log(NaN == undefined); //false

console.log("11" + 11);  //'1111'

console.log(1 === '1');  //false

console.log(parseInt('123abc')); //123

var num = 123123.345789;

console.log(num.toFixed(3)); //123123.346

console.log(typeof(typeof(a)));  //'string'

 

(2) 使用html+css写一个三角形

 

Html代码

<div class="box"></div>

 

Css代码

div.box{

width:0;

height:0;

border-width:50px;

border-style:solid;

border-left-color:transparent;

border-right-color:transparent;

border-top-color:transparent;

border-bottom-color:#456;

}

 

(3) 父元素为一个div,宽高不固定,子元素是一个块元素,宽高已知,如何让子元素在父元素内水平,垂直都居中

Html代码

<div class="father">

<div class="son"></div>

</div>

Css代码

div.father{

width:500px;

height:300px;

border:1px solid #489;

position:relative;

}

div.son{

width:100px;

height:100px;

background-color:#123;

position:absolute;

top:50%;

left:50%;

margin-left:-50px;

margin-top:-50px;

}

加载全部内容

相关教程
猜你喜欢
用户评论