JavaScript
- 概念：一门客户端脚本语言
- 运行在客户端浏览器中的。每一个浏览器都有JavaScript的解析引擎
- 脚本语言：不需要编译，直接就可以被浏览器解析执行
- 功能：
- 可以来增强用户和html页面的交互过程，可以来控制html元素，让页面有一些动态的效果，增强用户体验。
- JavaScript发展史：
- 1992年，Nombase公司，开发出第一门客户端脚本语言，专门用于表单的校验，命名为：C- -，后来更名为：ScriptEase
- 1995年，Netscape（网景）公司，开发了一门客户端脚本语言：LiveScript。后来，请来SUN公司专家，修改LiveScript，命名为JavaScript
- 1996年，微软抄袭JavaScript开发出JScript语言
- 1997年，ECMA（欧洲计算机制造商协会），ECMAScript，就是所有客户端脚本语言的标准
- 注意：
JavaScript = ECMAScript + JavaScript 自己特有的东西（BOM + DOM）
- ECMAScript：客户端脚本语言的标准
- 基本语法：
- 与html结合方式：
- 1.内部JS
- 定义< script>，标签体内容就是js代码
- 2.外部JS
- 定义< script>，通过src属性引入外部的js文件
- 注意：
- < script>可以定义在html页面的任何地方，但是定义的位置会影响执行的顺序
- < script>可以定义多个
- 1.内部JS
- 注释：
- 单行注释：//注释内容
- 多行注释：/* 注释内容 */
- 数据类型：
- 原始数据类型（基本数据类型）：
- number：数字。整数 / 小数 / NaN （not a number 一个不是数字的数字类型）
- string：字符串。字符串 “abc” ，“a”，‘abc’
- boolean：true 和 false
- null：一个对象为空的占位符
- undefined：未定义。如果一个变量没有给初始化值，则会被默认赋值为undefined
- 引用数据类型：对象
- 原始数据类型（基本数据类型）：
- 变量：
- 变量：一小块存储数据的内存空间
- Java语言是强类型语言，而JavaScript是弱类型语言
- 强类型：在开辟变量存储空间时，定义了空间将来存储的数据的数据类型，只能存储固定类型的数据
- 弱类型：在开辟变量存储空间时，不定义空间将来的存储数据类型，可以存放任意类型的数据
- 语法：
- var 变量名 = 初始化值；
- 运算符：
- 一元运算符：只有一个运算数的运算符
++ - - +（正号） -（负号）- ++ - -：自增（自减）
- ++（- -）在前，先自增（自减），再运算
- ++（- -）在后，先运算，再自增（自减）
- +（-）：正负号
- 注意：在js中，如果运算数不是运算符所要求的类型，那么js引擎会自动的将运算数进行类型转换
- 其他类型转number：
- string转number：按照字面值转换，如果字面值不是数字，则转为NaN（不是数字的数字）
- boolean转number：true转为1，false转为0
- 其他类型转number：
- ++ - -：自增（自减）
- 算数运算符：
- “+”，“-”，“*”，“/”，“%”…
- 赋值运算符：
- = += -=…
- 比较运算符：
- 比较方式：
- 类型相同：直接比较
字符串：按照字典顺序比较。按位逐一比较，直到得出大小为止 - 类型不同：先进行类型转换，再比较
“===”：全等于。在比较之前，先判断类型，如果类型不一样，则直接返回false
- 类型相同：直接比较
- 比较方式：
- 逻辑运算符：
- &&：与（短路）
- ||：或（短路）
- ！：非
- 其他类型转boolean：
- number：0或NaN为假，其他为真
- string：除了空字符串（“”）。其他都是true
- null和undefined：都是false
- 对象：所有对象都为true
- 其他类型转boolean：
- 三元运算符：
- ？ ： 表达式
- var a=3;
var b=4;
var c=a>b?1:0; - 语法：
- 表达式 ？ 值1 ：值2；
- 判断表达式的值，如果是true，则取值1，如果是false，则取值2
- 一元运算符：只有一个运算数的运算符
- 流程控制语句：
- if…else…
- switch：
- 在Java中，switch语句可以接受的数据类型：byte，int，shot，char，枚举（1.5），string（1.7）
switch（变量）：
case 值： - 在JS中，switch语句也已接受任意的原始数据类型
- 在Java中，switch语句可以接受的数据类型：byte，int，shot，char，枚举（1.5），string（1.7）
- while
- do…while
- for
- JS特殊语法：
- 1.语句以；结尾，如果一行只有一条语句，则分号可以省略
- 2.变量的定义使用var关键字，也可以不使用
- 用：定义的变量是局部变量
- 不用：定义的变量是全局变量
- 与html结合方式：
- 基本语法：
//定义number类型
var num=1;
var num2=1.2;
var num3=NaN;
//输出到页面上
document.write(num+"---"+typeof(num)+"<br>");//1---number
document.write(num2+"---"+typeof(num2)+"<br>");//1.2---number
document.write(num3+"---"+typeof(num3)+"<br>");//NaN---number
//定义string类型
var str="abc";
var str2='def';
document.write(str+"---"+typeof(str)+"<br>");//abc---string
document.write(str2+"---"+typeof(str2)+"<br>");//def---string
//定义boolean
var flag=true;
document.write(flag+"---"+typeof(flag)+"<br>");//true---boolean
//定义null,undefined
var obj=null;
var obj2=undefined;
var obj3;
document.write(obj+"---"+typeof(obj)+"<br>");//null---object
document.write(obj2+"---"+typeof(obj2)+"<br>");//undefined---undefined
document.write(obj3+"---"+typeof(obj3)+"<br>");//undefined---undefined
document.write("<hr>");
//类型转换
var num=3;
var a=num++;
document.write(num);//4
document.write(a);//3
document.write("<hr>");
var b=+"abc";
alert(typeof (b));//number
alert(b);//NaN
var b=+"123abc";
document.write(typeof (b));//number
document.write(b+1);//NaN
document.write("<hr>");
var flag=+true;
var flag2=+false;
document.write(typeof (flag)+"<br>");//number
document.write(flag+"<br>");//1
document.write(flag2+"<br>");//0
var a=3;
var b=4;
document.write(a+b+"<br>");//7
document.write(a-b+"<br>");//-1
document.write(a*b+"<br>");//12
document.write(a/b+"<br>");//0.75
document.write(a%b+"<br>");//3
//比较运算符
document.write((3>4)+"<br>");//false
document.write(("abc"<"acd")+"<br>");//true
document.write(("123"==123)+"<br>");//true
document.write(("123"===123)+"<br>");//全等于 false
document.write("<hr>");
//逻辑运算符
var flag=true;
document.write(flag+"<br>");//true
document.write(!flag+"<br>");//false
document.write("<hr>");
var flag=3;//true
document.write(flag+"<br>");//3
document.write(!flag+"<br>");//false
document.write(!!flag+"<br>");//true
document.write("<hr>");
var num=3;
var num2=0;
var num3=NaN;
document.write(!!num+"<br>");//true
document.write(!!num2+"<br>");//false
document.write(!!num3+"<br>");//false
document.write("<hr>");
//string
var str1="abc";
var str2="";
document.write(!!str1+"<br>");//true
document.write(!!str2+"<br>");//false
document.write("<hr>");
//null & undefined
var obj1=null;
var obj2;
document.write(!!obj1+"<br>");//false
document.write(!!obj2+"<br>");//false
//对象
var date=new Date();
document.write(!!date+"<br>");//true
document.write("<hr>");
var obj="123";
if(obj!=null && obj.length>0)//防止空指针异常
{
alert(123);
}
//js中可以这样定义，简化书写
if(obj)//防止空指针异常
{
alert(123);
}
//三元运算符
var a=3;
var b=4;
var c=a>b?1:0;
alert(c);//0
var b;
function fun() {
b=4;
}
fun();
alert(b);//4
//switch语句
var a="abc";
switch (a) {
case 1:
alert("number");
break;
case "abc":
alert("string");
break;
case true:
alert("true");
break;
case null:
alert("null");
break;
case undefined:
alert("undefined");
break;
}
//1-100求和
var sum=0;
var num=1;
while (num<=100)
{
sum+=num;
num++;
}
alert(sum);//5050
//for循环
var sum=0;
for(var i=1;i<=100;i++)
{
sum+=i;
}
document.write(sum+"<br>");//5050
练习：九九乘法表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>九九乘法表</title>
<style>
td{
border: 1px solid;
}
</style>
<script>
document.write("<table align='center'>");
for(var i=1;i<=9;i++)
{
document.write("<tr>");
for(var j=1;j<=i;j++)
{
document.write("<td>");
document.write(i+"*"+j+"="+(i*j)+" ");
document.write("</td>");
}
//document.write("<br>");
document.write("</tr>");
}
document.write("</table>");
</script>
</head>
<body>
</body>
</html>
