Javascript学习笔记-----类型、值和变量

     在编程语言中，能够表示并操作的值的类型成为数据类型。编程语言最基本的特征就是能够支持多种数据类型。

javascript的数据类型分为两类：原始类型和对象类型，除了数字、字符串、布尔值、NULL和undedined之外就是对象。

数字类型

 js的数字类型只有一种，叫做Number.js中的所有数字皆属于此类型。包括整数1，-2，3，浮点数1.1，-1.2，1.3都属于此类型。所以,在js中,typof 整数或者 typof 浮点数返回的都是number.

JS的类型转换

 js中有三个常用函数用于将非数字类型转换为数字类型,分别是,Number(),parseInt,parseFloat();可以直接在window作用域下调用,用法:

aNumber =  Number(notNumber);

aInt =  parseInt(notNumber);

aFloat = parseFloat(notNumber);

从函数名,可以看出函数的作用来:

Number():可以将非数字转换为数字,转换结果可能为整数,也可能为浮点数

parseInt():将非数字类型转换为数字,转换结果为整数,直接取整,不进行四舍五入运算

parseFloat():将非数字类型转换为数字类型.转换结果为浮点数.

列举一些常见转换:

 “a123”“123a”“abc”“2.2”“2.8”"123a21"NumberNaNNaNNaN2.22.8NaNparseIntNaN123NaN22123parseFloatNaN123NaN2.22.8123

 

从表中我们可以看到常见的转换形式.

那么我们得到从String转换到Number型号的一般规则:
使用parseInt和parseFloat转换时,从左边开始,在遇到第一个非数字,非浮点的字符为止,之间包含的数字,浮点,转换为对应的数字.如果左起第一位即为非数字非浮点的字符,则转换结果直接为NaN.使用Number()转换时,只要包含有非数字和浮点的符号,无论位置,均会转换为NaN.

同时表中也出现了一个奇怪的字符NaN.NaN是一个奇怪的玩意,我们会在后面提到,这里暂时认为当运算无法返回一个正确的数值时，会返回NaN.

JS混合类型的计算

最常用到的是Number+String,Float+Int类型,可以用两句话来概括:

不同类型相加(String+Number),结果为简单联结,并且与String或者Number的前后顺序无关.
示例: "2.2"+2  结果 2.22;    2+"2.2"结果22.2
相同类型相加(Number(int)+Number(float)),结果为将较低精度转换为较高精度然后进行运算,也与前后顺序无关
示例:parseInt(2)+parseFloat(2.2) = 4.2 ; parseInt(2)+parseFloat(2.2) = 4.2

除了加法之外的混合运算(-,/等),和加法截然不同(切记):
不同类型的的其他运算(比如String-Number),会将其他非数字类型调用Number方法转换为数字类型,参与运算,前后顺序无关.
例如:"122"-2 =120, 120-"110" =10,"120"/2=60, 2/"1"=2

原因分析:同为数学运算符,为什么+和其他运算符号有如此大的差异呢?原来+在js中不光作为加法符号使用,还有一个更加常用的功能:联结字符串.所以遇到加法符号的时候,js引擎会优先把+作为字符串联结的操作符.因此如果有字符串参与的加法运算,会先把参与运算的其他类型转换为字符串,再执行运算.

NaN和Infinity

NaN,在Js中非常特殊.NaN是Number对象的一个属性.我们可以通过Number.NaN来取得.所以NaN严格的来说,不是一个数字,但是又具有一些数字的特征比如 typof NaN 为Number.

1.NaN的类型(typeof)是Number
2.NaN无大小,并且NaN不等于NaN!

比如我们上面表中列出的,将字符串abc转换为数字的时候,得到的结果为NaN.原因是abc在数字中没有对应的值,强制转换为数字类型后,得到NaN.
事实上,

NaN也可以参与运算,在js中是这么处理的:

