1)html、css没有逻辑性
2)javascript基础
概念: 客户端脚本语言
运行在客户端浏览器中的,每一个浏览器都有javascript的解析引擎;
脚本语言: 不需要编译,直接就可以被浏览器解析执行;
功能:
html: 页面展示.
css: 页面控制和样式布局.
js: 可以增强用户和html页面的交互过程,可以来控制html元素,让页面有一些动态效果,增强用户体验.
3)js发展历程:
发展历程很心酸;
上网很慢;
BBS论坛-->注册信息-->浏览器表单信息 发送给服务器端进行验证:
一些信息忘记填了,点击提交后,很慢;
于是人们想设计出来一种语言: 在浏览器中运行,不需要和服务器交互,就可以控制html元素,
格式正确,完整-->发送给服务器;
1992年: Nombase,开发第一门客户端脚本语言,用于表单的校验,叫: C--,大家并没有接收它;
1995年: Netscape(网景),借鉴了c--的思想,开发了一门客户端脚本语言: LiveScript;
sun开发了java,垃圾回收,一处编译到处运行,垃圾回收等;
于是网景请来了sun的专家,在LiveScript上进行了修改,命名为: JavaScript,
想借助Java语言火起来,语言相似;
1996年: 微软推出了IE浏览器,抄袭了JavaScript,开发出JScript, IE也火了;
Nombase就改名为了:ScriptEase,也火起来了;
问题来了,三足鼎立,市场乱了;
1997: ECMA(欧洲计算机制作商协会),出来了一个组织,要制作出来标准ECMAScript,就是所有客户端
脚本语言的规范;
4)javascript = ECMAScript + Javascript自己特有的东西(BOM+DOM):
2类对象,并不是ECMA定义的;
5)js的组成
(1)ECMAScript: 客户端脚本语言的标准
2.基本语法:
1.与html的2种结合方式
1.内部的js:
head里面定义script标签;
script标签可以定义在任意位置;
2.外部的js
<script src="xxx">
注意: 但是放的位置会影响执行顺序, alert是阻塞的;
因此在js中获取元素对象时,注意是否能获取到;
<script标签可以定义多个;
2.注释
单行: // xxx
多行: /*
xxx
*/
java中还有个文档注释,js没有;
3.数据类型
js: 原始数据类型(基本数据类型) + 引用数据类型(对象: 基本对象 + BOM对象 + DOM对象)
原始数据类型: 5种
number:数字 整数/小数/Nan(not a number 一个不是数字的数字类型)
typeof(NaN)得到的是number
string:字符串 字符串(js中其实并没有字符, 单引和双引号都是字符串)
boolean: true和false
null: 一个对象为空的占位符 var obj = null; 但是typeof出来的却是 object
undefined: 从null演变过来,表示未定义. 一个变量没有给初始化值,则会被默认赋值为undefined.
var xxx;
范围: 比java的4类8种广泛一点.
但是我们不需要知道类型还是能用好js
java: 基本数据类型 + 对象数据类型
基本数据类型: 4类8种
4.变量
什么是变量?
变量是一小块存储数据的内存空间;
int a = 3; 申请了一块内存区域,放的3,这块内存区域的名字通过a可以找到;
java类型是强类型的语言,开辟变量存储空间时,只能存储固定类型的数据;
js是弱类型的语言,在开辟变量存储空间时,不需要规定类型;
语法:
var 变量名 = 初始化值;
输出到页面上:
document.write(xxx + "<br>")
我怎么知道它是number,是字符串等呢? 这需要我们学习一个运算符typeof;
由于js是弱类型语言,那么我们知道一个变量是什么类型的;
5.运算符
1.一元运算符
++ -- +(正号)
注意: 如果运算数不是运算符锁要求的类型,那么js引擎会自动的将运算数进行类型转换.
string转number: 按照字面值转换. 如果字面值不是数字,则转为NaN(不是数字的数字), NaN+1还是NaN
boolean转number: true转为1, false转为0
var b = +("123");
alert(b+1); // 124
null和undefined转数字没啥意义,得到的也是NaN
2.算数运算符
+ - * / %
3.赋值运算符
= += -=
4.比较运算符
> < >= <= == ===(全等于)
字符串: 按照字典顺序比较
java: 类型不同不能比较
js: 类型不同,则先进行转换再比较:
"123" == 123 true
===: 全等于
在比较之前,先判断类型,如果类型不一样,则直接返回false
5.逻辑运算符
&&: 与(短路)
||: 或(短路)
!
其它类型转boolean:
number: 0或NaN为假,其它为真
string: 除了空字符串, 其它都是true
null 和 undefined: 都是false
对象: 所有对象都为true
使用: if逻辑判断,防止空指针逻辑
注意: !3
!!flag --> 得到转换后的boolean值
6.三元运算符
? : 表达式
语法:
表达式 ? 值1 : 值2;
6.流程控制语句
if else
switch:
java能接受的参数类型: byte int short char 枚举(1.5) String(1.7);
js中: 什么类型都可以接收;
while
do while
for
7.js中的特殊语法:
(1)如果一行只有一条语句,js可以写可以不写分号(但是建议写);
要么是分号. 要么是回车换行符;
(2)全局变量
空格
(2)js对象:
Function:
方法、函数对象
1.创建:
var fun = new Function(形式参数列表,方法体)
2.方法:
3.属性:
4.特点:
5.调用:
方法名称(实际参数列表)
注意: 函数.length就可以得到参数个数,证明是函数对象;
js中函数的调用只与方法的名称有关,和参数列表无关.
方法里面隐含的内置对象 arguments 接收了所有参数.
java: 方法和函数是对象的一部分;
js: 函数就是一个对象;
*Array
1.创建
Array(xx):
xx只有1个元素代表数组的长度.
xx是多个则代表创建了数组,并且插入了元素.
元素个数可变;
数组越界后,打印的是undefined
a[10] = 'xxx'; a.length将变为11
2.方法
join(''): 将数组中的元素按照指定的分隔符拼接为字符串.
push(xx): 往数组中尾巴处,添加元素.
3.属性
4.特点
Boolean
*Date
创建: var date = new Date();
方法:
toLocalString():
getTime(): 1970~现在的毫秒值
*Math
创建: Math对象不用创建,直接使用. Math.方法名()
方法:
random: [0,1)
ceil: 向上取整 天花板的意思
floor: 向下取整
round: 4舍5入的整数
案例: [1, 100]的整数
Math.floor(Math.random() * 100) + 1
Number
String
*RegExp (表单校验依赖于正则表达式)
正则表达式: 定义字符串的组成规则.
如何定义正则表达式?
1.单个字符 []
如[a] a
[ab] a或者b
[a-z] a~z的任意字符
[a-zA-Z0-9] a~z A~Z 0~9 这个集合中的任意一个字符
2. 由于方法1表达的过于麻烦,因此出现了下面的,一下子能表示多个
\d 单个数字字符 [0-9]
\w 单个单词字符, 等价于[a-zA-Z0-9_]
3.量词符号
? 表示出现0次或1次
* 表示出现0次或多次
+ 出现1次或多次
举例: \w* --> 单词字符组成,出现1次或0次
4.由于方法3量词符号有点范,因此有了具体的符号.
{m,n} 表示 m<= 数量 <= n
{,n} 表示 最多n次
{m,} 表示 最少m次
举例: \w{6,12} -->单词字符出现6~12次
正则表达式对象:
创建的2种方式:
var reg = new RegExp("正则表达式");
var reg = /正则表达式/;
方法:
test(参数): 验证指定的字符串是否符合正则定义的规范
开始结束符号:
^ 开始
$ 结束
如: /^\w{6,12}$/; -->单词字符开头 单词字符结尾
\\: 由于第一种方式, 转义符号的原因,\w被转义为其它字符了，因此 \\w才行
*Global
特点: 是一个全局对象,这个Global中封装的方法,我们 方法名() 就可以直接调用这个方法,
而不用通过对象名字.
1.encodeURI(): URL编码
decodeURI(): URL解码
2.encodeURLComponent(): URL编码 编码的字符更多
decodeURIComponent(): URL解码
URL编码介绍: 中文的数据进行转码,
传智播客. GBK 8个二进制位
% 9 5 -->%间隔1个个的字节
3.parseInt(): 字符串转数字-->逐一判断每一个字符是否是数字,直到不是数字为止,将前面数字转为num
123abc-->parseInt后得到123 但是用+号转则是NaN
4.isNaN(): 判断一个值是否是NaN
NaN六亲不认,连自己都不认. NaN参与的 == 比较全部为false,因此没有判断方式判断是否是NaN,
只能通过这个方法.
5.eval(): 将js的字符串作为脚本来执行;
