js基础知识

来源:互联网 发布:mac 你没有权限文件夹 编辑:程序博客网 时间:2024/06/05 09:27
javascript


在HTML页面中使用javascript
<script></script>
script标签可以出现在HTML页面的任一位置


基本操作
alert()   简单弹出提示框
prompt()   弹窗  输入框   返回值String
confirm()  确认框  返回boolean值


javascript是一种弱类型的语言
变量类型var


数据类型
Undefined   未定义或者未赋值   变量默认初始化值 undefined
null        空
Number      数值型
Boolean     布尔类型
String      字符串


typeOf用法:
typeof 变量   返回变量的数据类型


Array是JavaScript中的集合类型
括号中只有一个数值时,该值为长度; 不止一个值时,则为元素值


语法结构与Java语法结构相同
if
switch
while
do...while
for
注意:foreach  i获取的还是下标
for(var i in 集合对象){

}


函数  function


系统函数
isNaN()  判断变量值是否为数字,不是则为true, 反之为false
eval()   会将Javascript字符串作为脚本代码执行;


事件:
onload  页面自动加载事件
onfocus   input文本框获取焦点时触发的事件
onblur    input失去焦点
onchange   内容改变时
onsubmit   表单提交事件
onmouseover   鼠标移到某节点之上
onmouseout    鼠标离开某节点时
onclick  鼠标点击事件


在CSS盒子模型由4部分构成,margin(外边距,盒子边框外面的间隙),padding(内边距,也叫内填充,盒子边框和盒子内元素的间隙),border(边框,有三个属性值,分别是边框厚度、颜色和样式,边框厚度可为0,即没有边框),以及盒子中的元素;
盒子的宽度=盒子内元素宽度+左右外边距+左右内边距+左右边框;




JavaScript是一种描述语言,基于对象和事件驱动的脚本语言
JavaScript特点
脚本语言(一种轻量级的编程语言)
一种解释性语言(无需预编译)
被设计为向HTML页面添加交互行为
运行于客户端


JavaScript 的简史
95年LiveScript(Netscape公司)
Netscape将其更名为JavaScript
微软IE3.0并附带JScript、CEnvi的ScriptEase以及
JavaScript三足鼎立
97年JavaScript1.1版本被ECMA(欧洲计算机制造商)标准化为ECMAScript的全新脚本语言


JaScript 与 ECMAScript 的关系
ECMAScript是JavaScript的标准和基础
JavaScript 与 JAVA 的关系
雷锋和雷峰塔的关系
JavaScript和Java都与sun公司有合作,是借势Java




javaScript组成
EMCAScript(核心)
DOM(文档对象模型)
BOM(浏览器对象模型)


什么是 ECMAScript
ECMAScript定义了脚本语言的所有属性、方法和对象
包括语法、类型、关键字、保留字、运算符、对象等
除了JavaScript外,同时也是Nombas的ScriptEase和
  Flash脚本ActionScript的基础


ECMAScript
javaScript
ActionScript
ScriptEase


DOM(Document Object Model 文档对象模型) )
HTML和XML的应用程序接口(API)
把整个页面规划为层级式的节点结构
<html>
<head>
<title>Sample Page</title>
</head>
<body>
<p>Hello World!</p>
</body>
</html>


BOM(Browser Object Model 浏览器对象模型) )
可对浏览器窗口进行访问和操作
  包括
弹出新的浏览器窗口
移动、关闭浏览器窗口及调节浏览器窗口大小
获取用户屏幕分辨率的屏幕对象
WEB浏览器详细的定位对象
对象举例
Window对象
Navigator对象
Screen对象
History对象
Location对象


JavaScript
语法
<script type= "text/javascript" >
<!--
// JavaScript  代码
//-->
</script>
注意
(1 )”<!-- -->” 部分是非必须的,为了规避老版本浏览器不识别
(2 )“//” 是 JavaScript  的注释符号(/**/ 也是注释符号),它会阻止
JavaScript  编译器对这一行的编译
(3 )type成 属性不推荐写成 language= " javascript "  ,不符合XHMLT1.0


引用JavaScript的3种方式
HTML标签中引用 <a href="javaScript:alert('');">点击</a>
<script>标签中直接书写