NaN参与数字运算,结果仍然是NaN.
所以: 1+NaN =NaN,1.5+NaN =NaN
NaN参与混合类型计算,遵守数字类型和非数字类型混合运算的规律:
所以:NaN+"abc" 结果:NaNabc;  “abc”+NaN 结果:abcNaN
NaN不等于NaN
所以:NaN==NaN 结果:false; NaN!=NaN 结果:true ;NaN>NaN||NaN<NaN结果:false(小心,这里也是false)

Js中另外一个特殊的数字叫做Infinity,表示正无穷大.在js中在区间-(+)1.7976931348623157E+10308之外的数字都认为是无穷大(负无穷大).同样的,这句话也有两个含义:

1.Infinity的类型是Number
2.Infinity在js中是有限的,但是只要其大(或小)到一定程度,js就会认为其是无穷.
比如 2/0就会产生Infinity.

同样的Infinity有很多特性,Infinity参与数字运算的结果,我总结了一张表:

Infinity+(*)常数Infinity－(/)常数Infinity-(/)InfinityInfinity+(*)InfinityInfinity==InfinityInfinity!=InfinityInfinityInfinityNaNInfinitytruefalse

运算规则大体上类似与NaN,但是还有些不同
Infinity参与混合类型计算,遵守数字类型和非数字类型混合运算规律

补充的几个方法

JS数字类型的几个方法好像不太见到有人用,我用搜索引擎搜的时候,发现造车轮的程序员还大有人在.
1.Number.toFixed(num);
  用途:取得小数点后num位有效数字,运算中会四舍五入.
   举例: (3).toFixed(3),得到3.000;(3.1415926).toFixed(3) ,结果3.142
2.Number.toPrecision(num)
  用途:取num位有效数字,运算中会四舍五入
  举例: (3).toPrecision(3),得到3.00;(3.1415926).toFixed(4) ,结果3.142

题目

在搜集资料整理这篇文章的时候,我找到国内的js高手之一月影出的几个关于js的题目,和数字类型相关的几个,我觉得很有意思,列出来给给大家看看,相信如果有人能从头到尾阅读,这几个问题应该是可以迎刃而解的
１.typeof(NaN) ,typeof(Infinity)

2.NaN == NaN
3.NaN != NaN
4.NaN >= NaN
5.parseInt("123abc")
6."123abc" - 0
7.Infinity > 10
8.Infinity > "abc"
9.Infinity == NaN
10.true == 1

说出它们的输出结果
11.
var a = "123abc";
alert(typeof(a++));
alert(a);
12.
var a = "123abc";
a.valueOf = function(){return parseInt(a);}
alert(++a);
alert(a-0);

解析:

1.两个都是Number
2.False
3.true
4.false
5.123
6.NaN.这个略做说明.系统自己进行运算,调用的强制转换方法,是和Number()方法一样的.这个计算因为不是加法,所以先把非数字类型转换成数字类型.Number(“123abc”)的结果是NaN—(文中有提到),而NaN参与数学运算的结果还是NaN.
7.true
8.false .调用Number强制转换"abc"结果为NaN,NaN无大小,与任何数都没办法进行比较.
9.false
10.true .
11.
var a = "123abc";
alert(typeof(a++)); //Number
//调用a++的时候,这里++调用Number()方法强制转换,结果NaN,NaN进行后面的运算,全部还是NaN
alert(a); //NaN
12.
var a = "123abc";
a.valueOf = function(){return parseInt(a);}
alert(++a);//NaN
//调用++a的时候,这里++调用Number()方法强制转换,结果NaN,NaN进行后面的运算,全部还是NaN
alert(a-0);//NaN

String 对象与函数

JavaScript_String对象说明

string中文为"字符串"的意思，String继承自Object对象，此对象提供字符串的查找操作等函数

JavaScript字符串类型参见JavaScript字符串类型

String的内容是不可变的，下面介绍的String的函数都不能改变其内容(又复制了一份)

