JavaScript是一种运行在浏览器中的解释型的编程语言
一、简介
js:javascript是基于对象【哪些基本对象呢】和和事件驱动【哪些主要事件呢】的语言,应用在客户端(注意与面向对象的区分)
js的三大特点:
交互性:信息的动态交互
安全性:不能访问本地磁盘的文件
跨平台性:能支持js的浏览器都能运行
JavaScript 对大小写敏感
与java的区别:(只是长得像而已,雷锋&雷峰塔)
1.不同公司开发的语言,java:Oracl js:网景公司
2.java:面向对象 js:基于对象(已经有很多存在可以直接使用的对象)
3.java:强类型语言 js:弱类型语言
4.java:需要先编译再运行 js:不需要
js的组成:
ECMAScript
ECMA:欧洲计算机组织 基本语法
BOM
Broswer Object Model 浏览器对象模型
DOM
Document Object Model 文档对象模型
用以访问 HTML 元素的正式 W3C 标准
二、与HTML两种结合方式(建议放在</body>后)
1.使用script标签 <script type="text/javascript"> js代码 </script>
那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript"。
现在已经不必这样做了。JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。
2.使用script标签,引入外部js文件 <script type="text/javascript" src="js文件路径">【此处应为空】</script>
提示:外部脚本不能包含 <script> 标签。
请使用 document.write() 仅仅向文档输出写内容。
如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖:
三、基本语法(注释同java)
1.原始类型和变量声明:
五个数据类型:【string——详细方法,参见菜鸟教程。 number boolean】 null undifined
JavaScript 变量有很多种类型,但是现在,我们只关注数字和字符串
极大或极小的数字可以通过科学(指数)计数法来书写:
使用var进行变量定义,使用typeof(变量名);查看当前变量类型
var data=new Data(); 拿到对象引用,null表示引用为空,父类都为Object
类型转换可以使用对应的方法:String(x),Number(x)
2.js的语句:
if判断语句(同java)
switch语句,弱类型,都支持 switch(){
case:
break;
case:
break;
}
循环语句 for while do{}while 类似java
3.js的运算符:
与java不同的,由于是弱类型,var i=1;1/10*10=1(不是java的0)
字符串+同java的拼接 相减时会真正执行(非数字报错NaN)- var str="2" str-1=1;
boolean类型也可以进行加减运算,true为1 false为0
== :等于,只判断值,与类型无关
=== :全等,检测值和类型
向页面输出:document.write();输出值或者HTML代码 ("aaa") ("<hr/>") 对应99乘法表案例
4.js的数组:
弱类型,存取数据无类型要求
表示方法: var arr=[1,"aa",true];
使用内置对象Array var arr1=new Array(5),长度为5; 取同java arr1[0]=1;
var arr2=new Array(3,4,5);为具体元素
长度属性:length 如arr.length
5.js的函数:【写完方法记得调用,注意单双引号和分号的使用】
定义方式:使用function关键字:function 函数名(参数列表){} 返回值可选
调用方法:函数名(参数列表);参数列表不带类型
弱类型语言,无需类型
function add(a,b){ var sum=a+b; alert(sum);}
add(2,3);
匿名函数:function(){} 调用 var add3=function(){} add3(5,6);
与上一种类似
动态函数:【作了解】使用内置对象Function new Function("参数列表","方法体和返回值");
使用方式同上,参数列表 方法体可以提出来写
6.js的全局变量和局部变量
全局变量:在一个script中定义一个变量,全局js页面中都可以使用。(其它的script也可以)
**IE中调试工具,按F12
7.script标签的放置的位置:
理论上是全局都可以(包括HTML标签后)
原则:放在</body>后面,由于HTML是由上到下解析,可以保证获取到HTML中的值等。
8.js的重载:
js中是不支持重载的,原因是js中识别函数的唯一方法就是函数的函数名
如想模拟java的重载,可以通过函数体中队参数的判断进行模拟
9. JavaScript 对象
对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔:
var person={firstname:"Bill", lastname:"Gates", id:5566};
当然也可以new一个自己的 var person = new Object();
当您像这样声明一个 JavaScript 变量时:
var txt = "Hello";
您实际上已经创建了一个 JavaScript 字符串对象。字符串对象拥有内建的属性 length。
对于上面的字符串来说,length 的值是 5。字符串对象同时拥有若干个内建的方法
JS对象:
一、string对象,类似于java两种创建方式(栈中或者堆中)HTML不区分大小写,JS区分
属性和方法:length属性 如 str.length
方法:1.与HTML相关的方法:
bold()方法:加粗。 如str.bold();
fontcolor()方法:字体颜色。如str.fontcolor("red");
fontsize()方法:字体大小。如str.fontsize(2);
link()方法:字符串显示为连接。如str.link("链接地址");str为链接显示内容
sub()与sup()方法:设置上标与下标
2.与java相似的方法:
concat()方法:连接字符串。如str.concat("a");
charAt()方法:返回指定位置字符 str.charAt(2);超出为空(非null)
indexOf()方法:返回位置,没有返回-1;
split()方法:将字符串切分为字符数组(从分隔符处分割为数组元素
replace方法:替换,如str.replace("原始值","新值");
substr()与substring():取子字符串
二、Array对象,创建方法见初识JS
属性和方法:length属性 如arr.length
方法:concat()方法:连接数组,返回一个新合成的数组
join()方法:使用指定连接符,返回元素连接而成的字符串
push()方法:向数组末尾添加新元素,并且返回新的数组长度,若加的是数组,
新返回的长度仍是原长度加1,加入的视为一个元素!
pop()方法:删除最后一个元素并返回该元素
reverse()方法:颠倒数组元素顺序(改变原数组)
三、Date对象,创建 var date=new Date();类同java
方法:toLocaleString()方法:格式化方法
得到年,推荐getFullYear()方法
得到月,使用getMonth()方法,注意返回范围0-11
得到星期,使用getDay()方法,返回0-6,从周日开始
得到日,使用getDate()方法,范围1-31,正常
得到小时,getHours()方法,分秒同理
getTimes()方法:返回1970年1月1日至今的毫秒数
应用场景:使用毫秒数来处理缓存
四、Math对象,类似java也是静态方法,通过类名来调用,如Math.ceil(100.2);
方法:Math.ceil()方法:向上取整
Math.floor()方法:向下取整
Math.round()方法:四舍五入
Math.random()方法:得到随机数,同java,0.0到1.0之间的伪随机数
五、全局函数,由于全局函数不属于任何一个对象,直接写函数名使用
方法:eval();执行js代码 ,var str = "alert("1122")"";eval(str);
encodeURI:对字符编码,encodeURI(str);返回编码值
decodeURI:对字符解码,为上述逆序
isNaN();判断当前字符串是否是数字,是数字返回false,NaN表示不是数字
parseInt();类型转换,类同java,字符串转数字
六、JS的重载
注意java中重载:名称相同,参数可辨
重写:子类父类相同方法名称与参数的不同实现
JS不存在重载!但可以通过其他方法模拟实现重载。【然而并没有什么卵用,仅面试答答】
arguements数组,保存传递的参数,就通过这个数组来实现
function add(){//此处不传参数,函数内判断
if(arguements.length==2){
return arguements[0]+arguements[1];
}else if(...){
...
}
...
七、JS的BOM对象(浏览器对象)
对象:navigator:获取浏览器的信息(客户机)如navigator.appName等(注意是属性。
对象包含有关访问者浏览器的信息。具有误导性
srceen:屏幕信息,如srceen.width
location:(重点看href属性)href,设置或返回当前请求的url地址(HTML中的button的事件绑定
<input type="button" value="点击跳转" onclick="js代码方法等"/>
location.href="".
history:请求的url的历史记录
<input type="button" value="back" onclick="back()"/>
function back(){history.back();}其它同理,history.forward();
还可以history.go(-1或1实现)
【重点】window:窗口的顶层对象(包含上述四个)
方法:(window.alert();等为完整代码,可省略,依次类推
alert();警告框页面弹窗,显示内容
confirm();确认提示框,会返回一个确定与否的boolean值
根据返回值做相关操作,if()
prompt();输入的对话框【了解】,两个参数,提示信息与默认值
close();是否关闭的方法(兼容性差) |
|