通过<script>标签的src属性引入外部JS文件<script type="text/javaScript" src=""</script>

回顾:
变量的声明   var
数据类型: undefined、 null  Number  String  Boolean


函数声明
function 函数名(){
}


var 函数名 = function(){
}
匿名函数
(function(){
})()


事件:
onload   页面加载
onclick   鼠标点击(单击)
onsubmit   表单form提交事件
onfocus   input文本框获取焦点
onblur    input文本框失去焦点
onmouseover   鼠标移上
onmouseout    鼠标离开


一、Window对象
history属性
back()    对于浏览器中的后退按钮
forward()    对于前进按钮
go(n)  跳转   n=0 刷新当前页  n>0 前进   n<0 后退


location属性
href属性   跳转
方法
reload()   刷新当前页
replace("url")   跳转


document属性
getElementById(id)   根据节点的id属性值获取第一个节点对象
getElementsByTagName(标签名)
根据节点名称获取一个数组
getElementsByName(name)  根据节点name属性值获取一个数组


innerHTML  设置或获取标签的文本内容
value   设置或获取input的内容


Window对象常用方法
窗口
open("弹出窗口的url", "_blank/_self", "窗口特征")  弹出窗口   返回弹出窗口的对象
toolbar  工具栏   取值 yes/no/1/0
location  地址栏
scrollbars  滚动条
resizable  窗口是否允许调整大小


close()   关闭窗口


定时函数
setInterval(function, time毫秒数)   循环执行

setTimeout(function, time毫秒数)   只执行一次

一、节点操作
parentNode  获取父节点
childNodes  获取所有的子节点(包括文本节点、标签节点)
children   直接获取所有的子标签节点
firstChild  获取第一个子节点(兼容IE)
firstElementChild   兼容google、firefox
lastChild  获取最后一个子节点(兼容IE)
lastElementChild  兼容google、firefox
previousSibling   获取前一个节点
nextSibling  获取下一个节点


节点类型 nodeType
1  元素
2  属性
3  文本
8  注释
9  文档


节点属性操作
getAttribute("属性名")  获取
setAttribute("属性名", "值"); 设置


创建和插入节点
document.createElement("标签名");  创建节点
父节点.appendChild(节点);  追加子节点
父节点.insertBefore(节点1, 节点2)  将1插入到2之前
节点.cloneNode(boolean);  克隆(复制)
boolean  为true  则是完全复制(子节点);false只复制标签自身


父节点.removeChild(子节点)  删除子节点
父节点.replaceChild(节点1, 节点2)  节点1覆盖(替换)节点2  移动节点 




常用的输入/输出/确认
alert()
alert("提示信息"); //提示信息框
prompt()
prompt("提示信息", "输入框的默认信息");
prompt("请输入姓名", "张三");
prompt("请输入姓名");
confirm()
confirm("确认信息?"); //确定则返回true,取消则返回false


JavaScript 的基础语法


注释
变量声明和使用
数据类型
运算符
逻辑控制符
流程控制语句
语法规则


JS的注释方法
JavaScript 的注释方法,与 Java 一致
Java中的注释方法是什么样的?
JS 的注释方法
<script type="text/javascript">
// 单行注释, //  开头用于注释单行
/*
以 以 /*  开头, */ 结束,用于多行注释 ; 与JAVA 一致
*/
document.write(" 请合理使用注释"); // 作该行代码的注释
window.alert(" 我是确认框"); /* 释 同样可以是多行注释 */
</script>


JavaScript 的变量
JavaScript变量用于保存值、保存表达式
1、由于 JavaScript 对大小写敏感,变量名也对大小写敏感 (y 和 Y 是
两个不同的变量)
2、变量必须以字母或下划线或美元符$开始 ,不能使用关键字作为
变量名


变量声明与使用- -2 2


JavaScript 的变量声明
变量声明与使用- -2 2
//JS 的变量声明是通过 var 语句 来声明的, 无需指定数据类型
var num = 10 ;
var str = "JavaScript" ;
// 当然也可声明多个,之间用逗号隔开
var num =10 ,
str = "JavaScript";
// 省略 var  语句,直接变量声明
num = 100; // 相当于window.num = 100;  (不推荐)
语法
1、 如声明多个采用第二种方式是较为高效的
2、每个代码后面的“;”是可省的,建议都写上(为什么呢?)