引用网址:http://www.dreamdu.com/javascript/object_string/

String对象构造函数

varstrobject=newString(str);varstr=String(str);

使用new操作符调用构造函数String(str)可以将参数str转换为一个字符串，并且返回包括这个字符串的String对象

不使用new操作符，直接调用String函数，将转换参数str为一个字符串，并返回这个值

varstr="drea mdu";

建立一个字符串最简单常用的方法

String函数与属性使用语法

string.方法名(参数1,参数2,...);string.属性;

string代表一个字符串，可以是str="字符串";这种方式定义的str，也可以直接是"字符串"

可以没有参数，比如toLowerCase()函数，或有多个参数，比如concat()函数

示例

varstr = "www.dreamdu.com";varlength = str.length;varstr = "www.dreamdu.com".toUpperCase();

JavaScript_String函数按功能分类

String查找类函数

• charAt() 函数 -- 返回指定位置(n)的字符
• charCodeAt() 函数 -- 返回指定位置(n)字符的Unicode编码
• indexOf() 函数 -- 返回substring在string中的位置
• lastIndexOf() 函数 -- 返回substring在string中最后匹配(出现)的位置

String操作类函数

• concat() 函数 -- 合并多个字符串，并返回合并的结果
• replace() 函数 -- 将字符串string中的oldStr1替换为newStr2
• slice() 函数 -- 返回被截取的字符串
• split() 函数 -- 将字符串分割为字符串数组，并返回此数组
• substr() 函数 -- 返回从string的startPos位置，长度为length的字符串
• substring() 函数 -- 返回从string的startPos位置，到endPos位置的字符串

String转换类函数

• fromCharCode() 函数 -- 返回多个Unicode代码组成的字符串

String比较类函数

• localeCompare() 函数 -- 使用本地规则比较字符串string与string2，并返回比较结果

String大小写转换函数

• toLocaleLowerCase() 函数 -- 返回本地小写字符串
• toLocaleUpperCase() 函数 -- 返回本地大写字符串
• toLowerCase() 函数 -- 返回小写字符串
• toUpperCase() 函数 -- 返回大写字符串

HTML标签类函数

• anchor() 函数 -- 返回HTML a 标签中name属性为str的锚
• big() 函数 -- 返回HTML big 标签定义的大字体
• blink() 函数 -- 返回使用HTML blink 标签定义的闪烁字符串
• bold() 函数 -- 返回使用HTML b 标签定义的粗体字符串
• fixed() 函数 -- 返回使用HTML tt 标签定义的单间距字符串
• fontcolor() 函数 -- 返回使用HTML font 标签中color属性定义的带有颜色的字符串
• fontsize() 函数 -- 返回使用HTML font 标签中size属性定义的指定尺寸的字符串
• italics() 函数 -- 返回使用HTML i 标签定义的斜体字符串
• link() 函数 -- 返回使用HTML a 标签定义的链接
• small() 函数 -- 返回使用HTML small 标签定义的小字体的字符串
• strike() 函数 -- 返回使用HTML strike 标签定义删除线样式的字符串
• sub() 函数 -- 返回使用HTML sub 标签定义的下标字符串
• sup() 函数 -- 返回使用HTML sup 标签定义的上标字符串

JavaScript_String函数按照字母排序

