ECMAScript
1.JavaScript是运行在浏览器上的脚本语言。简称JS.;小故事在文章最后，先上硬菜
2.js是一门事件驱动型的编程语言，依靠事件去驱动，然后执行对应的程序。
在js中有很多事件，其中有一个事件叫做:鼠标单击，单词：click。并且任何事件都会对应
一个事件句柄叫做：onclick.【注意；事件和事件句柄的区别是：
事件句柄是在事件单词前添加一个on.】,而事件句柄是以HTML标签属性存在的。
3.οnclick=“js代码”，执行原理是什么？
页面打开的时候，js代码并不会执行，只是把这段js代码注册到按钮的click事件上了。
等于这个按钮发生click事件之后，注册在onclick后面的js代码会被浏览器自动调用。
4、怎么使用js代码弹出消息框？
在js中有一个内置的对象叫做window，全部小写，可以直接拿来使用，window代表的是浏览器对象。
window对象有一个函数叫做：alter,用法是：window.alter(“消息”)；这样就可以设置弹窗了。
5、js中的字符串可以使用双引号，也可以使用单引号。
6、js中的一条语句结束之后可以使用分号";"也可以不用。
引入js的方式
一、直接在标签上加入事件句柄
<input type="button" name="" id="" value="hello" onclick='window.alert("hello js")' />
二、脚本块
<script type="text/javascript">
/*
* 暴露在脚本块中的代码会在页面打开的时候执行
* 并且遵守自下而上的顺序依次执行 这个代码执行不需要事件
* 在一个页面当中可以出现多次，没有要求
* 出现的位置也没有要求，随意
*/
window.alert("hello word");//alter函数会阻塞当前页面加载作用（直到用户点击确认）
</script>
三、引入外部js文件
<!--
在需要的位置引入js脚本文件
引入外部独立的js文件的时候js文件中的代码会遵循自上而下的顺序依次逐行执行
引入文件时js中的代码时不会执行的
-->
<script type="text/javascript" src="js/1.js">
//这里写代码不会执行
window.alert("test");
</script>
JS变量
byte short int long float double boolean char
12484812
怎么声明变量？
var 变量名；
怎么给变量赋值？
变量名 = 值；
JavaScript是一种弱类型语言，没有编译阶段，一个变量可以随意赋值，赋什么类型的值都行
var i = 100；
i = 3.14；
<script type="text/javascript">
/*
回顾Java中的变量：
1、Java中怎么定义/声明变量？
数据类型 数据名：
例如：
int i;
double d;
boolean flag;
2、Java中的变量怎么赋值？
使用“=”运算符进行赋值运算（"="运算符右边先执行，将右边执行的结果赋值给左边的变量。）。
变量名 = 值；
例如：
i = 10;
d = 3.14;
flag = false;
3、Java语言是一种强类型语言，强类型怎么理解？
Java语言存在编译阶段，假设代码：int i;
那么在Java中有一个特点：Java程序编译阶段就已经确定了i变量的数据类型，该i变量的
数据类型在编译阶段是int类型，那么这个变量到最终内存释放，一直都是int类型，不可能变成
其他类型
int i = 10;
double d = i;这行代码是说明一个新的变量d,double类型，把i变量中保存的值传给d.
i = "abc";这行代码编译的时候会报错，因为i变量的数据类型是int类型，不能将字符串赋给i。
Java中要求变量声明的时候是什么类型，以后永远都是这种类型，不可变。编译期强行固定变量的数据类型
称为强类型语言。
*/
//在js中，当一个变量没有手动赋值的时候，系统会默认赋值undefined
var i;
//undefined 在js中是一个具体存在的值
alert("i="+i);//i=undefined
alert(undefined);
var k = undefined;
alert("k="+k);
//一个变量没有声明/定义直接访问？
//alter(age);//语法错误 alter is not defined
var a, b, c=200;
alert(a+"=a");
alert(b+"=b");
alert(c);
a = false;
alert(a);
a = "abc";
alert(a);
a = 1.2;
alert(a);
</script>
JS函数
JS函数： 等同于Java语言中的方法，函数也是一段可以被重复利用的代码片段。函数一般都是可以完成某个特定功能的。（等同于Java中的方法，这里叫函数）
语法格式：
语法格式；
第一种方式；
function 函数名（形式参数列表）{
函数体；
}
第二种方式：
函数名 = function（形式参数列表）{
函数体；
}js中函数不需要指定返回值类型，返回什么类型都行。
<script type="text/javascript">
function sum(a, b){
//a和b都是局部变量，他们都是形参（a和b都是变量名，变量名随意。）
alert(a+b);
}
//函数必须调用才会执行
//sum(1,2);
//定义函数sayHello
sayHello = function(userName){
alert("useName="+userName);
}
//sayHello("zhangsan");
</script>
<input type="button" value="hello" onclick="sayHello('zhangsan')"/>
<script type="text/javascript">
/*
* Java方法有重载机制，js函数有重载吗？
* js当中的函数在调用的时候，参数的类型没有限制，并且参数的个数也没有限制，js就是这么随意（弱类型）
* 重载的含义；
* 方法名或者函数名一样，形式参数不一样（个数，类型，顺序）；
*/
function sum(a,b){
return a+b;
}
//调用函数
var retValue = sum(1,3);
alert(retValue);
var retValue2 = sum("jack");
alert(retValue2);//jackundefined字符串的拼接
var retValue3 = sum();
alert(retValue3);//NaN(NaN是一个具体存在的值 Not a Number,不是一个具体存在数字)
var retValue4 = sum(1, 2, 3);
alert(retValue4);
//两个同名函数就近原则，后一个声明会把先声明的覆盖掉
/*
* js中，函数的名字不能重名，当函数重名时后一个会把先一个覆盖
*
*/
function test1(userName){
alert("test1");
}
function test1(){
alert("test1 test1");
}
test1("jack");//调用alert("test1 test1");
</script>
全局变量
全局变量：
在函数体之外声明的变量属于全局变量，全局变量的生命周期是：
浏览器打开时声明，浏览器关闭时销毁，尽量少用。因为全局变量会一直在浏览器的内存中，耗费内存空间。能使用局部变量尽量使用局部变量
局部变量：
在函数体当中声明的变量，包括一个函数的形参都属于局部变量，
局部变量的生命周期是，函数开始执行时局部变量的内存空间开辟，函数执行结束时局部变量的内存空间释放
局部变量生命周期较短。
<script type="text/javascript">
//全局变量
var i = 100;
function aceesI(){
//访问的是全局变量
alert("i="+i);
}
aceesI();
//全局变量
var username = "Jack";
function accessUsername(){
//局部变量
var username = "luvcy";
//就近原则：访问局部变量
alert("username="+username);
}
//访问局部变量
accessUsername();
//访问全局变量
alert(username);
function accessAge(){
var age = 20;
alert("age"+age);
}
//报错（语法不对）
//alert("age"+age);
//以下语法很奇怪
function myFun(){
//当一个变量声明的时候没有使用var关键字，那么不管这个变量在哪里声明的，都是全局变量
myName = "nihao";
}
myFun();
alert("myName="+myName)
</script>
JS数据类型
- **JS中数据类型有：**原始数据类型、引用数据类型。
原始类型：Undefined、Number、String、Boolean、Null
引用类型：Object以及Object子类。 - ES规范(ECMAScript规范)，在ES6之后，又基于以上的6种类型之外添加了一种新的类型：Symbol
- JS中有一个运算符叫做typeof,这个运算符可以在程序的运行阶段动态的获取变量的数据类型。
typeof运算符的语法格式：
typeof 变量名
typeof运算符的运算结果是以下6个字符串之一：注意字符串全部都是小写
“undefined”
“number”
“string”
“boolean”
“object”
“function” - 在JS当中比较字符串是否相等"=="完成，没有equals。
<script type="text/javascript">
var i;
alert(typeof i);//undefined
var k = 1;
alert(typeof k);//"number"
var f = "abc";
alert(typeof f);//"string"
var d = null;
alert(typeof d);//"object" null属于Null类型，但是typeof运算符的结果是"object"
var flag = false;
alert(typeof flag);//"boolean"
var obj = new Object();
alert(typeof obj);//"object"
function sayHello(){
}
alert(typeof sayHello);//"function"
</script>
1. undefined
Undefined类型只有一个值，这个值就是undefined
当一个变量没有手动赋值，系统默认赋值undefined
或者也可以给一个变量手动赋值undefined
2. Number
1、Number类型包括那些值？
-1 0 1 2.3 100 … NaN Infinty
整数、小数、正数、负数、不是数字、无穷大都属于Number类型。
2、isNaN():结果是true表示不是一个数字，结果是false表示一个数字
3、parseInt()函数：可以将字符串自动转换成数字，并且取整数位
4、parseFloat()函数:可以将字符串自动转化为数字
5、Math.ceil()函数（ Math是一个数学类，数学类当中有一个函数叫做ceil(),作用是向上取整）Infinity(当除数为0的时候，结果为无穷大)
3. Boolean
1、JS中的Boolean类型永远只有两个值，true 和 false(这一点和Java相同)
2、在Boolean类型中有一个函数叫做:Boolean()。
语法格式：
Boolean(数据)
Boolean()函数的作用是将非布尔类型转换成布尔类型。
<script type="text/javascript">
//规律："有"就转换成true，"没有"就转换成false
alert(Boolean(1));//true
alert(Boolean(0));//false
alert(Boolean(""));//false
alert(Boolean("abc"));//true
alert(Boolean(null));//false
alert(Boolean(NaN));//false
alert(Boolean(undefined));//false
alert(Boolean(Infinity));//true
//Null类型只有一个值，null
alert(typeof null);//"object"
</script>
4. String
1、在JS当中字符串可以使用单引号，也可以使用双引号。 var s1 = 'abc'; var s2 = "abc"; 2、在JS当中，怎么创建字符串对象呢？ 两种方式： 第一种：var s = "abc"; 第二种(使用JS内置的支持类String)：var s2 = new String("abc"); 需要注意的是：String是一个内置类，可以直接使用，String的父类是Object。 3、无论小string还是大String它们的函数都是通用 4、关于String类型的常用属性和函数？ 常用属性： length 获取字符串长度 常用函数： indexOf 获取当前字符串在当前字符串中第一次出现处的索引 lastIndexOf 获取当前字符串在当前字符串中最后一次出现处的索引 replace 替换(注意只替换了第一个) substr 截取字符串 substring 截取字符串 toLowerCase 转换小写 toUpperCase 转换大写 split 拆分字符串
5. Object类型：
1、Object类型是所有类型的超类，自定义的任何类型，默认继承Object 2、Object类包括那些属性？ protopyte 属性（常用的 主要是这个） 作用是给类动态的扩展属性和函数 constructor 属性 3、Object类包括那些函数 toString() valueOf() toLocalString() 4、在JS当中定义的类默认继承Object，会继承Object类中所有属性和函数。 换句话说自己定义的类中也有protopyte属性 5、在JS中怎样定义类？怎么new对象 定义类的语法： 第一种方式： function 类名(形参){ } 第二种方式： 类名 = function(形参){ } 创建对象的语法： new 构造方法名(实参);//构造方法名和类名一致。
<script type="text/javascript">
function sayHello(){
}
//把sayHello当作一个普通的函数来调用
sayHello();
//这种方式就表示把sayHello当作一个类来创建对象，
var sc = new sayHello();
//定义一个学生类
function Student(){
alert("Student....");
}
//当作普通函数调用
Student();
//当做类来创建对象
var stu = new Student();
alert(stu)
//JS中类的定义，同时又是一个函数的定义
//在JS中类的定义和构造函数定义是放一起来完成的
function User(a, b, c){ //a,b,c属于形参，是局部变量
//声明属性(this当前对象)
//this类中有三个属性 ：sno/sname/sage
this.sno = a;
this.sname = b;
this.sage = c;
}
//创建对象
var u1 = new User(1, "zhangsan", 18);
//访问对象的属性
alert(u1.sno);
alert(u1.sname);
alert(u1.sage);
//访问对象的属性，还可以使用这种语法
var u2 = new User(2, "jack", 33);
alert(u2["sno"]);
alert(u2["sname"]);
alert(u2["sage"]);
//定义类的另一种语法
Emp = function(ename, sal){
//属性
this.ename = ename;
this.sal = sal;
}
var e1 = new Emp("SNMS",800);
alert(e1["ename"]+"，"+e1.sal);
product = function(pno, pname, price){
//属性
this.pno = pno;
this.pname = pname;
this.price = price;
//函数
this.getPrice = function(){
return this.price;
}
}
var pro = new product(1, "黄瓜", 4.1);
var pri = pro.getPrice();
alert(pri);//4.1
//可以通过prototype这个属性来给类动态扩展属性以及函数
product.prototype.getPname = function(){
return this.pname;
}
//调用后期扩展的getPname()函数
alert(pro.getPname());
//给String扩展一个函数
String.prototype.suibian = function(){
alert("这是给Sting类型扩展的函数叫suibian..");
}
"abc".suibian();
</script>
null NaN undefined三者之间的区别
==是等同运算符
null NaN undefined 数据类型不同
== (等同运算符：值判断值是否相等)
=== (全等运算符：既判断值是否相等，又判断数据类型是否相等)
<script type="text/javascript">
//==是等同运算符
alert(1 == true);//true
alert(1 === true);//false
//null NaN undefined 数据类型不同
alert(typeof null);//object
alert(typeof NaN);//number
alert(typeof undefined);//undefined
//null和undefined是可以等同的
alert(null == NaN);//false
alert(null == undefined);//true
alert(NaN == undefined);//fals
alert(null === NaN);//false
alert(null === undefined);//false
alert(NaN === undefined);//false
</script>
常用事件（背）
JS中的事件：
（1）blur 失去焦点
（2）change 下拉列表中项改变，或文本框内容改变
（3）click 鼠标单击
（4）dblclick 鼠标双击
（5）focus 获得焦点
（6）keydown 键盘按下
（7）keyup 键盘弹起
（8）load 页面加载完毕
（9）mousedown 鼠标按下
（10）mouseover 鼠标经过
（11）mousemover 鼠标移动
（12）mouseout 鼠标离开
（13）mouseup 鼠标弹起
（14）reset 表单重置
（15）select 文本被选中
（16）submit 表单提交
任何一个事件都会对应一个事件句柄，事件句柄就是在事件前添加on.
onXXX这个事件句柄出现在一个标签的属性位置上。
<!--注册事件的第一种方式，直接在标签中使用事件句柄-->
<input type="button" value="hello" onclick="sayHello()" />
<input type="button" value="hello2" id="mybtn" />
<input type="button" value="hello3" id="mybtn1" />
<input type="button" value="hello4" id="mybtn2" />
<script type="text/javascript">
function doSome(){
alert("do some...");
}
/*
第二种注册事件的方式，是使用纯JS代码完成事件的注册。
*/
//第一步：先获取这个按钮对象(document是全部小写，内置对象，可以直接用，document就代表整个HTML页面)
var btnObj = document.getElementById("mybtn");
//第二步：给按钮对象的onclick属性赋值
btnObj.onclick =doSome;// 回调函数 注意：千万别加小括号btnObj.onclick =doSome();这是错误的写法
//将回调函数doSome注册到click事件上
//id为mybtn1的按钮
var btnObj1 = document.getElementById("mybtn1");
btnObj1.onclick = function(){ //这个函数没有名字，叫做匿名函数，这个匿名函数也是一个回调函数
alert("你好啊"); //这个函数在页面打开时只是注册上，不会被调用，在click事件发生之后才会调用
}
//id为btn2的按钮
document.getElementById("mybtn2").onclick = function(){
alert("一行就搞定");
}
</script>
代码执行顺序
load事件什么时候发生？页面全部元素加载完之后才会发生 ，不加onload事件句柄程序自上而下执行获取不到id="btn"的按钮
<script type="text/javascript">
/*window.onload = ready;
function ready() {
var btn = document.getElementById("btn");
btn.onclick = function() {
alert("btn....");
}
}*/
//上面代码变形
//页面加载的过程中，将a函数注册给了load事件
//页面加载完毕之后load事件发生了，此时执行回调函数
//回调函数a执行的过程中，把b函数注册给了id="btn"的click事件
window.onload = function(){//这个回调函数叫做a
document.getElementById("btn").onclick = function() {//这个回调函数叫做b
alert("btn....");
}
}
</script>
<input type="button" id="btn" value="hello" />
- js设置标签属性
<script type="text/javascript">
window.onload = function(){
document.getElementById("btn").onclick = function(){
var mytext = document.getElementById("mytext");
mytext.type = "checkbox"
}
}
</script>
<input type="text" id="mytext" />
<input type="button" id="btn" value="将文本框修改为复选框" />
- 捕捉回车键
<script type="text/javascript">
window.onload = function(){
//回车键的键值是13
//ESC键的键值是27
document.getElementById("username").onkeydown = function(event){//形参是随意的
//获取键值
//对于"键盘事件对象"来说，都由keyCode属性用来获取键值
//alert(event);//[object KeyboardEvent]
//alert(event.keyCode);//数字
if(event.keyCode==13){
alert("正在进行校验。。。")
}
}
}
</script>
<input type="text" id="username" />
- void运算符
<h1>页面顶部</h1>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<!--
void运算符的语法：void(表达式)
运算原理：执行表达式，但不返回任何结果
javascript:void(0)
其中javascript：作用是告诉浏览器后面是一段js代码
以下程序的javascript：是不能省略的
-->
<a href="javascript:void(0)" onclick="window.alert('test code')">既保留住超链接的样式，同时用户点击该超链接的时候执行一段JS代码，但页面不能跳转</a>
<br />
<a href="javascript:void(0)" onclick="false">2.既保留住超链接的样式，同时用户点击该超链接的时候执行一段JS代码，但页面不能跳转</a>
<br />
<!--
void()方法的小括号必须有表达式
-->
<a href="javascript:void()" onclick="window.alert('test code')">3既保留住超链接的样式，同时用户点击该超链接的时候执行一段JS代码，但页面不能跳转</a>
- js控制语句
<script type="text/javascript">
/*
1、if
2.switch
3.while
4.do..while
5.for循环
6.break
7.countinue
JS中其他
8 for..in语句(了解)
9 with 语句(了解)
*/
//创建JS数组
var arr = [false,null,undefined,1,"abc",3.14];
//遍历数组
for (var i = 0; i<arr.length; i++) {
alert(arr[i]);
}
//for..in
for (var i in arr) {
alert(arr[i]);
}
//for..in语句可以遍历对象的属性
User = function(username, password){
this.username = username;
this.password = password;
}
var u = new User("张三","1414");
alert(u.password+","+u.username);
alert(u["username"]+","+u["password"]);
for (var shuXingMing in u) {
//alert(shuXingMing);
//alert(typeof shuXingMing);//string
alert(u[shuXingMing]);
}
//with
alert(u.username);
alert(u.password);
with(u){
alert(username+"+"+password)
}
</script>
1、什么是JavaScript,有什么用？
JavaScript是运行在浏览器上的脚本语言。简称JS.
JavaScript是网景公司（Netscape）的 布兰登艾奇（JavaScript之父）开发的，最初叫做Livescript.
LiveScript的出现让浏览器更加生动了，不在单纯的静态页面了。页面更具有交互性。
在历史的某个阶段，SUN公司和网景公司他们之间有合作关系，SUN公司把LiveScript的名字修改为Javascript。
JavaScript名字中虽然有Java但是和Java没有任何关系，只是语法上有点类似。他们运行的位置不同，Java运行在JVM当中，JavaScript运行在浏览器的内存当中。
JavaScript程序不需要我们程序员手动编译，编写完源代码之后，浏览器直接打开解释执行。
JavaScript的"目标程序"以普通文本形式保存，这种语言都叫做"脚本语言"。
Java的目标程序已.class形式存在，不能使用文本编辑器打开，不是脚本语言。
网景公司目前被美国在线收购。
网景公司最著名的就是领航者浏览器：Navigator浏览器。
LiveScript的出现，最初的时候是为Navigator浏览器量身定制一门语言，不支持其他浏览器。
当Navigator浏览器使用非常广泛的时候，微软害怕了，于是微软在最短的时间内组建了一个团队，开始研发只支持IE浏览器的脚本语言，叫做JScript.
JavaScript和JScript并存的年代，程序员是很痛苦的，因为程序员要写两套程序。
在这种情况下，有一个非营利性组织站起来了，叫做ECMA组织（欧洲计算机协会）
ECMA根据JavaScript制定了ECMA-262号标准，叫做ECMA-Script。
现代的JavaScript和Jscript都实现了ECMA－Script规范。（JavaScript和Jscript统一了）
以后大家会学习JSP 和js不一样
jsp:javaserver Pages
js:JavaScript
436
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