变量声明与使用- -3 3
//JS 的变量同Java 一样也是先声明后使用的
var myname = " 张三";
var age  = 21;
var address = " 北京海淀";
var str = myname + " ,年龄:" + age + " 籍贯:" + address;
alert( str );


JavaScript 变量的使用
建议先定义后使用
+ 运算符用于把文本值或字符串变量加起来(连接起
来),如果是两个数字则为数学运算加号
= 运算符用于给变量赋值,变量可以重复赋不同类型
的值


JS 的语法约定
代码区分大小写
变量、对象和函数的名称有意义,最好使用驼峰
式命名
句尾的分号最好不要省略


JS的数据类型
数据类型
Undefined 1、Undefined  类型只有一个值,即 undefined
2 、未定义或定义未赋值
Number   var iNum=23; // 整数
var iNum=23.0; // 浮点数
Boolean   true 和false
Null 表示尚未存在的对象 ,与undefined值相等
String 一组被引号(单引号或双引号)括起来的文本
var string1="This is a string";


typeof 运算符


typeof 检测变量的返回值,为字符串类型
 typeof 运算符返回值如下:
undefined:变量被声明后,但未被赋值
string:用单引号或双引号来声明的字符串
boolean:true或false
number:整数或浮点数
function:函数方法
object:对象 或 数组 或 Null 类型


转换函数
parseInt():字符串转换为整数
parseFloat():字符串转换为浮点数
toString():返回字符串
强制类型转换
Boolean():转化为逻辑值
Number():对象转化为数字
String():对象转化为字符串


运算符号


类型 运算符
算术运算符 + - * / % ++ --
赋值运算符 = += -= *= /= %=
比较运算符 > < >= <= == != ===
逻辑运算符 && || !
for (变量 in 对象) { 在此执行代码 }
一个= 是赋值,两个= 是判断值相等,三个= 判断值和类型都相同


 if 条件语句
