JavaScript简介
JavaScript是网景公司开发基于浏览器,基于面向对象,基于事件驱动式网页脚本语言
使用场景:
1.表单验证 2.网页特效 3.一些简单的网页游戏 4.与服务器进行交互(AJAX)
常用两个客户端的方法
document.write(str) 文档方法,而write是其中一个方法
在浏览器中输出参数字符串str
document是文档对象(DOM)中的一个对象,表示当前浏览器中的网页文档
document提供了许多访问与控制页面元素的属性和方法,write()是其中的一个方法.
JS通过"."运算符调用对象的属性与方法.
window.alert(str) 窗口方法,提示框保是其中之一哦
该方法在浏览器中弹出一个对话框,对话框中显示参数str的内容.
Window对象同样是浏览器提供的对象(BOM),对象提供了许多访问与控制窗口元素与方法,alert()方法只是其中一个方法.
1.在HTML代码中加JavaScript代码
<script></script>标记对(内嵌式)
在一个HTML文件中,可以出现多个<script></script>块,各个块按照他们在HTML中出现的顺序依次被解释与执行.
浏览器将忽略其不支持的版本编写的脚本.language属性可以省略,因为所有的浏览顺默认的language的为JavaScript
例如
<html>
<script language = "javascript">
alert("这是JS程序");
</script>
</html>
外链式
使用src属性引用JavaScript脚本(外链式)
通过src属性,可以使用外部的js脚本文件,外部javascript文件的扩展名是.js
代码重用:不同网页可引用相同的javascript源代码文件
安全性:对于怀有恶意的人,可通过代码发现安全漏洞,从而威胁网站安全. 需要将JS文件统一放到有访问权限的控制目录,可以避免任何人直接进行查看.
代码维护:将JS文件放在指定目录下,方使代码管理与维护
<script language = "javascript" src = "js/pulic.js"></script>
2.JavaScript语法设计规则
1.程序由若干语句组成, 2.每条语句由合法的函数,数据,表达式组成 每条语句以分号";"结束 (但是不是必须的) 4.一行中可以放置多条语句,但必须以分号进行隔开
区分大小写:所有关键字是小写的, JS内建以对象属性与方法采用大小写混合的方法(骆峰命名法) 对于事件响应的句柄不区分大小既属于DOM,又属于HTML.
JavaScript脚本程序须嵌入在HTML中,不能包含HTML标记代码
每行一条脚本语句 语句末尾可以加分号一定是英文下的分号(;),最好加分号;
JavaScript脚本程序可以独立保存为一个外部文件
注释:
单行注释: //或#开始
多行注释: /*注释内容*/
空白与缩进:
运算符与关键字之间出现的空格将被忽略
适当使用缩进和空白有助于改善程序的可读性
空白包括空行或者空格
3.JavaScript变量
变理是用来描述现实在世界中各种不同的数据的;变量就是存储数据的临时空间,变量是与某个值相关联的名称,可以看作是存储与引用数据的容器.
变量关键字var 例如:var username;
同时声明多个变量,多个变量间用逗号分开,例如:var username,password
JS为弱为类型语言,在定义变量不需要指定变量的类型,JS会根据变量所赋的值自动确定变量的类型.
JS变量的数据在程序中可以变化
名称规则
变量名必须以一个字母或下划线"_"开始,后面的字符是数字0-9,字母A-Z或a-z.
不能使用javaScript关键字或者保留字作为变量名.JS变量名称区分大小写.
JS关键字如下:
break case catch continue default do else finally for function if in instanceof new return switch this throw try typeof var void while with
JS保留字
abstract boolean byte char class const debugger double enum export extends final float goto implements import int interface long native package private protecter public short static super synchronized throws transient volatile name
4.JS变量命名方式
指定有意义的名称,一般为这个意思的英文单词 必要的时候进行注释 在定义变量的时候需要进行初始化(这是与ios不同的地方)
变量名包含多个单词时,驼峰
下划线命名法,使用"_"符号分隔多个单词,而各单词字母均小写,例如get_user_name.
var username ,password,edu,sex,content //同时定义多个变量
var getUserName //驼峰
var get_user_name //下划线命名
5.变量赋值
=号表示赋值,将=号右边的值赋值给左边的变量, =号右边也可以是值,变量或表达式; 赋值这具一般开发语言都一样;
JS中,重复定义相同名称的变理是合法的,但是后面定义的变量将覆盖前面定义的相同名的变量,但在JAVA中同一作用域中不允许重复定义相同名称的变量
var a = 10;
var b = 20; //声明变量a,并赋值20
var b = 0; //给变量b重新进行赋值0
var c = a ; //将变量的a赋值给变理的c
var sum = c+b; //将变量c与b的和,赋值变量sum
6.数据类型
程序是算法与数据的结合.算法是完成某项任务采用方法的详细步骤.数据是程序处理的对象,目的是对数据进行加工处理,以得到期望的结果.
数据根据其特性进行分类,不同的数据类型不同的处理方法.JavaScript支持5种基本数据类型;number数值,string 字符串,boolean布尔型,undefined未定义 与null空 还有Array 数组 ,Object对象,Function函数3种复合数据类型(引用类型).
数值型number
包括整数,浮点数.在JS中,所有数值被作为浮点数处理,负值通过在数值加"-"号表示,其它用什么进制跟其它语言一样,不过需要注意的是浏览器不支持8进制;
特殊的数据NaN(Not aNumber),该值表示"不是数字",在某些情况下,将返回访值.例如强制将纯字符串转换为数值时将返回NaN. 注意:NaN和任何值都不相等,和它自己也不相等.
基本数据类型
字符串
字符串一般含义就不解释了,注意字符串内容本身包含引号时使用与外层不同的方式
当需要在双引号字符串中包含双引号时,或在单引号字符串包含单引号时, 必须使用反斜线"/"进行转义 ------详见转义字符
布尔型
可以直接为变量指定布尔值,也可以通过比较产生布尔值;
转义字符
"\"反斜线被称为转义字符.当需要表示一些特殊的字符,如回车符,需要使用转义符"\"进行转义.当JavaScript遇到转义符时,将转义符后出现的字符进行特殊解释.
常用转义字符表
\b 表示退格 \f表示换页 \n表示换行 \r表示回车 \t表示制表符 \'表示单引号 \"表示双引号 \\表示反斜线\号本身
Undefined
当一个对象的属性不存在或者变量定义后从未赋值进,返回undefined
数据类型undefined只有一个值"undefined"
Null
当一个变量没有保存有效的数据时或对象不存在时,都将返回null
数据类型null只有一个值"null"
可以通过给一个变量赋null值来清除变理的内容
提示:为什么null的类型是object了呢?其实这是JavaScript最初实现的一个错误,后来被ECMAScript沿用下来.在今天我们可以解释为,null是一个不存在的对象的占位符.
0 "" false undefined null区别
共同点:在if语句中做判断,都会执行false分支
0 "" false是有意义的数据
这三个值虽然在if语句中做判断进表现为"假值",可是它们都是有意义的数据
undefined 与null比较特殊
Undefined表示变理已定义,但是没有赋值.Null表示没有对象被返回.虽然null的类型是object,但是null不具有任何对象的特性.
6.如何判断数据类型 说白了就是判断数据类型的一个方法
功能:typeof()是一个一元运算符,以字符串形式返回变量的类型名称
语法:typeof(name) 或typeof name
返回值有六种可能:"number" "string" "underfined" "boolean" "object" "function"
例如:typeof(window) 返回object
7.数据类型的转换
JS弱数据类型,一般不指定根据赋值来判定,同时数据类型可以在程序中进行转化
在使用不同类型的变量进行表达式运算时,JS根据需要自动尝试进行必要的数据类型转换
var a = 100,b = "100"; //任何类型变量+字符串 会自动转成字符串,再进行连接运算
var result = a+b;
document.write(result); //结果为"100100"
转化布尔型
数值型 当值为0或者NaN时得到false,否则true
字符型 当字符串为空字符串时得到false,否则为true
undefined false
null false
对象 true
使用JS内置对象Boolean()进行强转
a = "abc"
document.write(Boolean(a))
转化字符串
数值型 数值的字符串表示或者字符串"NaN"
布尔型 true转换得到字符串"true",false 转换得字符串"false"
undefined 字符串 "undefined"
null 字符串"null"
使用JS内置对象String()进行转换
a = null;
document.write(String(a))
转换为数值
字符型 如果字符串为数字字符串,则得到相应的数值,否则得到NaN
布尔型 true转换得到1,false得到0
undefined NaN
null 0
使用JS内置对象Number()进行转换
a = "abc";
document.write(Number(a))
强制数据类型的转换
从字符串中提取数值
全局函数parselnt()和parseFloat()
函数parseInt()用于在字符串由左至右提取一个整数数值,当遇到非数值字符时停止提取;
而parseFloat()用于在字符串中由左至右提取一个浮点数,即提取整数和小数点,当遇到非数字字符停止提取.
当字符串中的第一个字符为非数字字符时,paraseInt()和parseFloat()函数返回NaN表示不是数,表示字符串中不包含整数或者浮点数;
例:parseInt("24.234px"); //返回24
parseInt("a23"); //返回NaN
parseFloat(".89"); //返回0.89
parseFloat("24.234px"); //返回24.234
运算符与表达式
运算符 又称为操作符,用于对数据进行各种运算
表达式:由运算符与运算数组成唯一的公式.一个表达式可以包含零个,一个或者多个运算符,一个或多个运算数,表达式总返回一个确定的值
语句:是构成程序的基本单位,一条语句完成某种特定的操作.语句是发送给计算机的执行指令,语句必须符合语法规则.一般语句以分号";"结束
JS运算符分类
算术 赋值 比较 逻辑 字符串 三目运算符
算术运算符
+-*/ 加减乘除 % 取模运算符 ++自增运算符 --自减运算符 -取反运算符
赋值运算符
= += -= *= /= 加减乘除等
赋值运算符与代数中等号相同,但意义不同.代数中的等号表示等号左右的两个表达式的值相同,而赋值运算符是将运算符右边的表达式或变量赋值给左边的变量
提示:任何类型数据+字符串,都将自动转成字符串
比较运算符
>大于 <小于 >=大于等于 <=小于等于 ==等于 !=不等于
===全等于 M===N当M全等于N时,返回真,否则返回假 全等比较,包括值和类型全等,JS不会自动转换类型
!== 不全等 M!=N,当M不全等于N时,返回真,否则返回假
逻辑运算符 &&与 ||或 !非
三目运算符
语法: 条件表达式?m:n
当条件表达式返回真为m,假为n;
运算符优先级
特殊运算符>算术运算符>比较运算符>逻辑运算符>赋值运算符
. [] new ()
! ++ --
* / %
+ -
> < >= <=
== != === !==
&& || ?
= += -= *= /*
8.流程控制语句
跟其它语言一样提下就好;
if...else... switch...case
for(初始化条件;条件判断;条件更新){
循环体语句...
}
while(条件){
循环体语句;
}
do{
循环体语句
}while(条件);
for(变量 in 对象){
语句....
}
break语句 用于无条件结束for,for...in,while,do...while循环以及switch语句,使程序跳转到大括号}之后.
continue语句 结束本次循环,跳过continue语句之后的其它语句,开始下一次新的循环.
9.复合数据类型
数组(PHP里面的数组相当其它语言的 数组 字典 数组字典混排功能仅次于对象的强大存在)
对象 自定义的数据类型,可以是任意的数据类型
函数 其它语言里面是用来当作方法进行调用的,这里就继续往下看下分别在那里吧
基本数据类型与引用数据类型
1.基本数据类型的变量名与数据是直接在栈内存中的,而复合数据类型(对象与数组)存储在两两个部分,实际数据在堆里面,栈内存变量名和数据在堆内存中的位置(地址)
2.基本数据类型变量直接存储值,而复合数据类型变量存储实际值的地址. 使用基本数据类型赋值时传递给目标变量的是值,而使用复合数据时传递的是引用地址. 因此目标变量将始终与原变量相同,修改任何一个都将影响另一个.
数组 (跟其它语言数组符号上有不同请注意)
一组有序排列的的集合,每一个数据称为数组元素 数组索引又叫下标,数组元素的访问使用"[]"括起来调用,元素索引为元素在数组中的位置序号 数组的长度就是元素的个数.
数组定义的方法 1
通过Array()构造函数定义
创建指定长度数组:指定整数为参数 例:var name = new Array(3);
未知长度数组:不带参数 例: var name = new Array();
将数组元素作为参数: 例如: var name = new Array(元素1,元素2,...); 说明这种方式直接将数组元素作为参数传递给Array(),各元素之间用逗号分开.
数组定义方法2
直接赋值法
语法: var name = [元素1,元素2,...]; var arr = ["星期一","星期二","星期三"];
说明:将各元素以不逗号隔开,放在方括号内,赋予数组
注意:直接赋值法的功能是创建并初始化一个数组,在使用该方法时,总是会创建一个新的数组.要想修改自己创建的元素值,需要对各元素进行一一修改;
添加 删除数组元素
数据元素的类型:JS是弱类型的语言,一个数组中的各个元素的数据类型可以不同.
数据元素的长度
JS数组的长度可以进行动态的修改,即使定义数组时指定了数组元素的个数,也可以动太民几数组中添加元素或删除元素
注意:当将数组作为字符串使用时,例如作为alert() 或write()方法的参数时,数组被转换为逗号连接组成的数组元素.
删除数组元素,直接使用delete运算符删除
使用运算符delete删除数组元素时, 元素值被删除,但元素所占空间并没有删除,数组长度并不发生改变,即使删除最后一个元素,数组长度仍保持不变.
JS数组索引是自动增加的,但并不要求对数组中的所有元素均赋值.
数组嵌套与多维数组
JavaScript只支持一维数组,但支持数组嵌套,即数组元素还可以是数组;
对于嵌套数组, 通过多个连续的 []符号 结合索引进行访问.第1个[]符号表示第1层元素的索引值,依次类推;
数组对象
跟其它语言一样使用for ...in来进行遍历
JavaScript中,数组又被作为 对象处理,length属性表示数组元素的个数,或者称为数组长度.数组对象的其它属性与方法,后面再学;
var len = arr.length; //将数组arr元素个数赋予变量len
//使用for循环语句,求以下数据中各元素的和
var arr = [
100,200,...
[5,7,9,10]
[3,4,90],
[2,9,...]
];
10.函数
函数是一段命名的代码块,可以重复使用的一组语句组合
将常用 功能代码定义为函数,避免代码的重复编写,使程序结构清晰,易于维护.
函数分类:自定义函数与系统内置函数两类
语法格式:
function functionName([参数1],[参数2],[参数3]...){
代码块...
[return 参数r];
}
函数由以下几部分构成:
function 关键字,告诉系统这是一个函数而不是其它的
functionName ,函数名称,规则与变量的命名规则一样,函数名称不能变量同名 与其它语言里面的方法签名是一样的啊;
函数名称后面就是括号(),其中包含参数. 参数就是函数从调用者那里获得的值, 说白了就函数的请求参数或者叫做输入参数,有无根据需要而定;别人要提供给你的参数
而由大括号{}括起来的函数代码块.代码块在定义函数时并不执行,而是在调用的时候才执行的啊;
函数中可以使用return语句向调用者返回值.return语句是可选的,Return后紧跟的是要返回的值,Return语句返回值,立即结束函数的执行;
注意:函数不需要定义返回值的格式,可以直接调用return语句进行数据的返回;
函数调用
可以在函数定义的程序文件中随时随地的调用函数;
调用函数时,指定的参数与函数定义时的参数按顺序依次对应,多个参数间使用逗号进行隔开.
function 中定义的函数语句在函数定义时并不执行,而只有在被调用才被执行.
函数参数 --基本数据类型
参数是函数从调用者处获得的值,根据需要而定.
定义函数参数时不需要指定这些参数的数据类型 因为是弱语言来的
实参列表:调用时指定的参数列表 形参列表:函数定义时定义的参数列表
function getCube(形参1,形参2){
代码块;
}
getCube(实参1,实参2);
变量作用域(说白了就是作用范围)
按作用域可以将JS变量分为全局变量和局部变量.可以在当前脚本中的任何地言使用变量称为全局变量,它们具有全局作用域. 对应的只能在函数内部使用的叫局部作用域;
任何位置(包括函数内部)省略var关键字定义的变量均为全局变量
局部变量会在函数运行以后被删除,全局变量会在页面关闭后被删除;
例:var globalName = "global name"; //全局变量
function localName(){
var localName = "globalName"; //局部变量\',
}
当全局变量与局部变量同名时
当函数中定义的局部变量与全局变量同名时, 局部变量将覆盖全局变量,也就是说,在函数中使用函数中定义的局部变量,而不使用函数之外定义的全局变量,也不会影响函数之外的全局变量.
var userName = "小黑"
function showName(){
var userName = "小白"; //定义局部变量
document.write(username); // 将局部变量userName输出
}
showName(); //输出局部变量"小白"
document.write(userName); //将全局变量userName输出,输也"小黑"
函数嵌套调用
函数嵌套调用是指在一个函数中调用另一个函数;
嵌套调用可以将一个复杂的功能分解成多个子函数,两
