javascript 基础篇 随课笔记
!DOCTYPE HTML>
<html>
<head>
<meta name="content-type" content="text/html; charset=utf-8">
<title> 基础视频 </title>
<script type="text/javascript" language="javascript">
window.onload=function()
{
var oTxt1=document.getElementByID('txt1');
var oTxt2=document.getElementByID('txt2');
var oBtn=document.getElementByID('btn1');
oBtn.onclick=function()
{
alert(parseInt(oTxt1.value)+parseInt(oTxt2.value));
}
}
var a=12;
alert(typeof a);
</script>
</head>
<body>
我们是好朋友
<input id="txt1" type="text" />
<input id="txt2" type="text" />
<input id="btn1" type="button" value="求和" />
</body>
</html>
居然调试不过。专心找问题ING。。。。
1.javascript的组成部分
- ECMAscript----主要用来浏览器解析,例如,定义一个变量,函数----浏览器几乎都兼容
- BOM(browser object model)----浏览器对象模型,针对浏览器的操作,例如弹出窗口,移动浏览器的位置,打印等等----几乎不兼容,不过用的也比较少。
- DOM(document object model)----文档对象模型,操作页面的功能,例如获取文档的div,class,添加元素等----大部分都兼容
2.变量类型
- number
- string
- boolean
- object
- function
- undefined
- 建议:一个变量只存储一个类型的数据
3.对象(js里一切都是对象)
基本类型:number,string,boolean,undefined他们都很单纯,都简简单单的(这些不是对象)
复合类型:object,数组array,日期对象date,复合类型由一些基本类型复合而成,包括了一些杂七杂八的东西。
4.数据类型转换----显示转换/隐式转换
1 <script> 2 window.onload=function () 3 { 4 var oTxt1=document.getElementById('txt1'); 5 var oTxt2=document.getElementById('txt2'); 6 var oBtn=document.getElementById('btn1'); 7 8 oBtn.onclick=function () 9 { 10 alert(parseInt(oTxt1.value)+parseInt(oTxt2.value)); 11 }; 12 }; 13 </script> 14 </head> 15 16 <body> 17 <input id="txt1" type="text" /> 18 <input id="txt2" type="text" /> 19 <input id="btn1" type="button" value="求和" /> 20 </body>
优化后,如果输入的不是数值,会提示。
1 <script> 2 window.onload=function () 3 { 4 var oTxt1=document.getElementById('txt1'); 5 var oTxt2=document.getElementById('txt2'); 6 var oBtn=document.getElementById('btn1'); 7 8 oBtn.onclick=function () 9 { 10 var num=parseInt(oTxt1.value)+parseInt(oTxt2.value); 11 12 if(isNaN(num)) 13 { 14 alert('您输入的有误'); 15 } 16 else 17 { 18 alert(num); 19 } 20 }; 21 }; 22 </script>
如果在文本框输入不同的两个数字,例如2和3,那么按钮的单击事件会弹出23,而不是5,因为文本框里面的东西默认的就是字符串而不是数值型的数据。这里使用parseInt函数可以转化字符串的类型。
1 <script> 2 var a='13ab'; 3 alert(parseInt(a)); 4 </script>
准确的说,parseInt函数是提取前面的数字,如果遇到字符串就不会继续往后面去值了。
1 <script> 2 var a='ab'; 3 alert(parseInt(a)); 4 </script>
如果是这样的话,会出现NaN (not a number),也就是不是一个数字的意思。
1 <script> 2 var a='12.6'; 3 alert(parseInt(a)); 4 </script>
如果是这样的话,会弹出12这个数字,后面的小数点直接省略了。
1 <script> 2 var a='12.6'; 3 alert(parseFloat(a)); 4 </script>
parseInt的兄弟parseFloat函数。
NaN(这是个神奇的东西,他和自己也不相等,可能在某种程度上有区别吧)
JavaScript 以 NaN 的形式输出 Number.NaN。请注意,NaN 与其他数值进行比较的结果总是不相等的,包括它自身在内。因此,不能与 Number.NaN 比较来检测一个值是不是数字,而只能调用 isNaN() 来比较。
1 <script> 2 var a=parseInt('ab'); 3 var b=parseInt('ab'); 4 alert(a==b); 5 </script>
1 <script> 2 var a=parseInt('ab'); 3 var b=parseInt('ab'); 4 alert(a==b); 5 </script>
这两个的结果都是flase.以上都是属于显示转换。
隐式转换:
1 <script> 2 var a='2'; 3 var b=2; 4 alert(a==b); 5 </script>
运行结果是true。这就是一个隐式转换的例子,他会把两边的数据类型进行比较然后相加。
1 <script> 2 var a='2'; 3 var b='2'; 4 alert(a-b); 5 </script>
如果是减号那么结果是0,如果是加号结果就是22;你懂得应该。只有加法不能转化,乘除减法都可以。
关于===
全等就是不仅要内容相等,而且类型也要相等。
5.变量作用域
- 全局变量---是魔鬼==!
全局变量的存在主要有以下一些原因:
1,使用全局变量会占用更多的内存(因为其生命期长),不过在计算机配置很高的今天,这个不成为什么问题,除非使用的是巨大对象的全局变量,能避免就一定要避免。
2,使用全局变量程序运行时速度更快一些(因为内存不需要再分配),同样现在也快不了多少。
3,对于局部变量的名字空间污染,这个在不使用太多变量时是可以避免的。
4,当全局变量与局部变量重名的时候,起作用的是局部变量,全局变量被屏蔽掉。
总之,全局变量可以使用,但是全局变量使用时应注意的是尽可能使其名字易于理解,而且不能太短,避免名字空间的污染;避免使用巨大对象的全局变量。(这一段摘自百度百科)
- 局部变量---闭包
这里比较好理解就不解释了。闭包的知识细节还有很多,今天先到这吧,洗澡睡觉,晚安~
1 <script> 2 function aa(){ //父函数 3 var a=1; 4 function bb(){ //子函数,可以啃老。 5 alert(a); 6 }; 7 bb(); 8 }; 9 aa(); 10 </script>
- ECMAscript----主要用来浏览器解析,例如,定义一个变量,函数----浏览器几乎都兼容
- BOM(browser object model)----浏览器对象模型,针对浏览器的操作,例如弹出窗口,移动浏览器的位置,打印等等----几乎不兼容,不过用的也比较少。
- DOM(document object model)----文档对象模型,操作页面的功能,例如获取文档的div,class,添加元素等----大部分都兼容
2.变量类型
- number
- string
- boolean
- object
- function
- undefined
- 建议:一个变量只存储一个类型的数据
3.对象(js里一切都是对象)
基本类型:number,string,boolean,undefined他们都很单纯,都简简单单的(这些不是对象)
复合类型:object,数组array,日期对象date,复合类型由一些基本类型复合而成,包括了一些杂七杂八的东西。
4.数据类型转换----显示转换/隐式转换
1 <script> 2 window.onload=function () 3 { 4 var oTxt1=document.getElementById('txt1'); 5 var oTxt2=document.getElementById('txt2'); 6 var oBtn=document.getElementById('btn1'); 7 8 oBtn.onclick=function () 9 { 10 alert(parseInt(oTxt1.value)+parseInt(oTxt2.value)); 11 }; 12 }; 13 </script> 14 </head> 15 16 <body> 17 <input id="txt1" type="text" /> 18 <input id="txt2" type="text" /> 19 <input id="btn1" type="button" value="求和" /> 20 </body>
优化后,如果输入的不是数值,会提示。
1 <script> 2 window.onload=function () 3 { 4 var oTxt1=document.getElementById('txt1'); 5 var oTxt2=document.getElementById('txt2'); 6 var oBtn=document.getElementById('btn1'); 7 8 oBtn.onclick=function () 9 { 10 var num=parseInt(oTxt1.value)+parseInt(oTxt2.value); 11 12 if(isNaN(num)) 13 { 14 alert('您输入的有误'); 15 } 16 else 17 { 18 alert(num); 19 } 20 }; 21 }; 22 </script>
如果在文本框输入不同的两个数字,例如2和3,那么按钮的单击事件会弹出23,而不是5,因为文本框里面的东西默认的就是字符串而不是数值型的数据。这里使用parseInt函数可以转化字符串的类型。
1 <script> 2 var a='13ab'; 3 alert(parseInt(a)); 4 </script>
准确的说,parseInt函数是提取前面的数字,如果遇到字符串就不会继续往后面去值了。
1 <script> 2 var a='ab'; 3 alert(parseInt(a)); 4 </script>
如果是这样的话,会出现NaN (not a number),也就是不是一个数字的意思。
1 <script> 2 var a='12.6'; 3 alert(parseInt(a)); 4 </script>
如果是这样的话,会弹出12这个数字,后面的小数点直接省略了。
1 <script> 2 var a='12.6'; 3 alert(parseFloat(a)); 4 </script>
parseInt的兄弟parseFloat函数。
NaN(这是个神奇的东西,他和自己也不相等,可能在某种程度上有区别吧)
JavaScript 以 NaN 的形式输出 Number.NaN。请注意,NaN 与其他数值进行比较的结果总是不相等的,包括它自身在内。因此,不能与 Number.NaN 比较来检测一个值是不是数字,而只能调用 isNaN() 来比较。
1 <script> 2 var a=parseInt('ab'); 3 var b=parseInt('ab'); 4 alert(a==b); 5 </script>
1 <script> 2 var a=parseInt('ab'); 3 var b=parseInt('ab'); 4 alert(a==b); 5 </script>
这两个的结果都是flase.以上都是属于显示转换。
隐式转换:
1 <script> 2 var a='2'; 3 var b=2; 4 alert(a==b); 5 </script>
运行结果是true。这就是一个隐式转换的例子,他会把两边的数据类型进行比较然后相加。
1 <script> 2 var a='2'; 3 var b='2'; 4 alert(a-b); 5 </script>
如果是减号那么结果是0,如果是加号结果就是22;你懂得应该。只有加法不能转化,乘除减法都可以。
关于===
全等就是不仅要内容相等,而且类型也要相等。
5.变量作用域
- 全局变量---是魔鬼==!
全局变量的存在主要有以下一些原因:
1,使用全局变量会占用更多的内存(因为其生命期长),不过在计算机配置很高的今天,这个不成为什么问题,除非使用的是巨大对象的全局变量,能避免就一定要避免。
2,使用全局变量程序运行时速度更快一些(因为内存不需要再分配),同样现在也快不了多少。
3,对于局部变量的名字空间污染,这个在不使用太多变量时是可以避免的。
4,当全局变量与局部变量重名的时候,起作用的是局部变量,全局变量被屏蔽掉。
总之,全局变量可以使用,但是全局变量使用时应注意的是尽可能使其名字易于理解,而且不能太短,避免名字空间的污染;避免使用巨大对象的全局变量。(这一段摘自百度百科)
- 局部变量---闭包
这里比较好理解就不解释了。闭包的知识细节还有很多,今天先到这吧,洗澡睡觉,晚安~
1 <script> 2 function aa(){ //父函数 3 var a=1; 4 function bb(){ //子函数,可以啃老。 5 alert(a); 6 }; 7 bb(); 8 }; 9 aa(); 10 </script>