1:什么是JavaScript?
他是一种描述性的语言,也是一种基于对象的(Object)和事件驱动(Event Driver)的,并且具有安全性能的脚本语言;
它的特点如下:
特点如下:
01:主要用来在HTML页面中添加交互行为
02:是一种脚本语言,语法和Java类似
03:一般用来编写客户端的脚本
04:是一种解释性语言,遍执行便解释
2:JS基础架构
<script type="text/javascript">
alter('ok')
</script>
3:JS的组成:
建议:
<script>..........</script>可以包含在文档中的任何地方,只要保证这些代码在被使用钱已经读取并加载到内存即可,最好放在<body>前,
4:JavaScript的执行顺序
发送请求---------数据处理----------发送响应
在网页中引用JavaScript的方式
01:内部使用JavaScript文件
02:使用外部JavaScript文件
03:直接在TML标签
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>例子</title> </head> <body> <script type="text/javascript"> document.write('hello,javascript'); </script> </body> </html>
JavaScript的核心语法:
语法:
var 合法的变量名;
关键字为var 命名规则:
01:可以由数字.字母 ,下划线和$符号组成
02:首字母不能为数字
03:不能使用关键字命名
04:可以在声明变量的同时为变量赋值,这称为变量的初始值,
var width =20;//在声明变量width的时候,将数值20赋给变量width var x,y,z=10;//在一行代码中声明多个变量时,各变量之间用逗号隔开
需要强调的是:JavaScript区分大小写,所有的大小写不同的变量名表示不同的变量,JavaScript是一种弱类型语言,因此允许直接声明变量而直接使用,系统将自动为变量赋值
例如:
x=99;//没有声明x直接使用
数据类型:
undefined(未定义类型)
null(空类型)
number(数值类型)
String(字符串类型)
Boolean(布尔类型)
typeof:来判断一个值或者变量究竟属于那种数据类型
语法:
typeof(变量或值)
返回结果有以下几种:
undefined:如果数据类型为undefined,返回undefined类型的结果
number:如果数据类型为number,返回number类型的结果
String:如果数据类型为String,返回String类型的结果
boolean:如果数据类型为boolean,返回boolean类型的结果
object:如果数据类型为null,或者变量是一种引用类型,如对象,数组 ,返回object类型的结果
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>typeof的功能和用法的实现</title> </head> <body> <script type="text/javascript"> document.write("<h2>对变量或值的调用typeof运算符返回值:</h2>"); var width,height=10,name="rose"; var date =new Date();//获取时间 var arr =new Array();//定义数组 document.write(""+typeof(width)+"</br>"); document.write("height:"+typeof(height)+"</br>"); document.write("name:"+typeof(name)+"</br>"); document.write("date:"+typeof(date)+"</br>"); document.write("arr:"+typeof(arr)+"</br>"); document.write("true:"+typeof(true)+"</br>"); document.write("null:"+typeof(null)); </script> </body> </html>
数组:
创建数组的语法:
var 数组名称 =new Array(size);
var fruit =new Array(5); var fruit =new Array("apple","orange","pear","banana"); 也可以这样 var fruit =new Array(4); fruit [0] ="apple"; fruit [1] ="orange"; fruit [2] ="pear"; fruit [3] ="banana"; var fruit =new Array["apple","orange","pear","banana"];
数组常用的方法和属性:
属性:length:设置或者返回数组中的元素数目
方法:
join():把所有的元素放在一个字符串中,通过一个分隔符进行分割
sort():对数组排序
push():想数组末尾加上一个或者多个元素,并返回新长度
运算符号:
算术运算符:+,-,*,/,%,++,--
逻辑运算符:=,&&,||,!
比较运算符:<,>,<=,>=,!=,!==,===
赋值运算:=,+=,-=
逻辑控制语句:
01: if结构
语法:
if(表达式1){ //JavaScript语句1 }else{ //JavaScript语句2 }
02:switch结构
语法:
switch(表达式){ case 值1: //JavaScript 语句1 break; case 值2: //JavaScript 语句2 break; case 值3: //JavaScript 语句3 break; ....... default: //JavaScript 语句n break; }
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>上机三</title> </head> <body> <script type="text/javascript"> var number1 =prompt("请输入第一个数字"); var number2 =prompt("请输入第二个数字"); var number3=prompt("请输入运算符"); var number=0; number1=Number(number1); number2=Number(number2); switch(number3){ case "+": number =number1+number2; break; case "-": number =number1-number2; break; case "*": number =number1*number2; break; case "/": number =number1/number2; break; } alert(number1+number3+number2+"="+number) </script> </body> </html>
03:for循环
语法:
for(初始化 ;调价;增量或者减量){ //JavaScript语句1
}
04:while循环
语法:
while(条件){ //JavaScript语句1 }
05:do-whlie循环
语法
do(条件){ //JavaScript语句1 }while(条件);
06:for-in
语法:
for(变量in对象){ //JavaScript语句1 }
07:中断循环
break:立即退出整个程序
continue:退出当前循环,根据条件判断是否进入下一个循环
注释:
单行注释://
多行注释:/* */ 快捷键: Ctrl+shift+/
常用的输入和输入:
alert();
语法:
alert(“提示信息”);
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>简答四</title> </head> <body> <script type="text/javascript"> function email (em){ alert(em); if(em.indexOf('@')==-1){ alert('请输入正确的邮箱地址'); return; }else if(em.indexOf('.')==-1){ alert('请输入正确的邮箱'); return; } else{ alert(em.substring(em.indexOf('@')+1,em.indexOf('.'))); } } </script> <input type="button" value ="请输入邮箱地址" onclick="email(prompt('请输入邮箱','susan@sohu.com'))"> </body> </html>
系统函数:
parseInt();
var num1 =parseInt(“19.90”);//返回的为19 var num2 =parseInt(“19wwww”);//返回的为19 var num3=parseInt(“eccfff19.90”);//返回的为NaN
parseFolat();
语法:
parseFolat(“”字符串);
var num1 =parseFloat(“19.90”);//返回的为19.90 var num2 =parseFloat(“19wwww”);//返回的为19 var num3=parseFloat(“eccfff19.90”);//返回的为NaN
isNaN();
语法:
isNaN(x);
var flag =isNaN("12.2");//返回为false var flag 1=isNaN("12.2s");//返回为true var flag 2=isNaN(12.2");//返回为false
自定义函数:
有参函数 function 函数名( 参数1,参数2,参数3){ //JavaScript语句1 [return 返回值] } 无参函数 function 函数名( ){ //JavaScript语句1 }
调用函数:
事件名="函数名";
变量的作用域:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>作用域e</title> </head> <body onload="second()"> <script type="text/javascript"> var i=20; function first(){ var i=5; for(var j=0;j<i;j++){ document.write(" "+j); } } function second(){ var t=prompt("请输入一个数","") if(t>i){ document.write(t); }else{ document.write(i); first(); } } </script> </body> </html>