一、JavaScript的三种基本使用方法:body|head|外部
网页效果:
运行代码:
.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script>
function n1(){
document.getElementById("ama01").innerHTML="NO.3这是head中的 JavaScript 函数";
}
</script>
</head>
<body>
<script>
document.write("NO.1 HELLO WORLD")//Document要小写
</script>
<p>NO.2 这是body中的JavaScript函数</p>
<button onclick="myFunction()">NO.2 Click me</button>
<p id="ama"></p>
<script>
function myFunction(){
var x="";
var time=new Date().getHours();
if (time<20){
x="Good day";
}
document.getElementById("ama").innerHTML=x;
}
</script>
<p id="ama01"></p>
<button type="button" onclick="n1()">NO.3 Click me</button>
<p>NO.4 n4保存在名为"n4.js"的外部文件中</p>
<p id="ama04"></p>
<button type="button" onclick="n4()"> NO.4 Click me</button>
<script src="n4Script.js"></script>
</body>
</html>
.n4Script.js
// JavaScript Document
function n4()
{
document.getElementById("ama04").innerHTML="NO.4 this is my 外部JavaScript";
}
二、 JavaScript的基本语法
1、写法
1)代码
document.getElementById("ama01").innerHTML=" The first one"; document.getElementById("ama02").innerHTML=" The second one";
2)代码块
function myFunction()
{
document.getElementById("ama01").innerHTML=" The first one";
document.getElementById("ama02").innerHTML=" The second one";
}
3)多余的空格会忽略
4)反斜杠对代码行进行换行
5)//单行注释,/*多行注释*/
6)赋值:文本类型用双引号,数字类型不加双引号
2、输出显示语句
1)window.alert() 弹出警告框。
<body>
<h1>window.alert() 弹出警告框</h1>
<script>
window.alert("window.alert()");
</script>
</body>
2)document.write() 将内容写到 HTML 文档中。
3)innerHTML 写入到 HTML 元素。
上文代码已展示,此处略过……
4)console.log() 写入到浏览器的控制台。
</script>
<script>
a = 1;
b = 1;
c = a + b;
console.log(c);
</script>
1、数据类型(用typeof,可以判断数据类型)
1)值类型(基本类型):
a.字符串(String):用在单引号或者双引号
b.数字(Number):数字number:整数,小数,科学计数(123e5)
c.布尔(Boolean):两种状态true or false
d.空(Null)
e.未定义(Undefined)
f.Symbol:是 ES6 引入了一种新的原始数据类型,表示独一无二的值。
2)引用数据类型(对象类型):
对象(Object):定义一个对象{a:"a1",b:"b1",c:300}
数组(Array):定义一个数组[1,2,3,9]
函数(Function):定义一个函数,前面已举例,略过
正则(RegExp):正则表达式通常用于检查和替代 : search() 和 replace();
日期(Date):当前日期时间
<script>
var a="hellow world";//字符串
var b=1;//数字
var c=true;//布尔型
let d=null;//空值
var e;//未定义
var f=Symbol('unique');
var alph=new Array("a","b","c");//创建数组;
var g={a:"a1",b:"b1", c:5566};//创建对象;
var h=Date();
var str="OH,happy new year";
var j=str.search(/happy/i);//正则表达式搜索
a1=typeof a;
b1=typeof b;
c1=typeof c;
d1=Object.is(d,null);
e1=typeof e;
f1=typeof f;
document.write(a1+"</br>",b1+"<br>",c1+"<br>",d1+"<br>",e1+"<br>",f1+"<br>",alph+"<br>",g.c+"<br>",h+"<br>",j+"<br>");
</script>
2、常量
)整型常量:可以使用16进制八进制和十进制表示其值
)实型常量:由整数部分加小数部分表示
)布尔值:
)字符型常量:用单引号或者双引号或起来的一个或几个字符
)空值:null
3、变量:它主要作为数据的存储容器,最好对其进行声明
命名所注意的点:
)只能由字母数字和下划线组成, Besides不能有空格或其他符号
)不能使用JavaScript中的关键字
NUM. grammer DESCRIPTION 1 boolean 布尔值 2 break 退出当前循环或标签语句 3 byte 字节 4 case 在switch语句中定义一个分支。 5 catch 定义在try语句块执行时,一旦发生错误,就执行的代码块。 6 char 字符类型 7 class 类 8 const 声明一个只读的常量。 9 continue 跳过当前循环的剩余部分,立即进行下一次循环。 10 debugger 设置断点,方便调试代码 11 default 在switch语句中定义默认分支。当条件不存在时使用该项 12 delete 删除了一个属性 13 do 与while一起使用,创建一个至少执行一次的循环。 14 double 双精度浮点型 15 else 与if语句一起使用,定义一个条件为假时执行的代码块。 16 enum 枚举 17 export 可以输出一个模块可以是变量或者方法 18 extends 用来创建一个普通类或者内建对象的子类 19 final 修饰用的关键词 20 finally try-catch-finally 语句是一种用于处理异常的结构,finally 关键字可以用于 finally 块中,用于定义一些必须执行的代码 21 float 解析一个字符串并返回一个浮点值 22 for 创建一个循环,包含初始化表达式、条件表达式和增量表达式。 23 function 函数 24 goto 无条件转移语句 25 if 根据指定的条件执行代码块 26 implements 实现相应接口的方法 27 import 导入另一个模块 28 in 判断某个属性是否属于某个对象。 29 instanceof 判断一个对象是否是某个类的实例。 30 int 整型 31 interface 将一个数值向下取整 32 let 声明一个块作用域的局部变量。 33 long 长整形数据 34 native Native关键字用于声明一个方法是由本地代码(通常是C或C++)实现的 35 new 创建一个新对象 36 null 空值 37 package 属性是Java解释器所知道的所有包的根 38 private @ Private标签标记标识符为私有 39 protected 创建使用程序函数 40 public 全局变量 41 ract React 是一个用于构建用户界面的 JAVASCRIPT 库。 React 主要用于构建 UI,很多人认为 React 是 MVC 中的 V(视图) 42 return 从函数返回一个值。 43 short 短整型 44 static 静态变量和类变量 45 super 终于调用父类 46 switch 根据不同的条件执行不同的代码块。 47 synchronized 实例对象锁 48 this 指向调用该方法的对象。 49 throw 抛出一个异常。 50 throws 将异常抛给调用者可以使程序能够继续执行下去 51 transient 一种持久化对象实例的机制 52 try 定义一个测试块,以测试代码块的错误 53 typeof 检测变量的数据类型。 54 var 赋值一个变量 55 void 执行一个表达式并返回undefined。空 / 声明没有返回值 56 volatile 作为指令关键字确保本条指令不会因编译器的优化而,且要求每次直接读值 57 while 当循环 58 with 设置代码在特定对象中的作用域 59 FALSE 不符合 60 TRUE 符合 )最好把变量意义与其代表意思对应