JavaScript基础
JS组成
-ECMAScript:解释器、翻译
-DOM:Document Object Model
-BOM:Browser Object Model
-各组成部分的兼容性,兼容性问题由来
变量类型
type of运算符
-用法:返回值
一个变量应该只存放一种类型的数据
数据类型转换
-例子:计算两个文本框的和
-显示类型转换(强制类型转换)
-parseInt()、parseInt()
-NaN的意义和检测
-隐形类型转换
-==、===
-减法
变量作用域和闭包
-变量的作用域
-局部变量,全局变量
-什么是闭包
-子函数可以使用父函数中的局部变量
-之前一直在使用闭包
-网上对于闭包的定义
命名规范
运算符
程序流程控制语句
Json
-什么是Json
-Json和数组
-Json和for in
-------------------------------------------------------------------------------------------------------------------------------
一、JavaScript组成
-ECMAScript:解释器、翻译
把人类语言翻译给计算机,将计算机语言翻译给我们
解释器
只提供了最基础的功能,计算器
-DOM:Document Object Model
文档、对象、模型 HTML document
赋予JS操作HTML的能力
操作HTML的入口
-BOM:Browser Object Model
浏览器对象模型 window
具有操作浏览器本身 与浏览器打交道的操作
各组成部分的兼容性,兼容性问题的由来
ECMA 几乎没有兼容性问题
DOM 有一些操作不兼容
BOM 没有兼容问题(完全不兼容)
----------------------------------------------------------------------------------------------------------------------------
二、变量类型(1)
type of
小例子
a=12;
alert(type of a);//number
a='abc';
alert(type of a);//string
a=true;
alert(type of a);//boolean
a=function()
{
alert(type of a);//function
}
a=document;
alert(type of a);//object(对象)
alert(type of b);//undefined
var b;
alert(type of b);//underfined
类型转换
parseInt()
遇到非数字的字符就跳出去 没有数字的情况下 显示NaN 非数字的意思
NaN与NaN并不相等 会弹出false
isNaN()函数用于判断是否为NaN
例子代码:
<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
<title>类型转换</title>
<script>
window.οnlοad=function()
{
var oTxt1=document.getElementById('txt1');
var oTxt2=document.getElementById('txt2');
var oBtn1=document.getElementById('btn1');
oBtn1.οnclick=function()
{
var n1=parseInt(oTxt1.value);
var n2=parseInt(oTxt2.value);
if(isNaN(n1))
{
alert('您输入的第一个数字有误');
}
else if(isNaN(n2))
{
alert('您输入的第二个数字有误');
}
else{
alert(n1+n2);
}
}
}
</script>
</head>
<body>
<input id="txt1" type="text" />
<input id="txt2" type="text" />
<input id="btn1" type="button" />
</body>
</html>
隐式转换
var a=5;
var b='5';
alert(a==b); //弹出true 先转换类型,然后比较
alert(a===b); //弹出false 不转换类型,直接比较
var a='12';
var b='5';
alert(a+b); //125 加号的功能 1.字符串连接 2.数字相加 所以不转换
alert(a-b); //7 自动转换
----------------------------------------------------------------------------------------------------------------------------------
变量的作用域(作用范围)
闭包
function aaa() //父函数
{
var a=12;
function bbb() //子函数
{
alert(a);
}
}
子函数可以使用父函数的局部变量
-------------------------------------------------------------------------------------------------------------------------------
命名规范
可读性
规范性
匈牙利命名法
类型前缀 oTxt 哦
首字母大写
--------------------------------------------------------------------------------------------------------------------------------
运算符
例子 隔行变色
window.οnlοad=function()
{
var aLi=document.getElementsByTagName('li');
for(var i=0;i<aLi.length;i++)
{
if(i%2==0)
{
aLi[i].style.background='#CCC';
}
else
{
aLi[i].style.background='';
}
}
}
.
.
.
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
?:
条件?:语句1:语句2;
类似于if else
----------------------------------------------------------------------------------------------------------------------------------
Json
用来存数据的
<script>
var a=12;
var b=5;
var c='abc';
var json={a: 12, b: 5, c: 'abc'};
alert(json.b); //5
json.b++;
alert(json.b); //6
Json与数组的区别
var json={a: 12, b: 5, c: 'abc'};
var arr={12, 5, 7};
json的下标是字符串 而数组的下标是数字
alert(json.length); //undefined 没有长度
数组的两种循环
第二种
for(var i in arr)
{
语句;
}
同样适用于Json
for(var i in json)
{
alert('第'+i+'个东西:'+json[i]);
}