文章目录
什么是JavaScript
JavaScript是运行在浏览器上的脚本语言。简称JS。
JavaScript是网景公司（NetScape）的 布兰登艾奇（JavaScript之父）开发的，最初叫做LiveScript。
LiveScript的出现让浏览器更加的生动了，不再是单纯的静态页面了。页面更具有交互性。
在历史的某个阶段，SUN公司和网景公司他们之间有合作关系，SUN公司把LiveScript的名字修改为JavaScript。
JavaScript这个名字中虽然带有“Java”但是和Java没有任何关系，只是语法上优点类似。他们运行的位置不同，
Java运行在JVM当中，JavaScript运行在浏览器的内存当中。
JavaScript程序不需要我们程序员手动编译，编写完源代码之后，浏览器直接打开解释执行。
JavaScript的“目标程序”以普通文本形式保存，这种语言都叫做“脚本语言”。
Java的目标程序以.class形式存在，不能使用文本编辑器打开，不是脚本语言。
网景公司1998年被美国在线收购。
网景公司最著名的就是领航者浏览器：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（隶属于Java语言的，运行在JVM当中）
JS : JavaScript（运行在浏览器上。）
HTML中如何引入JavaScript
HTML中嵌入JavaScript代码的第一种方式
<!--
1、要实现以下功能：
用户单击以下按钮，弹出消息框。
2、JS是一门事件驱动型编程语言，依靠事件去驱动，然后执行对应的程序。
在JS中有很多事件，其中有一个事件叫做：鼠标单击，单词click。并且任何
事件都会对应一个事件句柄叫做：onclick。【注意：事件和事件句柄的区别是：
事件句柄是在事件单词前面加一个on】，而事件句柄是以HTML标签的属性存才
的。
3、onclick="js代码"执行原理是什么？
页面打开的时候，js代码并不会执行，只是把这段JS代码注册到了按钮的click事件上了。
等这个按钮发生click事件之后，注册在onclick后面的js代码会被浏览器自动调用。
4、怎么使用JS代码弹出消息框？
在JS中有一个内置的对象叫window，全部小写，可以直接拿来使用，window代表的是浏览器对象。
window对象有一个函数叫做alert，用法是window.alert("消息");这样就可以弹窗了。
5、JS中的字符串可以使用双引号，也可以使用单引号。
6、JS中的一条语句结束之后可以使用分号";"也可以不使用。
-->
<input type="button" value="hello" onclick="window.alert('hello js')" style="cursor: pointer;"/>
<input type="button" value="hello" onclick='window.alert("hello jscode")'/>
<input type="button" value="hello" onclick="window.alert('hello zhangsan')
window.alert('hello lisi')
window.alert('hello wangwu')"/>
<input type="button" value="hello" onclick="alert('hello zhangsan')
alert('hello lisi')
alert('hello wangwu')"/>
HTML中嵌入JavaScript代码的第二种方式
<script>
window.alert("head..........");
</script>
</head>
<body>
<input type="button" value="按钮1" />
<!--第二种方式：脚本块的方式-->
<script type="text/javascript">
/*
暴露在脚本块中的程序，在页面打开的时候执行，
并且遵循自上而下的顺序依次执行。
*/
window.alert("Hello World!!")//alert会阻塞整个HTML页面的加载
window.alert("Hello JavaScript!!!");
</script>
<input type="button" value="按钮2" />
</body>
</html>
<script>
HTML中嵌入JavaScript代码的第三种方式:引入外部独立的JS文件
js代码
window.alert("Hello Word!!!");
window.alert("js over");
html代码
<!--在需要的位置引入js脚本文件-->
<!--引入外部独立的js文件的时候，js文件中的代码会遵循自上而下的顺序依次逐行执行。-->
<!--
<script type="text/javascript" src="js/1.js"></script>
-->
<!--同一个js文件可以被引入多次。但实际开发中这种需求很少。-->
<!--
<script type="text/javascript" src="js/1.js"></script>
-->
<!--这种方式不行，结束的script标签必须有。-->
<!--
<script type="text/javascript" src="js/1.js" />
-->
<!--
<script type="text/javascript" src="js/1.js"></script>
-->
<script type="text/javascript" src="js/1.js">
// 这里写的代码不会执行。
// window.alert("Test");
</script>
<script type="text/javascript">
alert("hello jack!");
var=i;
alert("i="+i);
alert("hello jack!");
</script>
JS中的函数
JS中的函数等同于java中方法
1、JS中的变量是一种弱类型的，那么函数应该怎么定义呢？
语法格式：
第一种方式
function 函数名(形式参数列表){
函数体;
}
第二种方式：
函数名=function(形式参数列表){
函数体;
}
JS中的函数不需要指定返回值类型。
<script type="text.javascript">
function sum(a,b){
//a和b都是局部变量,他们是形参
alert(a+b);
}
//函数必须调用才能执行
//sum(10,20);
//定义一个函数sayHello
sayHello=function(username){
alert("hello "+username);
}
//调用函数
//sayHello("张三")
</script>
<input type="button" value="hello" onclick="sayHello('jack')"/>
<input type="button" value="计算10和20的和" οnclick="sum(10,20)";>
/*
java中方法有重载机制，JS中的函数能重载吗？
JS函数调用的时候，参数的类型没有限制，并且参数的个数也没有限制。
重载的含义：
方法名或者函数名一样，形参不同（个数，类型，顺序）
*/
/*
JS中函数不能重名，当函数重名的时候，后声明的函数会将之前声明的同名函数覆盖
*/
function sum(a,b,c){
return(a+b+c)
}
function sum(a,b){
return(a+b);
}
var reValue=sum(10,20,30);//30
alert(reValue);
JS中变量
javascript当中的变量
怎么声明：
var 变量名;
怎么给变量赋值
变量名=值;
javascript是一种弱类型的语言，没有编译阶段。一个变量可以随意赋值，赋什么类型的值都行
i=false;
i="abc";
i=new Object();
i=3.14
重点：JavaScript是一种弱类型编程语言。
<script type="text/javascript">
var i;
alert("i=" +i);//未定义值undefined
alert(undefined);
var k=undefined;
alert("k=" +k);
//一个变量没有声明/定义,直接访问
//alert(age); //语法错误： age is not defined(变量age不存在，不能这样写)
var a,b,c=200;
alert("a="+a)//undefined
alert("b="+b)//undefined
alert("c="+c)//undefined
a=false;
alert("a="+a)
a="abc";
alert("a="+a)
a=1.2;
alert("a="+a)
</script>
全局变量:
在函数体之外声明的变量属于全局变量，全局的生命周期：
浏览器打开是声明，浏览器关闭时销毁，尽量少用，因为全局变量会一直在浏览器的内存当中，耗费内存空间。
局部变量：
在函数体重声明的变量，包括一个函数的形参都属于局部变量
局部变量的生命周期：函数开始执行的时候局部变量的内存空间开辟，函数执行结束之后，局部变量的内存空间释放。
局部变量的生命周期较短。
//当一个变量声明的时候没有使用var关键字,那么不管这个变量再哪里声明的,都是全局变量.
function myfun(){
myname="jack";
}
myfun();
alert("myname= "+myname);
JS中数据类型
1、虽然JS中的变量在声明的时候不需要指定数据类型，但是在赋值的时候，每一个数据还是有类型的
JS中包括哪些数据类型：原始类型，引用类型
原始类型：Undefined、Number、String、Boolean、Null
引用类型：Object以及Object的子类
2、ES规范（ECMAScript规范），在ES6之后，又基于6中基本类型之外添加了一种新的类型：Symbol
3、JS中有一个运算符叫做typeof，这个运算符可以在程序的运行阶段动态的获得变量的数据类型。
typeof运算符的语法格式：
typeof 变量名
typeof运算符的运算结果是以下6个字符串之一：注意字符串全部都是小写
"undifined"
"number"
"string"
"boolean"
"object"
"function"
4、在JS中比较字符串是否相等的时候使用“==”没有equals
<script type="text/javascript">
var i;
alert(typeof i);//undefined
var k=10;
alert(typeof k);//number
var f="abc"
alert(typeof f);//string
var d=null;
alert(typeof d);//object
var flag=false;
alert(typeof flag);//boolean
function sum(a,b){
return a+b;
}
alert(typeof sum);//function
var obj=new Object();
alert(typeof obj);
</script>
Undefined
Undefined类型只有一个值，这个值就是Undefined
当一个变量没有手动赋值，系统默认赋值Undefined
或者也可以手动赋值
<script type="text/javascript">
var i;
var k=undefined;
var y="undefined";
</script>
Number
1、Number类型包括哪些值？
-1 0 1 2.2 3.14 100 NaN infinity
整数、小数、正数、负数、不是数字、无穷大都是Number类型。
2、关于isNaN函数？
用法:isNaN(数据),true表示不是一个数字,false表示是一个数字
3、parseInt()函数
4、parseFloat()函数
5、Math.ceil()函数（Math是一个数学类，数学类当中有一个函数叫做ceil()）,ceil()向上取整
//什么情况下是NaN呢？
//运算结果本来是一个数字,最后算完不是一个数字的时候,结果是NaN
<script type="text/javascript">
var a=100;
var b="中国人";
alert(a/b)
var e="abc";
var f=10;
alert(e+f);//abc10
alert(f+e);//10abc
alert(10/0);//infinity;
alert(10/3);//3.333333333333333333333335
//关于isNaN函数？
//用法:isNaN(数据),true表示是一个数字,false表示不是一个数字
alert(isNaN(a))
//parseInt();
//将字符串转换为int
alert(parseInt("3.99999"))//3
//parseFloat();
alert(parseFloat("3.14")+1)//4.14
//Math.ceil();
alert(Math.ceil(4.15));
</script>
Boolean
1、JS中的布尔类型永远只有两个值：true和false
2、在Boolean类型中有一个函数叫做:Boolean()
语法格式：
Boolean(数据)
Boolean()函数的作用将非布尔类型转换为布尔类型
<script type="text/javascript">
var username="jack";
if(username){
alert("欢迎你"+username);
}else{
alert("用户名不能为空")
}
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
for(var i=0;i<10;i++){
alert("i=" +i);
}
</script>
String
String类型：
1、在JS中字符串可以使用单引号也可以使用双引号
2、JS当中怎么创建字符串对象？
第一种：var s=“abc”;
第二种：(使用内置的支持类)var s2=new String(“abc”);
String是一个内置类，可以直接用，String的父类是Object。
3、无论是小string还是大String，他们的属性和函数都是通用的
4、关于String类型的常用属性和函数？
常用函数：
indexOf();返回第一次出现该字符串的索引
replace();返回根据正则表达式进行文字替换后的字符串的复制。
split();将一个字符串分割为子字符串，然后将结果作为字符串数组返回。
substr();返回一个从指定位置开始的指定长度的子字符串。
substring();返回位于 String 对象中指定位置的子字符串。
toLowerCase();返回一个字符串，该字符串中的字母被转换为小写字母。
toUpperCase();返回一个字符串，该字符串中的字母被转换为大写字母。
//小string(属于原始类型)
/*
var x=“abc”;
alert(typeof x);//string
//大String 属于Object类型
var y=new String("abc");//Object
alert(typeof y)
*/
<script type="text/javascript">
var x="Hello JavaScript"
var y="Java"
//indexOf();
alert(x.indexOf(y));//6
alert(x.indexOf("world"))//-1
//replace();
var xReplace=x.replace("Java","J");
alert(xReplace);
//split();
var xSplit=x.split(" ");
alert(xSplit);
//substr();
var xSubstr=x.substr(6,10);
alert(xSubstr);
//substring();
var xSubstring=x.substring(6,16);//不包含16
alert(xSubstring);
//toLowerCase();
var xtoLowerCase=x.toLowerCase();
alert(xtoLowerCase);
//toUpperCase();
var xtoUpperCase=x.toUpperCase();
alert(xtoUpperCase);
</script>
Object
Object类型：
1、Object类型是所有类型的超类，自定义的任何类型，默认继承Object
2、Object类包括哪些属性呢？
prototype属性（常用）:作用：给类动态的扩展属性和函数、
constructor属性
3、Object类包括哪些函数？
toString();
valueof();
toLocaleString();
4、在JS当中定义的类默认继承Object，会继承Object类中的所有属性以及函数。
5、在JS中怎么定义类？怎么new对象？
定义类的语法：
function 类名(形参){
}
创建对象的语法：
new 构造方法名(实参);//构造方法名和类名一致。
function sayHello(){
}
//把sayHello当做一个普通的函数来调用
sayHello();
//把sayHello当做一个类来创建对象
var obj=new sayHello();//obj是一个引用,保存内存地址在堆内存对象中.
//定义一个学生类
function Student(){
alert("Student1!!");
}
//当做普通函数来调用
Student();
//当做类来创建对象
var stu=new Student();//创建对象时执行了alert("Student1!!");
alert(stu);//[object Object]
//JS中的类的定义,同时又是一个构造函数的定义
//在JS中类的定义和构造函数的定义是放在一起定义的.
function User(a,b,c){
//声明属性(this表示当前对象)
//User中有三个属性sno\sname\sage
this.sno=a;
this.sname=b;
this.sage=c;
}
//创建对象
var u1=new User(1,"zhangsan",25);
alert(u1.sno);
alert(u1.sname);
alert(u1.sage);
var u2=new User(2,"lisi",55);
alert(u2.sno);
alert(u2.sname);
alert(u2.sage);
//访问一个对象的属性
alert(u2["sno"]);
alert(u2["sname"]);
alert(u2["sage"]);
//定义类的另一种语法
Emp=function(ename,sal){
//属性
this.ename=ename;
this.sal=sal;
}
var e1=new Emp("SMITH",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 product=new Product(1,"nike",1000);
var productPrice=product.getPrice();
alert(productPrice);
//可以通过prototype这个属性给类动态的扩展属性以及函数
Product.prototype.getPname=function(){
return this.pname;
}
//调用后期扩展的getPname()函数
alert(product.getPname());
//给String扩展一个函数
String.prototype.suiyi=function(){
alert("这是给String类扩展的一个函数");
}
//调用扩展函数
"abc".suiyi();
javascript 帮助文档
链接：https://pan.baidu.com/s/130K9P6U49l-6cizKHi9GgQ
提取码：zsy0
复制这段内容后打开百度网盘手机App，操作更方便哦
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
