JavaScript
JavaScript：是一种客户端脚本语言，是一种解释性的语言，直接嵌入HTTP页面中，浏览器对客户端脚本进行解释。通过脚本语言可以实现以编程的方式对页面元素进行控制，增加页面的灵活性。
主要特点：解释性
基于对象 、
事件驱动、
安全性、
跨平台
1.编写位置
在标签内部引入
<button οnclick="alert('button')">点一下</button>
<a href="javascript:alert('链接')">点一下</a>
在head中用script标签，
<script type="text/javascript" src="**.js"> </script> <!-- 引入外部文件 -->
<script type="text/javascript">window.οnlοad=function(){ //文档就绪后执行js代码
alert("我是内部js代码");
}
</script>
注意：js由上到下顺序执行，需要等文档就绪才开始执行js。
引入外部文件的标签中不能编写代码，即使编写了浏览器也会忽略。
2.注释
//单行注释
/*
多行注释
*/
3.语法注意事项
》 严格区分大小写
》变量是弱类型
var name="Jason";
var age=20
4.数据类型
1》数值型（number）：整形，浮点型
Number.MAX_VALUE; //能表示的最大值
var a=Infinity; //正无穷
2》字符型（string）：单引号或双引号括起来
3》布尔型
4 》转义字符
5》空值：null （表示一个为空的对象，typeof检查一个null值会返回object）
6》未定义值：undefined （当使用一个并未声明的变量，或已经声明但没有赋值的的变量）
alert("她说：\"你好\" ");
var name=“Jason”;
alert(typeof(name)); //string
》object对象
类型转换：
数值型→字符型
var a=123;
var b= a.toString();
alert(typeof(a)); //a为number类型
alert(typeof(b)); //b为string类型
字符型→数值型 （如果字符型有非数字转换为NaN）
var a="1234";
var b= Number(a);
5.变量的定义及使用
var year="2019",month="12" ,day="24";
注意：严格区分大小写，
当给未声明的变量赋值时，会自动为该变量创建一个的全局变量。
变量名都保存在栈内存中，
基本数据类型的值直接在栈内存中存储，修改一个变量的值不会影响其他的变量。
var a=123;
var b=a;
a++;
alert(a); //124
alert(b); //123
创建一个新对象在堆内存中开辟一个新空间，变量名保存的是对象的内存地址
var obj=new Object(); //obj保存堆内存中的地址
obj.name="李华"; //给对象定义一个属性
var obj2=obj; //obj2和obj保存相同的堆地址
obj.name="张三";
alert("obj:"+obj.name); //张三
alert("obj2:"+obj2.name ); //张三
6.运算符
赋值运算符
算术运算符
比较运算符
逻辑运算符
条件运算符：a>b?a:b;
字符串运算符：var="hello"+"world";
7.流程控制语句
if条件语句
switch多分支语句
for循环
while循环
8.函数
定义：函数内可以嵌套定义函数
调用：返回值可以是任意数据类型，也可以是对象，也可以是函数
<script type="text/javascript">
function add(a,b){
var result=a+b;
return result;
}
alert(add("HELLO","WORLD")); //HELLOWORLD
alert(add(5,3)); //8
</script>
立即执行函数：
( function (){
alert("我是匿名函数");
})();
工厂方法
//通过该方法创建对象
function creatStudent(name,age,gender){
//创建新对象
var student=new Object();
//添加属性
student.name=name;
student.age=age;
student.gender=gender;
return student;
}
var student1=creatStudent("李华",18,"男");
var student2=creatStudent("张三",18,"男");
console.log(student1);
console.log(student2);构造函数，也称为类
(构造函数中可以将对象共有的属性添加到构造函数的原型对象中，这样不用为每一对象添加，也不会影响全局作用域。)
//构造函数，函数名首字母一般大写
function Person(name,age,gender){
this.name=name;
this.age=age;
this.gender=gender;
}
//调用构造函数需要用new
var p1=new Person("张三",19,"男");
console.log(p1);
构造函数执行流程：1.立刻创建一个新的对象
2.将新建对象作为函数中的this，在构造函数中用this来引用新建对象
3.逐行执行函数中的代码
4.将新建的对象作为返回值返回
使用instanceof可以检查一个对象是否是一个类的实例
语法： 对象 instanceof 构造函数
原型对象prototype：
创建的每一个函数，解析器都会向函数中添加一个属性prototype，这个属性对应着一个对象即原型对象（属性值为原型对象的地址）
1.函数作为普通普通函数调用prototype没有任何作用
2.当函数以构造函数调用时，它所创建的实例中都会有一个隐含属性（__proto__），指向该构造函数的原型对象。可以通过__proto__来访问该属性。
原型对象相当于一个公共的区域，所有同一个类的实例都可以访问到这个原型对象，可以将对象共有的内容，统一设置到原型对象中。当我们访问一个对象的属性或方法时，它会先在对象自身中寻找，如果有则直接使用，如果没有则会去原型中找，找到直接使用。直到找到object对象的原型，object对象的原型没有原型，依然没有找到，返回undefined。
function MyClass(){
}
//向myclass的原型对象中添加属性
MyClass.prototype.a=123;
MyClass.prototype.name="原型中的name";
//向myclass的原型对象中添加方法
MyClass.prototype.say=function(){
alert("我是原型中的方法");
};
//创建对象
var mc=new MyClass();
mc.a="abc";
// console.log(mc.__proto__==MyClass.prototype); //true
//console.log(mc.a); //abc
mc.say();
console.log("name" in mc); //true，如果只声明，不赋值，返回false
console.log(mc.hasOwnProperty("name")); //false
用in检查对象中是否含有某个属性，对象中没有，原型中有，也会返回true。
用对象的hasOwnProperty()检查对象自己的属性。
9.事件处理
| 事件 | 当以下情况发生时，出现此事件 | FF | N | IE |
|---|---|---|---|---|
| onabort | 图像加载被中断 | 1 | 3 | 4 |
| onblur | 元素失去焦点 | 1 | 2 | 3 |
| onchange | 用户改变域的内容 | 1 | 2 | 3 |
| onclick | 鼠标点击某个对象 | 1 | 2 | 3 |
| ondblclick | 鼠标双击某个对象 | 1 | 4 | 4 |
| onerror | 当加载文档或图像时发生某个错误 | 1 | 3 | 4 |
| onfocus | 元素获得焦点 | 1 | 2 | 3 |
| onkeydown | 某个键盘的键被按下 | 1 | 4 | 3 |
| onkeypress | 某个键盘的键被按下或按住 | 1 | 4 | 3 |
| onkeyup | 某个键盘的键被松开 | 1 | 4 | 3 |
| onload | 某个页面或图像被完成加载 | 1 | 2 | 3 |
| onmousedown | 某个鼠标按键被按下 | 1 | 4 | 4 |
| onmousemove | 鼠标被移动 | 1 | 6 | 3 |
| onmouseout | 鼠标从某元素移开 | 1 | 4 | 4 |
| onmouseover | 鼠标被移到某元素之上 | 1 | 2 | 3 |
| onmouseup | 某个鼠标按键被松开 | 1 | 4 | 4 |
| onreset | 重置按钮被点击 | 1 | 3 | 4 |
| onresize | 窗口或框架被调整尺寸 | 1 | 4 | 4 |
| onselect | 文本被选定 | 1 | 2 | 3 |
| onsubmit | 提交按钮被点击 | 1 | 2 | 3 |
| onunload | 用户退出页面 | 1 | 2 | 3 |
事件处理程序的调用：
10.对象
1.内建对象：由ES标准中定义的对象
数组（Array）
//创建数组对象
var arr=new Array();
var b=[];
var c=[11,22,"a",33,44];//数组元素可以是任意的数据类型，也可以是对象
//添加元素
arr[0]=11;
arr[1]=22;
console.log(arr.length); //2
arr.length=10;
console.log(arr.length);//10
String对象
Math 对象用于执行数学任务。
Date 对象用于处理日期和时间。
//创建一个date对象
var d=new Date();
//创建一个指定的对象,格式 月/日/年 时：分：秒
var d2=new Date("12/25/2019 11:12:11");
包装类：String( ) Number( ) Boolen( )
作用是把基本数据类型装换为对象。
var num=3; //基本数据类型
var num2=new Number(3); //包装成对象
var str=new String("hello");
console.log(typeof num);//number
console.log(typeof num2);//object
String（）
在底层以字符数组的形式保存。
RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具。
创建RegExp 对象的语法： var 变量名 = new RegExp（"pattern"，"attributes"）;
参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。
参数 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，
g: 分别用于指定全局匹配、
i: 区分大小写的匹配
m: 和多行匹配。
ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。
RegExp 对象方法
| 方法 | 描述 | FF | IE |
|---|---|---|---|
| compile | 编译正则表达式。 | 1 | 4 |
| exec | 检索字符串中指定的值。返回找到的值，并确定其位置。 | 1 | 4 |
| test | 检索字符串中指定的值。返回 true 或 false。 | 1 | 4 |
方括号：
方括号用于查找某个范围内的字符：
| 表达式 | 描述 |
|---|---|
| [abc] | 查找方括号之间的任何字符。 |
| [^abc] | 查找任何不在方括号之间的字符。 |
| [0-9] | 查找任何从 0 至 9 的数字。 |
| [a-z] | 查找任何从小写 a 到小写 z 的字符。 |
//构造函数创建正则表达式的对象
var reg=RegExp("ab");//含有ab
console.log(reg.test("bcde"));//不含ab，返回false
console.log(reg.test("helAb"));//不含ab，返回false
var reg=RegExp("ab","i");//
console.log(reg.test("bacdeAb"));//忽略大小写，返回true
//使用字面量创建正则表达式
//[]中是或的关系
var reg2=/[a-d]/;//是否有a或b或c或d
console.log(reg2.test("aghj"));//true元字符（Metacharacter）是拥有特殊含义的字符：
| 元字符 | 描述 |
|---|---|
| . | 查找单个字符，除了换行和行结束符。 |
| \w | 查找单词字符。任意字母、数字、下划线 |
| \W | 查找非单词字符。除字母、数字、下划线之外的字符 |
| \d | 查找数字。【0-9】 |
| \D | 查找非数字字符。 |
| \s | 查找空白字符。空格 |
| \S | 查找非空白字符。 |
| \b | 匹配单词边界。 |
| \B | 匹配非单词边界。 |
| \0 | 查找 NUL 字符。 |
| \n | 查找换行符。 |
| \f | 查找换页符。 |
| \r | 查找回车符。 |
| \t | 查找制表符。 |
| \v | 查找垂直制表符。 |
| \xxx | 查找以八进制数 xxx 规定的字符。 |
| \xdd | 查找以十六进制数 dd 规定的字符。 |
| \uxxxx | 查找以十六进制数 xxxx 规定的 Unicode 字符。 |
/*检查一个字符串是否有.
.代表任意字符，在正则表达式中\作为转义字符，
\.表示.
\\表示\
注意：使用构造函数时，要使用\需要用\\来表示
*/
var reg=/\./;
console.log(reg.test("abc.de"));
reg2=new RegExp("\\.");
console.log(reg2.test("abc.de"));
/*检查字符串中是否有单词child*/
reg=/\bchild\b/;
console.log(reg.test("hello children"));
console.log(reg.test("hello child"));
//去除字符串中的空格
var str=" abc 123 ";
//使用“”替换
console.log( str.replace(/\s/g, ""));//abc123量词：设置内容出现的次数，可以用括号（）括起一个整体
| 量词 | 描述 |
|---|---|
| n+ | 匹配任何包含至少一个 n 的字符串。 |
| n* | 匹配任何包含零个或多个 n 的字符串。 |
| n? | 匹配任何包含零个或一个 n 的字符串。 |
| n{X} | 匹配包含 X 个 n 的序列的字符串。 |
| n{X,Y} | 匹配包含 X 至 Y 个 n 的序列的字符串。 |
| n{X,} | 匹配包含至少 X 个 n 的序列的字符串。 |
| n$ | 匹配任何结尾为 n 的字符串。 |
| ^n | 匹配任何开头为 n 的字符串。 |
| ?=n | 匹配任何其后紧接指定字符串 n 的字符串。 |
| ?!n | 匹配任何其后没有紧接指定字符串 n 的字符串。 |
支持正则表达式的 String 对象的方法
| 方法 | 描述 | FF | IE |
|---|---|---|---|
| search | 检索与正则表达式相匹配的值。返回位置，没有返回-1 | 1 | 4 |
| match | 找到一个或多个正则表达式的匹配。返回字符 | 1 | 4 |
| replace | 替换与正则表达式匹配的子串。 | 1 | 4 |
| split | 把字符串分割为字符串数组。 | 1 | 4 |
/*split（）*/
var str="1a2b3c4d5e6f";
var result=str.split("c");//用c把字符串分割成字符串数组
console.log(result);//Array [ "1a2b3", "4d5e6f" ]
var reg=/[a-z]/;
var result2=str.split(reg);//传递正则表达式作为参数
console.log(result2);//Array(7) [ "1", "2", "3", "4", "5", "6", "" ]
/*search（）返回值stringObject 中第一个与 regexp 相匹配的子串的起始位置。即使用g也只会匹配第
一个 如果没有找到任何匹配的子串，则返回 -1。*/
var str2="hello abc world";
console.log(str2.search("abd"));//-1
console.log(str2.search("ab"));//6
/*match(),将匹配到的结果以数组返回*/
console.log(str.match(/[a-z]/));//Array [ "a" ]
console.log(str.match(/[a-z]/g));//Array(6) [ "a", "b", "c", "d", "e", "f" ]
2.宿主对象：由JS的运行环境提供的对象，目前主要指由浏览器提供的对象
例如BOM,DOM
Window对象
Window 对象表示一个浏览器窗口或一个框架。在客户端 JavaScript 中，Window 对象是全局对象，所有的表达式都在当前的环境中计算。也就是说，要引用当前窗口根本不需要特殊的语法，可以把那个窗口的属性作为全局变量来使用。例如，可以只写 document，而不必写 window.document。同样，可以把当前窗口对象的方法当作函数来使用，如只写 alert()，而不必写 Window.alert()。
Window 对象方法
| 方法 | 描述 |
|---|---|
| alert() | 显示带有一段消息和一个确认按钮的警告框。 |
| blur() | 把键盘焦点从顶层窗口移开。 |
| clearInterval() | 取消由 setInterval() 设置的 timeout。 |
| clearTimeout() | 取消由 setTimeout() 方法设置的 timeout。 |
| close() | 关闭浏览器窗口。 |
| confirm() | 显示带有一段消息以及确认按钮和取消按钮的对话框。 |
| createPopup() | 创建一个 pop-up 窗口。 |
| focus() | 把键盘焦点给予一个窗口。 |
| moveBy() | 可相对窗口的当前坐标把它移动指定的像素。 |
| moveTo() | 把窗口的左上角移动到一个指定的坐标。 |
| open() | 打开一个新的浏览器窗口或查找一个已命名的窗口。 |
| print() | 打印当前窗口的内容。 |
| prompt() | 显示可提示用户输入的对话框。 |
| resizeBy() | 按照指定的像素调整窗口的大小。 |
| resizeTo() | 把窗口的大小调整到指定的宽度和高度。 |
| scrollBy() | 按照指定的像素值来滚动内容。 |
| scrollTo() | 把内容滚动到指定的坐标。 |
| setInterval() | 按照指定的周期（以毫秒计）来调用函数或计算表达式。 |
| setTimeout() | 在指定的毫秒数后调用函数或计算表达式。 |
Screen 对象包含有关客户端显示屏幕的信息。
Location 对象包含有关当前 URL 的信息。Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。
History 对象包含用户（在浏览器窗口中）访问过的 URL。History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。
3.自定义对象：开发人员自己创建的对象
//创建对象
var student=new Object();
//向对象中添加属性
student.name="李华";
student.age=18;
//读取属性值
alert(student.name);
//删除对象属性
delete student.age;//使用对象字面量，可以在创建对象时直接指定对象的属性，使用特别的属性名时可以给名加上双引号
var obj = {
name:"李华",
age:24,
sex:"man",
birthday:{year:1995,month:5,day:15}
} ;
console.log(obj);
alert("month:"+obj.birthday.month);注意：属性值可以是基本数据类型，也可以说是对象数据类型
var obj=new Object();
obj.name="张三";
obj.age=24;
obj.sayname=function(){
console.log("大家好，我是"+obj.name);
}
obj.sayname();注意：属性值可以是个函数，称这个函数为对象的方法。
属性名：
student["123"]=789;
student["class"]="计算机技术1班";
var n="class";
console.log(student[n]);
检查对象中是否有某属性："属性名" in 对象
console.log("age" in student); //返回true或false
this：
解析器调用函数每次都会向函数内部传递一个隐含的参数this，this指向一个对象，根据调用方式的不同，this会指向不同的对象。
1.以函数形式调用，this永远都是window
2.以方法形式调用，this就是调用方法的那个对象
3.以构造函数的形式调用时，this就是新建的那个对象
4.使用call（）和apply（）调用时，this指的是指定的对象
function fun(){
alert(this.name);
}
var obj1={name:"obj1"};
var obj2={name:"obj2"};
fun.call(obj1); //obj1
fun.apply(obj2); //obj2
封装实参的对象arguments
是一个类似数组的对象，可以通过索引操作数据，也可以获取长度。调用函数时传递的实参都会在arguments中保存，arguments.length就是实参的个数。