• anchor() 函数 -- 返回HTML a 标签中name属性为str的锚
• big() 函数 -- 返回HTML big 标签定义的大字体
• blink() 函数 -- 返回使用HTML blink 标签定义的闪烁字符串
• bold() 函数 -- 返回使用HTML b 标签定义的粗体字符串
• charAt() 函数 -- 返回指定位置(n)的字符
• charCodeAt() 函数 -- 返回指定位置(n)字符的Unicode编码
• concat() 函数 -- 合并多个字符串，并返回合并的结果
• fixed() 函数 -- 返回使用HTML tt 标签定义的单间距字符串
• fontcolor() 函数 -- 返回使用HTML font 标签中color属性定义的带有颜色的字符串
• fontsize() 函数 -- 返回使用HTML font 标签中size属性定义的指定尺寸的字符串
• fromCharCode() 函数 -- 返回多个Unicode代码组成的字符串
• indexOf() 函数 -- 返回substring在string中的位置
• italics() 函数 -- 返回使用HTML i 标签定义的斜体字符串
• lastIndexOf() 函数 -- 返回substring在string中最后匹配(出现)的位置
• link() 函数 -- 返回使用HTML a 标签定义的链接
• localeCompare() 函数 -- 使用本地规则比较字符串string与string2，并返回比较结果
• replace() 函数 -- 将字符串string中的oldStr1替换为newStr2
• slice() 函数 -- 返回被截取的字符串
• small() 函数 -- 返回使用HTML small 标签定义的小字体的字符串
• split() 函数 -- 将字符串分割为字符串数组，并返回此数组
• strike() 函数 -- 返回使用HTML strike 标签定义删除线样式的字符串
• String() 函数 -- String对象的构造函数
• sub() 函数 -- 返回使用HTML sub 标签定义的下标字符串
• substr() 函数 -- 返回从string的startPos位置，长度为length的字符串
• substring() 函数 -- 返回从string的startPos位置，到endPos位置的字符串
• sup() 函数 -- 返回使用HTML sup 标签定义的上标字符串
• toLocaleLowerCase() 函数 -- 返回本地小写字符串
• toLocaleUpperCase() 函数 -- 返回本地大写字符串
• toLowerCase() 函数 -- 返回小写字符串
• toUpperCase() 函数 -- 返回大写字符串

JavaScript转义符

转义序列字符\b退格\f走纸换页\n换行\r回车\t横向跳格 (Ctrl-I)\'单引号\"双引号\\反斜杠

JavaScript类型转换

方法主要有三种

转换函数、强制类型转换、利用js变量弱类型转换。

1. 转换函数

js提供了parseInt()和parseFloat()两个转换函数。前者把值转换成整数，后者把值转换成浮点数。只有对String类型调用这些方法，这两个函数才能正确运行；对其他类型返回的都是NaN(Not a Number)。

在判断字符串是否是数字值前，parseInt()和parseFloat()都会仔细分析该字符串。parseInt()方法首先查看位置0处的字符，判断它是否是个有效数字；如果不是，该方法将返回NaN，不再继续执行其他操作。但如果该字符是有效数字，该方法将查看位置1处的字符，进行同样的测试。这一过程将持续到发现非有效数字的字符为止，此时parseInt()将把该字符之前的字符串转换成数字。

例如，如果要把字符串 "1234blue "转换成整数，那么parseInt()将返回1234，因为当它检测到字符b时，就会停止检测过程。字符串中包含的数字字面量会被正确转换为数字，因此字符串 "0xA "会被正确转换为数字10。不过，字符串 "22.5 "将被转换成22，因为对于整数来说，小数点是无效字符。一些示例如下：

parseInt("1234blue");   //returns   1234 
parseInt("0xA");   //returns   10 
parseInt("22.5");   //returns   22 
parseInt("blue");   //returns   NaN

parseInt()方法还有基模式，可以把二进制、八进制、十六进制或其他任何进制的字符串转换成整数。基是由parseInt()方法的第二个参数指定的，所以要解析十六进制的值，需如下调用parseInt()方法： 
parseInt("AF",   16);   //returns   175 
当然，对二进制、八进制，甚至十进制（默认模式），都可以这样调用parseInt()方法： 
parseInt("10",   2);   //returns   2 
parseInt("10",   8);   //returns   8 
parseInt("10",   10);   //returns   10 
如果十进制数包含前导0，那么最好采用基数10，这样才不会意外地得到八进制的值。例如： 
parseInt("010");   //returns   8 
parseInt("010",   8);   //returns   8 
parseInt("010",   10);   //returns   10 
在这段代码中，两行代码都把字符串 "010 "解析成了一个数字。第一行代码把这个字符串看作八进制的值，解析它的方式与第二行代码（声明基数为8）相同。最后一行代码声明基数为10，所以iNum3最后等于10。

