JavaScript基础知识

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.onload=function()

{

var oTxt1=document.getElementById('txt1');

var oTxt2=document.getElementById('txt2');

var oBtn1=document.getElementById('btn1');

oBtn1.onclick=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.onload=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]);

}

猜你喜欢

转载自616306932.iteye.com/blog/2330756