//if
if( 条件)
{
//JavaScript 代码;
}
else
{
//JavaScript 代码;
}
// if else 
if
if( 条件)
{
//JavaScript 代码;
}
else if(  条件 )
{
//JavaScript 代码;
}else{
//JavaScript 代码;


条件运算符
语法
 示例 variablename = ( condition ) ? value1 : value2 ;
条件运算符
// 于 如果余额大于 7000  元则购买iPhone 6  ,否则不买
if( money > 7000 ) {
buy();//  购买iPhone 6
}else{
none(); // 不买
}
// 条件运算符  方法实现
isBuyiPhone6 = ( money > 7000 ) ? buy() : none();
variablename = ( condition ) ? value1 : value2 ;


 switch 多分支语句
switch 多分支语句
switch(n) {
case 1:
// 执行代码块 1
break;
case 2:
// 执行代码块 2
break;
....
default:
//
}


循环控制语句2- -1
while 和 do while 循环语句
循环控制语句2 2- -1 1
// while
while (  变量<= 结束值 )
{
// 需执行的代码
}
// do ... while
do{
// 需执行的代码
}while (  变量<= 结束值 )
语法
两者的区别是判断条件前是否先执行“需执行的代码”


循环控制语句 2--2
 for 循环语句
 for „ in  循环语句
句 循环控制语句 2 2- -2 2
for ( 变量= 开始值; 变量<= 结束值; 变量= 变量+ 步进值 )
{
// 需执行的代码
}
for (  变量a in 对象obj )
{
// 得 获得 obj[a];
}
语法


循环中断




break
使用 break 语句来终止循环
continue
使用 continue 语句来终止当前的循环,然后从下一
个值继续执行


JavaScript 中的函数定义


JavaScript 中的函数
一组可以随时随地运行的语句
将脚本编写为函数以避免页面载入时执行该脚本
分类
系统函数
自定义函数
JavaScript 中的函数定义
/* 系统函数举例*/
parseInt("143dd") //将字符串转化为整数,结果为143
parseFloat("143.33dd") //解析一个字符串,并返回一个浮点数,结
果为143.33
/* 自定义函数*/
//根据函数的语法自定义的函数
myfun(123);


常用的系统函数
函数名称 描述
parseInt() 解析一个字符串并返回一个整数
parseFloat() 解析一个字符串并返回一个浮点数
isNaN() 检查某个值是否是数字,返回true | false
eval()
计算 JavaScript 字符串,并把它作为脚本代码来
执行


自定义函数
function 函数名 ( 参数1,参数2,…. )
{
//函数代码块
}

var 函数名 = function (参数1,参数2,…. )
{
//函数代码块
}
语法
传入的参数是可选的


如何调用函数
函数可以通过其名字加上括号中的参数进行调用
函数的调用
// 自定义函数调用
function sayHello(name){
alert( name + "说了句hello。" );
}
sayHello("Tom");
// 函数变量的调用
var sayHello = function(name){
alert( name + "说了句hello。" );
}
sayHello(" Tom ");


定义没有函数名称的函数
// 传统的定义函数方式
var fn = function (){
alert(12345);
}
fn();
// 函数体替换fn
(function() {
alert(12345);
})();
把fn 用函数体代替掉,直接运行,
我们称之为匿名函数。一般用于
框架的封装


函数的返回值
函数如何返回值
通过 return 关键字返回函数的值
函数的返回值
function sayHello(name){
return ( name + "说了句hello。" );
}
var str = sayHello("Tom");
alert( str ); // Tom说了句hello。
示例
与 Java 一样,函数在执行过 return 语句后立即停止代码。因此,
return 语句后的代码都不会被执行


部变量
代码阅读
var i = 20;
function first(){
var i=5;
for(var j=0;j<i;j++){
document.write("&nbsp;&nbsp;&nbsp;&nbsp;"+j);
}
}
function second(){
var t=prompt(" 输入一个数","")
if(t>i){
document.write(t);
}else{
document.write(i);
first();
}
… …
<body onload="second()">


变量作用域
全局变量
任何地方都可被调用,公共的( public )
局部变量
只能在函数内部调用,私有的( private)
应尽量避免使用全局变量,以免团队开发变量冲突


JavaScript 侦测到的行为
 事件举例:
鼠标点击
页面或图像载入
鼠标悬浮于页面的某个热点之上
在表单中选取输入框
表单提交
键盘按键
事件
事件通常与函数配合使用,当事件发生时去调用函数


页面中常用的事件


程序错误分类
语法错误
逻辑错误


try...catch  语句
try {
// 在此运行代码
} catch(err) {
// 在此处理错误
// err.message message
}一、节点操作
parentNode  获取父节点
childNodes  获取所有的子节点(包括文本节点、标签节点)
children   直接获取所有的子标签节点
firstChild  获取第一个子节点(兼容IE)
firstElementChild   兼容google、firefox
lastChild  获取最后一个子节点(兼容IE)
lastElementChild  兼容google、firefox
previousSibling   获取前一个节点
nextSibling  获取下一个节点


节点类型 nodeType
1  元素
2  属性
3  文本
8  注释
9  文档


节点属性操作
getAttribute("属性名")  获取
setAttribute("属性名", "值"); 设置


创建和插入节点
document.createElement("标签名");  创建节点
父节点.appendChild(节点);  追加子节点
父节点.insertBefore(节点1, 节点2)  将1插入到2之前
节点.cloneNode(boolean);  克隆(复制)
boolean  为true  则是完全复制(子节点);false只复制标签自身


父节点.removeChild(子节点)  删除子节点
父节点.replaceChild(节点1, 节点2)  节点1覆盖(替换)节点2  移动节点 




常用的输入/输出/确认
alert()
alert("提示信息"); //提示信息框
prompt()
prompt("提示信息", "输入框的默认信息");
prompt("请输入姓名", "张三");
prompt("请输入姓名");
confirm()
confirm("确认信息?"); //确定则返回true,取消则返回false


JavaScript 的基础语法


注释
变量声明和使用
数据类型
运算符
逻辑控制符
流程控制语句
语法规则


JS的注释方法
JavaScript 的注释方法,与 Java 一致
Java中的注释方法是什么样的?
JS 的注释方法
<script type="text/javascript">
// 单行注释, //  开头用于注释单行
/*
以 以 /*  开头, */ 结束,用于多行注释 ; 与JAVA 一致
*/
document.write(" 请合理使用注释"); // 作该行代码的注释
window.alert(" 我是确认框"); /* 释 同样可以是多行注释 */
</script>


JavaScript 的变量
JavaScript变量用于保存值、保存表达式
1、由于 JavaScript 对大小写敏感,变量名也对大小写敏感 (y 和 Y 是
两个不同的变量)
2、变量必须以字母或下划线或美元符$开始 ,不能使用关键字作为
变量名


变量声明与使用- -2 2


JavaScript 的变量声明
变量声明与使用- -2 2
//JS 的变量声明是通过 var 语句 来声明的, 无需指定数据类型
var num = 10 ;
var str = "JavaScript" ;
// 当然也可声明多个,之间用逗号隔开
var num =10 ,
str = "JavaScript";
// 省略 var  语句,直接变量声明
num = 100; // 相当于window.num = 100;  (不推荐)
语法
1、 如声明多个采用第二种方式是较为高效的
2、每个代码后面的“;”是可省的,建议都写上(为什么呢?)


变量声明与使用- -3 3
//JS 的变量同Java 一样也是先声明后使用的
var myname = " 张三";
var age  = 21;
var address = " 北京海淀";
var str = myname + " ,年龄:" + age + " 籍贯:" + address;
alert( str );


JavaScript 变量的使用
建议先定义后使用
+ 运算符用于把文本值或字符串变量加起来(连接起
来),如果是两个数字则为数学运算加号
= 运算符用于给变量赋值,变量可以重复赋不同类型
的值


JS 的语法约定
代码区分大小写
变量、对象和函数的名称有意义,最好使用驼峰
式命名
句尾的分号最好不要省略


JS的数据类型
数据类型
Undefined 1、Undefined  类型只有一个值,即 undefined
2 、未定义或定义未赋值
Number   var iNum=23; // 整数
var iNum=23.0; // 浮点数
Boolean   true 和false
Null 表示尚未存在的对象 ,与undefined值相等
String 一组被引号(单引号或双引号)括起来的文本
var string1="This is a string";


typeof 运算符


typeof 检测变量的返回值,为字符串类型
 typeof 运算符返回值如下:
undefined:变量被声明后,但未被赋值
string:用单引号或双引号来声明的字符串
boolean:true或false
number:整数或浮点数
function:函数方法
object:对象 或 数组 或 Null 类型


转换函数
parseInt():字符串转换为整数
parseFloat():字符串转换为浮点数
toString():返回字符串
强制类型转换
Boolean():转化为逻辑值
Number():对象转化为数字
String():对象转化为字符串


运算符号


类型 运算符
算术运算符 + - * / % ++ --
赋值运算符 = += -= *= /= %=
比较运算符 > < >= <= == != ===
逻辑运算符 && || !
for (变量 in 对象) { 在此执行代码 }
一个= 是赋值,两个= 是判断值相等,三个= 判断值和类型都相同


 if 条件语句
//if
if( 条件)
{
//JavaScript 代码;
}
else
{
//JavaScript 代码;
}
// if else 
if
if( 条件)
{
//JavaScript 代码;
}
else if(  条件 )
{
//JavaScript 代码;
}else{
//JavaScript 代码;


条件运算符
语法
 示例 variablename = ( condition ) ? value1 : value2 ;
条件运算符
// 于 如果余额大于 7000  元则购买iPhone 6  ,否则不买
if( money > 7000 ) {
buy();//  购买iPhone 6
}else{
none(); // 不买
}
// 条件运算符  方法实现
isBuyiPhone6 = ( money > 7000 ) ? buy() : none();
variablename = ( condition ) ? value1 : value2 ;


 switch 多分支语句
switch 多分支语句
switch(n) {
case 1:
// 执行代码块 1
break;
case 2:
// 执行代码块 2
break;
....
default:
//
}


循环控制语句2- -1
while 和 do while 循环语句
循环控制语句2 2- -1 1
// while
while (  变量<= 结束值 )
{
// 需执行的代码
}
// do ... while
do{
// 需执行的代码
}while (  变量<= 结束值 )
语法
两者的区别是判断条件前是否先执行“需执行的代码”


循环控制语句 2--2
 for 循环语句
 for „ in  循环语句
句 循环控制语句 2 2- -2 2
for ( 变量= 开始值; 变量<= 结束值; 变量= 变量+ 步进值 )
{
// 需执行的代码
}
for (  变量a in 对象obj )
{
// 得 获得 obj[a];
}
语法


循环中断




break
使用 break 语句来终止循环
continue
使用 continue 语句来终止当前的循环,然后从下一
个值继续执行


JavaScript 中的函数定义


JavaScript 中的函数
一组可以随时随地运行的语句
将脚本编写为函数以避免页面载入时执行该脚本
分类
系统函数
自定义函数
JavaScript 中的函数定义
/* 系统函数举例*/
parseInt("143dd") //将字符串转化为整数,结果为143
parseFloat("143.33dd") //解析一个字符串,并返回一个浮点数,结
果为143.33
/* 自定义函数*/
//根据函数的语法自定义的函数
myfun(123);


常用的系统函数
函数名称 描述
parseInt() 解析一个字符串并返回一个整数
parseFloat() 解析一个字符串并返回一个浮点数
isNaN() 检查某个值是否是数字,返回true | false
eval()
计算 JavaScript 字符串,并把它作为脚本代码来
执行


自定义函数
function 函数名 ( 参数1,参数2,…. )
{
//函数代码块
}

var 函数名 = function (参数1,参数2,…. )
{
//函数代码块
}
语法
传入的参数是可选的


如何调用函数
函数可以通过其名字加上括号中的参数进行调用
函数的调用
// 自定义函数调用
function sayHello(name){
alert( name + "说了句hello。" );
}
sayHello("Tom");
// 函数变量的调用
var sayHello = function(name){
alert( name + "说了句hello。" );
}
sayHello(" Tom ");


定义没有函数名称的函数
// 传统的定义函数方式
var fn = function (){
alert(12345);
}
fn();
// 函数体替换fn
(function() {
alert(12345);
})();
把fn 用函数体代替掉,直接运行,
我们称之为匿名函数。一般用于
框架的封装


函数的返回值
函数如何返回值
通过 return 关键字返回函数的值
函数的返回值
function sayHello(name){
return ( name + "说了句hello。" );
}
var str = sayHello("Tom");
alert( str ); // Tom说了句hello。
示例
与 Java 一样,函数在执行过 return 语句后立即停止代码。因此,
return 语句后的代码都不会被执行


部变量
代码阅读
var i = 20;
function first(){
var i=5;
for(var j=0;j<i;j++){
document.write("&nbsp;&nbsp;&nbsp;&nbsp;"+j);
}
}
function second(){
var t=prompt(" 输入一个数","")
if(t>i){
document.write(t);
}else{
document.write(i);
first();
}
… …
<body onload="second()">


变量作用域
全局变量
任何地方都可被调用,公共的( public )
局部变量
只能在函数内部调用,私有的( private)
应尽量避免使用全局变量,以免团队开发变量冲突


JavaScript 侦测到的行为
 事件举例:
鼠标点击
页面或图像载入
鼠标悬浮于页面的某个热点之上
在表单中选取输入框
表单提交
键盘按键
事件
事件通常与函数配合使用,当事件发生时去调用函数


页面中常用的事件


程序错误分类
语法错误
逻辑错误


try...catch  语句
try {
// 在此运行代码
} catch(err) {
// 在此处理错误
// err.message message
}一、节点操作
parentNode  获取父节点
childNodes  获取所有的子节点(包括文本节点、标签节点)
children   直接获取所有的子标签节点
firstChild  获取第一个子节点(兼容IE)
firstElementChild   兼容google、firefox
lastChild  获取最后一个子节点(兼容IE)
lastElementChild  兼容google、firefox
previousSibling   获取前一个节点
nextSibling  获取下一个节点


节点类型 nodeType
1  元素
2  属性
3  文本
8  注释
9  文档


节点属性操作
getAttribute("属性名")  获取
setAttribute("属性名", "值"); 设置


创建和插入节点
document.createElement("标签名");  创建节点
父节点.appendChild(节点);  追加子节点
父节点.insertBefore(节点1, 节点2)  将1插入到2之前
节点.cloneNode(boolean);  克隆(复制)
boolean  为true  则是完全复制(子节点);false只复制标签自身


父节点.removeChild(子节点)  删除子节点
父节点.replaceChild(节点1, 节点2)  节点1覆盖(替换)节点2  移动节点 




常用的输入/输出/确认
alert()
alert("提示信息"); //提示信息框
prompt()
prompt("提示信息", "输入框的默认信息");
prompt("请输入姓名", "张三");
prompt("请输入姓名");
confirm()
confirm("确认信息?"); //确定则返回true,取消则返回false


JavaScript 的基础语法


注释
变量声明和使用
数据类型
运算符
逻辑控制符
流程控制语句
语法规则


JS的注释方法
JavaScript 的注释方法,与 Java 一致
Java中的注释方法是什么样的?
JS 的注释方法
<script type="text/javascript">
// 单行注释, //  开头用于注释单行
/*
以 以 /*  开头, */ 结束,用于多行注释 ; 与JAVA 一致
*/
document.write(" 请合理使用注释"); // 作该行代码的注释
window.alert(" 我是确认框"); /* 释 同样可以是多行注释 */
</script>


JavaScript 的变量
JavaScript变量用于保存值、保存表达式
1、由于 JavaScript 对大小写敏感,变量名也对大小写敏感 (y 和 Y 是
两个不同的变量)
2、变量必须以字母或下划线或美元符$开始 ,不能使用关键字作为
变量名


变量声明与使用- -2 2


JavaScript 的变量声明
变量声明与使用- -2 2
//JS 的变量声明是通过 var 语句 来声明的, 无需指定数据类型
var num = 10 ;
var str = "JavaScript" ;
// 当然也可声明多个,之间用逗号隔开
var num =10 ,
str = "JavaScript";
// 省略 var  语句,直接变量声明
num = 100; // 相当于window.num = 100;  (不推荐)
语法
1、 如声明多个采用第二种方式是较为高效的
2、每个代码后面的“;”是可省的,建议都写上(为什么呢?)


变量声明与使用- -3 3
//JS 的变量同Java 一样也是先声明后使用的
var myname = " 张三";
var age  = 21;
var address = " 北京海淀";
var str = myname + " ,年龄:" + age + " 籍贯:" + address;
alert( str );


JavaScript 变量的使用
建议先定义后使用
+ 运算符用于把文本值或字符串变量加起来(连接起
来),如果是两个数字则为数学运算加号
= 运算符用于给变量赋值,变量可以重复赋不同类型
的值


JS 的语法约定
代码区分大小写
变量、对象和函数的名称有意义,最好使用驼峰
式命名
句尾的分号最好不要省略


JS的数据类型
数据类型
Undefined 1、Undefined  类型只有一个值,即 undefined
2 、未定义或定义未赋值
Number   var iNum=23; // 整数
var iNum=23.0; // 浮点数
Boolean   true 和false
Null 表示尚未存在的对象 ,与undefined值相等
String 一组被引号(单引号或双引号)括起来的文本
var string1="This is a string";


typeof 运算符


typeof 检测变量的返回值,为字符串类型
 typeof 运算符返回值如下:
undefined:变量被声明后,但未被赋值
string:用单引号或双引号来声明的字符串
boolean:true或false
number:整数或浮点数
function:函数方法
object:对象 或 数组 或 Null 类型


转换函数
parseInt():字符串转换为整数
parseFloat():字符串转换为浮点数
toString():返回字符串
强制类型转换
Boolean():转化为逻辑值
Number():对象转化为数字
String():对象转化为字符串


运算符号


类型 运算符
算术运算符 + - * / % ++ --
赋值运算符 = += -= *= /= %=
比较运算符 > < >= <= == != ===
逻辑运算符 && || !
for (变量 in 对象) { 在此执行代码 }
一个= 是赋值,两个= 是判断值相等,三个= 判断值和类型都相同


 if 条件语句
//if
if( 条件)
{
//JavaScript 代码;
}
else
{
//JavaScript 代码;
}
// if else 
if
if( 条件)
{
//JavaScript 代码;
}
else if(  条件 )
{
//JavaScript 代码;
}else{
//JavaScript 代码;


条件运算符
语法
 示例 variablename = ( condition ) ? value1 : value2 ;
条件运算符
// 于 如果余额大于 7000  元则购买iPhone 6  ,否则不买
if( money > 7000 ) {
buy();//  购买iPhone 6
}else{
none(); // 不买
}
// 条件运算符  方法实现
isBuyiPhone6 = ( money > 7000 ) ? buy() : none();
variablename = ( condition ) ? value1 : value2 ;


 switch 多分支语句
switch 多分支语句
switch(n) {
case 1:
// 执行代码块 1
break;
case 2:
// 执行代码块 2
break;
....
default:
//
}


循环控制语句2- -1
while 和 do while 循环语句
循环控制语句2 2- -1 1
// while
while (  变量<= 结束值 )
{
// 需执行的代码
}
// do ... while
do{
// 需执行的代码
}while (  变量<= 结束值 )
语法
两者的区别是判断条件前是否先执行“需执行的代码”


循环控制语句 2--2
 for 循环语句
 for „ in  循环语句
句 循环控制语句 2 2- -2 2
for ( 变量= 开始值; 变量<= 结束值; 变量= 变量+ 步进值 )
{
// 需执行的代码
}
for (  变量a in 对象obj )
{
// 得 获得 obj[a];
}
语法


循环中断




break
使用 break 语句来终止循环
continue
使用 continue 语句来终止当前的循环,然后从下一
个值继续执行


JavaScript 中的函数定义


JavaScript 中的函数
一组可以随时随地运行的语句
将脚本编写为函数以避免页面载入时执行该脚本
分类
系统函数
自定义函数
JavaScript 中的函数定义
/* 系统函数举例*/
parseInt("143dd") //将字符串转化为整数,结果为143
parseFloat("143.33dd") //解析一个字符串,并返回一个浮点数,结
果为143.33
/* 自定义函数*/
//根据函数的语法自定义的函数
myfun(123);


常用的系统函数
函数名称 描述
parseInt() 解析一个字符串并返回一个整数
parseFloat() 解析一个字符串并返回一个浮点数
isNaN() 检查某个值是否是数字,返回true | false
eval()
计算 JavaScript 字符串,并把它作为脚本代码来
执行


自定义函数
function 函数名 ( 参数1,参数2,…. )
{
//函数代码块
}

var 函数名 = function (参数1,参数2,…. )
{
//函数代码块
}
语法
传入的参数是可选的


如何调用函数
函数可以通过其名字加上括号中的参数进行调用
函数的调用
// 自定义函数调用
function sayHello(name){
alert( name + "说了句hello。" );
}
sayHello("Tom");
// 函数变量的调用
var sayHello = function(name){
alert( name + "说了句hello。" );
}
sayHello(" Tom ");


定义没有函数名称的函数
// 传统的定义函数方式
var fn = function (){
alert(12345);
}
fn();
// 函数体替换fn
(function() {
alert(12345);
})();
把fn 用函数体代替掉,直接运行,
我们称之为匿名函数。一般用于
框架的封装


函数的返回值
函数如何返回值
通过 return 关键字返回函数的值
函数的返回值
function sayHello(name){
return ( name + "说了句hello。" );
}
var str = sayHello("Tom");
alert( str ); // Tom说了句hello。
示例
与 Java 一样,函数在执行过 return 语句后立即停止代码。因此,
return 语句后的代码都不会被执行


部变量
代码阅读
var i = 20;
function first(){
var i=5;
for(var j=0;j<i;j++){
document.write("&nbsp;&nbsp;&nbsp;&nbsp;"+j);
}
}
function second(){
var t=prompt(" 输入一个数","")
if(t>i){
document.write(t);
}else{
document.write(i);
first();
}
… …
<body onload="second()">


变量作用域
全局变量
任何地方都可被调用,公共的( public )
局部变量
只能在函数内部调用,私有的( private)
应尽量避免使用全局变量,以免团队开发变量冲突


JavaScript 侦测到的行为
 事件举例:
鼠标点击
页面或图像载入
鼠标悬浮于页面的某个热点之上
在表单中选取输入框
表单提交
键盘按键
事件
事件通常与函数配合使用,当事件发生时去调用函数


页面中常用的事件


程序错误分类
语法错误
逻辑错误


try...catch  语句
try {
// 在此运行代码
} catch(err) {
// 在此处理错误
// err.message message
}





























0 0
原创粉丝点击