parseFloat()方法与parseInt()方法的处理方式相似，从位置0开始查看每个字符，直到找到第一个非有效的字符为止，然后把该字符之前的字符串转换成数字。不过，对于这个方法来说，第一个出现的小数点是有效字符。如果有两个小数点，第二个小数点将被看作无效的，parseFloat()方法会把这个小数点之前的字符串转换成数字。这意味着字符串 "22.34.5 "将被解析成22.34。 
使用parseFloat()方法的另一不同之处在于，字符串必须以十进制形式表示浮点数，而不能用八进制形式或十六进制形式。该
方法会忽略前导0，所以八进制数0908将被解析为908。对于十六进制数0xA，该方法将返回NaN，因为在浮点数中，x不是有效字符。此外，parseFloat()也没有基模式。

下面是使用parseFloat()方法的示例： 
parseFloat("1234blue");   //returns   1234.0 
parseFloat("0xA");   //returns   NaN 
parseFloat("22.5");   //returns   22.5 
parseFloat("22.34.5");   //returns   22.34 
parseFloat("0908");   //returns   908 
parseFloat("blue");   //returns   NaN

2. 强制类型转换

还可使用强制类型转换（type casting）处理转换值的类型。使用强制类型转换可以访问特定的值，即使它是另一种类型的。
ECMAScript中可用的3种强制类型转换如下： 
Boolean(value)——把给定的值转换成Boolean型； 
Number(value)——把给定的值转换成数字（可以是整数或浮点数）； 
String(value)——把给定的值转换成字符串。 
用这三个函数之一转换值，将创建一个新值，存放由原始值直接转换成的值。这会造成意想不到的后果。 
当要转换的值是至少有一个字符的字符串、非0数字或对象（下一节将讨论这一点）时，Boolean()函数将返回true。如果该值是空字符串、数字0、undefined或null，它将返回false。

可以用下面的代码段测试Boolean型的强制类型转换。

Boolean("");   //false   –   empty   string 
Boolean("hi");   //true   –   non-empty   string 
Boolean(100);   //true   –   non-zero   number 
Boolean(null);   //false   -   null 
Boolean(0);   //false   -   zero 
Boolean(new   Object());   //true   –   object

Number()的强制类型转换与parseInt()和parseFloat()方法的处理方式相似，只是它转换的是整个值，而不是部分值。还记得吗，parseInt()和parseFloat()方法只转换第一个无效字符之前的字符串，因此 "4.5.6 "将被转换为 "4.5 "。用Number()进行强制类型转换， "4.5.6 "将返回NaN，因为整个字符串值不能转换成数字。如果字符串值能被完整地转换，Number()将判断是调用parseInt()方法还是调用parseFloat()方法。下表说明了对不同的值调用Number()方法会发生的情况：

用　　法  结　　果 
Number(false)  0 
Number(true)  1 
Number(undefined) NaN 
Number(null)  0 
Number( "5.5 ")  5.5 
Number( "56 ")  56 
Number( "5.6.7 ") NaN 
Number(new   Object())  NaN 
Number(100)  100 

最后一种强制类型转换方法String()是最简单的，因为它可把任何值转换成字符串。要执行这种强制类型转换，只需要调用作为参数传递进来的值的toString()方法，即把1转换成   "1 "，把true转换成 "true "，把false转换成 "false "，依此类推。强制转换成字符串和调用toString()方法的唯一不同之处在于，对null或undefined值强制类型转换可以生成字符串而不引发错误：

var   s1   =   String(null);   //"null" 
var   oNull   =   null; 
var   s2   =   oNull.toString();   //won’t   work,   causes   an   error

