JavaScript练习(寒假计划)

# JavaScript练习(Winter vacation plan 1)

数据类型：

1. Number 数字类型: 没有区分浮点数与整数、浮点数不精确 运算时需要小心使用.

var num1=10;
var num2=10.00;
alert(num1 === num2)          //系统将提示true
console.log(1-0.332)          //计算为0.6679999999

2. String 字符串类型: " " , ’ ’ , input的内容.

var html_template2='
螺钉课堂
'      //正确!! 为了避免误读则将中间''换成""
// var html_template1='
螺钉课堂
'  错误!! color左右用''时会造成计算机将对第二个'读成与第一个同一对
		    
document.body.innerHTML = html_template2
var url = 'nodeing.com'                                                //定义变量,可随时变动
var html_template3='
螺钉课堂'+url+'
'
			    //采用 + 连接有利于变量的变动
			    
document.body.innerHTML = html_template3
alert(html_template3.length)                                  //.length可以计算字符串长度
var str_null1 = '';                                           //,空字符串长度为0
console.log(str_null.length)
var str_null2 = '    ';                                       //4个空格占4个字符
console.log(str_null2.length)

上例代码的变量连接为下:

3. Boolean 布尔类型:只有true和false两个值(真假 开关 是否).

var obtn01=document.getElementById("btn01")
var obox01=document.getElementById("box01")
			//定义一个开关 控制显隐     当为true时显示,为false时隐藏
var flag=true
			//绑定事件:
obtn01.onclick=function(){
     
				//通过按钮显示和隐藏box     
		if(flag==true){
     
			obox01.style.display="block"    //显示
		}
		if(flag==false){
     
			obox01.style.display="none"      //隐藏
		}
	flag=!flag           //  !表示值取反 当第一次点击时flag为true经过if后取反为false在此循环
				

下为上例运行结果:
点击开关前:

点击开关后:

5. Null 空 没有对象,此处无值.
6. undefined 未定义 此处有值只是未给

null用 typeof打印出是object

---

强制类型转换 ：

1. 转换成数字类型:
   a. parseInt 转换成整数 将字符串类型string"123.456"转成数字类型number"123".
   b. parseFloat 转换成浮点数类型 .
   
   (两个parse 当遇到非数字字符就停止转换,后面的字符全部丢弃. 当一个字符也没转换则输出NAN)

   c. 直接用Number转换,但是必须确保定义字符内全为数字字符…否则输出为NAN.

console.log("a + 13")
			//转成数字类型的方法:
var str01="123.456"
console.log(typeof str01)            //typeof指出数据类型
var num01=parseInt(str01)            //1. parseInt  转换成整数   将字符串类型string"123.456"转成数字类型number"123"
console.log(num01,typeof num01)
			// alert(num01)
var num02=parseFloat(str01)          //2. parseFloat  转换成浮点数类型  
console.log(num02,typeof num02)    
			// alert(num02)
			                                           /*两个parse  当遇到非数字字符就停止转换,后面的字符全部丢弃. 当一个字符也没转换则输出NAN*/
var num03=Number(str01)
console.log(num03,typeof num03)       //3. 直接用Number转换,但是必须确保定义字符内全为数字字符..否则输出为NAN

运行结果为:

2. 转换为字符串类型: 直接用String转换,与Number类似.

var num04=123
var str02=String(num04)                   
console.log(str02,typeof str02)       // 直接用String转换,与Number类似

运行结果为:

3. 转换为布尔类型: 直接用Boolean转换.

var num05=123456
var bool01=Boolean(num05)
console.log(bool01,typeof bool01)      // 直接用Boolean转换  当定义为0和空字符串 null undefined NAN时为false,其余皆为true
var num06=0
var bool02=Boolean(num06)
console.log(bool02,typeof bool02)   
var str03=""                              //记得字符串加""
var str04=null
var str05=undefined
var str06=NaN
var bool03=Boolean(str03)
var bool04=Boolean(str04)
var bool05=Boolean(str05)
var bool06=Boolean(str06)
console.log(bool03,bool04,bool05,bool06,typeof bool06)

运行结果为:

(记 !: 当定义为0和空字符串 null undefined NAN时为false,其余皆为true.)

---

自动类型转换：

注意记住使BOOl值输出为false的值

var num07 = 10  //数字类型
var str07 = "5" //字符串类型
var num08 = 0
			
console.log(num07 - str07)          //自动将str07转换为数字类型      输出5
console.log(num07 + str07)          //自动将num07转换为字符串类型    输出105
if(num07){
                               //自动将num07转换为布尔类型      输出为true
	console.log(num07)
}
if(num08){
                                //自动将num08转换为布尔类型      输出false则不执行
	console.log(num08)
}
			/*!!需记住转换为false的值*/

运行结果为:

自加自减 三目运算：

下列为自加自减的相关示例:

var num09 = 1;             //自加
num09++
console.log(num09)
++num09
console.log(num09)                   //num09++ 与++num09运算结果相同 在原值上加1
			
var num10 = 10;            //自减
num10--
console.log(num10)
--num10
console.log(num10)                    //num10-- 与--num10运算结果相同 在原值上减1
			
// ---------------------------------------------------------------------------------------
			//自加自减存在顺序问题!!
var a04 = 1;
var b04 = a04     
a04 = b04++;                             //a04=1,b04=2       先将b04赋给a04后b04再+1
b04 = a04++;                             //a04=2,b04=1       先将a04赋给b04后a04再+1
a04 = ++b04;                             //a04=2,b04=2       先b04+1后再将b04赋给a04
// alert(a04)
// alert(b04)
console.log(a04,b04)

该示例运行结果为:

总结 : 当++在变量后先赋值再自加, 当++在变量前先自加再赋值.

三目运算结构: 表达式1? 语句1: 语句2

var num11 = prompt("分数")
if(num11 >= 60){
     
	alert("及格")
}else{
     
	alert("不及格")
}
// 等同于==>>
			
			num11 >= 60? alert("及格"):alert("不及格")    //if else 简写!!!当num11>=60为true时执行: 前的命令,当num11<60位false执行: 后的命令

该示例运行结果为: