上节课给大家展现了很多实例,这节我们正式接触基础知识
JavaScript组成
ECMAScript是js解释器,负责翻译给计算机互相沟通
DOM:DocumentObjectModel文档对象模型,我们之前查找元素就是用的document,其实就是html文档,关于对象和模型我们后面会讲解
BOM:BrowserObjectModel浏览器对象膜,我们操作浏览器相关的操作,window是其相关的
兼容性问题
ECMAScript为核心部分,功能比较简单,几乎没有兼容性问题
DOM有一些操作不兼容
BOM没有兼容性(完全不兼容)
变量类型
为了看类型,我们先看下面的代码
其中,a为数字类型number,b为字符串string,c为布尔类型boolean,d是函数类型,我们定义函数,那其就是此类型,e我们赋值document,其默认的就是object对象类型,我们没定义aa,其类型就是undefined,还有我们定义变量f,但是没赋值,其类型也是undefined
这里我们使用typeof 变量名 获得变量的类型,也可以使用typeof(变量名)
变量类型转换
比如说我们在2个input表输入数字,然后点击按钮,弹出求和,如果我们只是讲2个input签的value相加,那结果只能是字符串拼接,我们就需要将其转换为数字
如上图,我们就通过parseInt(x)将字符串x内容转换成整数
我们就继续分析下parseInt()
我们尝试给内部传入'12xxdas'字符串,发现返回12,这是为什么呢,parseInt()会从左到右,直到遇到非数字部分,将左侧数字部分返回
我们又干脆不给写数字,直接传入字符串,则返回的是NaN,这是Js的Not a Number的缩写,提示不是一个数字
我们之前的加法如果一个输入数字,另一个输入使内容NaN的纯字母字符串,则结果还是NaN,即数字和NaN计算还是NaN
JS里NaN有个特性,就是NaN之间不相等,如上图会提示false
JS里如何判断其为NaN呢,我们可以使用isNaN(变量)
这里用了或逻辑||,我们判断有一个isNaN()为true,就提示错误,
我们入过parseInt('3.5')就会返回3,如果我们想得到小数,就需要他的兄弟parseFloat();
我们使用parseInt,parseFloat都是强制类型转换,也叫显式转换
还有一种就是隐式转换(偷偷的给变了类型)
我们看到a是数字5,b是字符串‘5’,a==b结果是true,这里==两侧被默认转换成相同类型比较
我们改用===三个等号,会发现结果是false,三个等号的作用是不转换类型直接比较
又一个例子如上,我们定义字符串a,b分别为数字字符串,加法当然是拼接了,但是减法呢,结果却是得到12-5的7,这就是做了隐式转换,同理还有乘除法,这里的解释是+可以是拼接也可以是数字加法,因为后者要转换,所以选择最简单的拼接,而其他的就是给数字用的,所以要转换类型
变量作用域
我们尝试执行这个代码,会发现网页报错,提示a没有定义,这是因为a定义在函数aaa内部,是个局部变量,只能在定义他的函数里使用
我们把var定义的地方换个位置,就会发现可以提示12,这是因为定义了全局变量
闭包
当我们把函数定义到另一个函数内部,就实现了闭包(子函数可以使用父函数的局部变量),这种情况把aaa叫父函数,bbb叫子函数
JS命名规范
可读性,别人能见名知意
规范性,可以使用前缀+首字母大写的拼接(匈牙利命名法),前缀可以使我们一看就知道其类型
前缀表如上
运算符
+-*/%加减乘除取模(/除法得到的是小数)
取模%可以用于隔行变色,
像秒数转换成xx分xx秒等等等,
!=和!==的关系就和==与===的关系一样,我们前者隐式转换都不等则不等,后者类型不等也不行
&&,||,!与或非js逻辑运算(前2个是双字符)
流程控制
首先我们讲if,之前也说过if else,这里提下更高级的写法
if(条件){}else if{条件}else{}这种结构,python也见过类似的,没啥说的
switch语句,对于多值情况
switch(变量名){
值1:
语句1;
break;
值2:
语句1;
break;
default:
语句n;
}
每个条件下,break不能缺省,default是都不满足进的地方
三元运算符 条件?语句1:语句2;如果条件满足执行语句1,否则执行语句2
根据变量a奇偶数提示如上
循环中break是结束最近的一层循环,continue则是结束当次循环,继续下次循环
JS的‘真’和‘假’
js里用于逻辑判断
非0数字,非空对象和true同等地位,
0和false,空对象,空字符串,null(空对象),undefined一样
JSON
var json={};符号是花括号,里面是用键值对的方式存储,我们访问元素可以用json.键名或json[键名]访问值,也可以通过访问的对象修改值,
arr=[1,2,3,4]这样的数组也能存储多值,我们可以用数字索引来访问,而json格式是用字符串访问,
json没有length属性(不能通过长度遍历)
关于遍历我们之前访问数组是用for循环,i和arr.length设置条件,其实我们还可以这么写
for(each in arr){
alert(each);
};
当然我们json也可以用for in的方法,每个遍历的是json的键值,