3. 利用js变量弱类型转换

举个小例子，一看，就会明白了。
<script> 
var   str= '012.345 '; 
var   x   =   str-0; 
x   =   x*1;
</script>

上例利用了js的弱类型的特点，只进行了算术运算，实现了字符串到数字的类型转换，不过这个方法还是不推荐的。

javascript变量作用域

首先需要明白的几个要点：
1.JavaScript的变量作用域是基于其特有的作用域链的。
2.JavaScript没有块级作用域。
3.函数中声明的变量在整个函数中都有定义。（就后面第三点的说明）
4 .所有在最外层定义（非函数体内定义）的变量都拥有全局作用域
5. 所有末定义直接赋值的变量，系统会自动声明为拥有全局作用域的变量
6. 所有window对象的属性拥有全局作用域

1.JavaScript的作用域链

首先看一个很简单的例子，下面的代码中，定义一个全局变量n，n的作用域是全局的。

<script language="javascript" type="text/javascript">
var n=1;
function show(){
   var m=2;
   alert(n);   //显示结果为1
}
show();
</script>

运行代码后，结果为1。原理就是JavaScript作用域是层层包含的，外层的作用域在内层有效，执行的时候，从内层向外层查找。当函数show执行的时候，首先在函数show内部查找变量n，没有找到，再向外层查找，找到了全局变量n，alert显示结果为1。

2.局部变量优先级高于全局变量

<script language="javascript" type="text/javascript">
var n=1;
function show(){
   var m=2;
   var n=3;
   alert(n);   //显示结果为3
}
show();
</script>

这个不难理解，根据上面变量作用域链的原理，函数执行时，会先从内层向外层查找，如果在内层中找到变量，查找就会停止。所以内层的作用域会优先于外层，局部优先于全局。
稍改一下：

<script language="javascript" type="text/javascript">
var n=1;
function show(){
   var m=2;
   var n=3;
   alert(window.n);   //显示结果为1
}
show();
</script>
为什么会是1，而不是3呢，只是另外一个问题：全局变量都是window对象的属性，任何的全局变量都是window对象的属性，都可以用window.*来引用。(*代表一个变量)

3.在函数内部使用var声明的变量，不论在何处声明，该变量都拥有整个函数的作用域。

<script language="javascript" type="text/javascript">
var n=1;
function show(){
   alert(n);   //undefined
   alert(this.n); //显示为1
   var n=3;   //声明局部变量n
   alert(n);   //显示为3
}
show();
</script>

第一个问什么会显示undefined呢，这个问题的原因就是在函数后面声明了局部变量n=3，在函数show执行的时候，会先从内层查找变量n，结果找到了，但在第一个alert的时候，n还没有赋值，故结果为undefined。

4.JavaScript没有块级作用域

<script language="javascript" type="text/javascript">
var n=1;
function show(){
   for(var i=0;i<3;i++){
     var n=6;
     alert(i);   //显示结果为0,1,2
   }
   alert("for循环外："+i); //显示结果为：“for循环外：3”
   alert("n="+n);   //显示结果为：n=6
}
//alert(i);   外部引用一个未声明变量会提示出错
show();
</script>

变量i虽然是在for循环内定义的，但for循环块外部仍然可以引用，i的作用域是整个函数show。如果在show函数外部引用i变量，会出现JavaScript报错。

5.没有使用var声明的变量属于全局变量

<script language="javascript" type="text/javascript">
var n=1;
function show(){
   m=9;   //声明变量m
   var s=6;
}
show();   //不可少，alert之前需要先执行m=9，否则m未声明
alert(m);   //显示9
alert(window.m);   //显示9
alert(s);   //报错"s is not defined"
</script>

函数show执行的过程中，引用了变量m，但未使用var声明，m就变成了全局变量。

尽管在全局作用域编写代码是可以不写var语句，但是声明局部变量时必须使用var语句，如果不使用，会改变同名的全局作用域的值。