JavaScript基础概览

一些概念

DOM(文档对象模型)是HTML和XML的应用程序接口(API)。

DOM Level1规划文档结构;DOM Level2扩展了对鼠标和用户界面事件等的支持;DOM Level3支持了XML1.0特性,包括XPath等。

还有其他语言发布了自己的DOM标准:可缩放矢量图形(SVG),同步多媒体集成语言(SMIL)等。

DOM描述了处理网页内容的方法和接口;BOM描述了与浏览器进行交互的方法和接口。

ECMAScript原始类型

5种原始类型:UndefinedNullBooleanNumberString;对应的使用typeof运算符返回:undefined、object、boolean、number、string。

undefined值实际上是从null派生而来,因此 null==undefined 

所有ECMAScript数值必须在Number.MAX_VALUENumber.MIN_VALUE之间;
当计算的数大于Number.MAX_VALUE时候会被赋予值Number.POSITIVE_INFINITY,显示为Infinity
当计算的数小于Number.MIN_VALUE时候会被赋予值Number.NEGATIVE_INFINITY,显示为-Infinity
可以对任何数调用isFinit() ,已确保该数不是无穷大。
另外还存在一个特殊值NaN,表示非数,例如在类型转换失败时会变为非数,可以通过isNaN()来判断,另外NaN不等于NaN。

转换数字可以使用parseInt()parseFloat()方法,只能对String类型的调用这些方法,对其他类型的返回为NaN。
强制类型转换可以使用Boolean()Number()String()
Number(undefined)返回NaN;Number(null)返回0。

Object类具有的属性:constructorprototype
Object类具有的方法:hasOwnProperty()isPrototypeOf()propertyIsEnumerable()toString()valueOf()

String类的各种方法:

charCodeAt 字符代码
concat 连接一个或多个字符串,保持原始的String对象不变
indexOf 指定子串在另一个字符串中的位置
slice 该方法截取子串,若参数是负数则会用字符串的长度加上参数;不改变String对象自身
substring 该方法截取子串,如果对于负参数,将当作0处理;不改变String对象自身
toUpperCase 转换大写
toLowerCase 转换小写
   

 

 

 

 

 

 

instanceof运算符:和typeof运算符类似,但该运算符可以确认对象为某特定类型,例如"hello" instanceof String

运算

逻辑OR运算中如果一个运算数是对象,另一个是Boolean值,则返回该对象,例如 alert(false||{}); 输出的是对象。
两个字符串形式的数字进行比较时候,比较的是字符代码;但如果一个字符串数字和数字进行比较,那么字符串数字会先转换为数字,例如 "23"<3 为false;
如果字符串和数字比较,字符串无法转换为有效数字,例如 "a"<3 返回为false,因为"a"尝试parseInt()返回为NaN,任何和NaN的关系运算都为false。

函数

使用new Function来定义一个函数,例如 var f=new Function("v1","v2","return v1+v2;");alert(f(1,2)); 
尽管可以使用Function构造函数创建函数,但用它定义函数比用传统方式要慢得多,类似于eval;另外不能访问局部作用域,无法自身遍历等问题。

对象

ECMA-262定义的本地类:

Object Function Array String Boolean
Number Date RegExp Error EvalError
RangeError ReferenceError SyntaxError TypeError URIError

 

 

 

Array对象可以使用join方法连接字符串,String对象可以用split方法转换字符串为数组。
Array对象还具有两个String类具有的方法,concatslice方法,返回的为新的数组,不改变原始数组。
Array对象还有push方法、pop方法、shift方法、unshift方法。
Array对象可以使用reverse方法颠倒数组项顺序,sort方法将根据数据项的值按升序排序。
Array对象还有个splice方法,可以实现删除替换操作,例如 var a=[1,2,3,4];a.splice(2,1,300,301);alert(a); ,该方法会改变原始数组。

Date对象可以使用UTC方法返回日期的毫秒表示,例如 new Date(Date.UTC(2012,1,29,8,30)); 为UTC的2012年2月29日8点30分。

Global对象是个特别的对象,设计上根本不存在,如isNaN等方法都是Global对象的方法。
Global对象中还有encodeURI编码链接,还有encodeURIComponent对所有非标准字符进行编码。
Global对象的eval方法,解释程序会把eval方法的参数解释为真正的ECMAScript语句,然后插入该函数所在的位置,因此eval方法可以调用局部变量:

JavaScript基础概览
1 (function(){
2     var msg="hello world";
3     eval("alert(msg);var o={o:1};");
4     var re=eval("({a:1})");
5     alert(o.o); /* eval中定义的变量 */
6     alert(re.a); /* eval可以返回一个变量 */
7 })();
eval调用局部变量 & 定义变量 & 返回变量

Math对象存在一个ceil向上舍入函数、floor方法向下舍入函数、round方法四舍五入函数。
Math对象配合random方法可以生成随机数,例如生成1到10之间的数: Math.floor(Math.random()*10+1); 

继承

使用call和apply方法可以实现对象冒充。

可以通过一个中间对象来实现继承:

JavaScript基础概览
 1 function extend(sb,sp){
 2     var bridge=function(){};
 3     bridge.prototype=sp.prototype;
 4     var o=new bridge();
 5     sb.prototype=o;
 6     o.constructor=sb;
 7     sb.superclass=sp;
 8     return sb;
 9 }
10 function class1(nm){
11     this.nm=nm;
12 }
13 class1.prototype.getnm=function(){
14     return this.nm;
15 };
16 function class2(nm){
17     class2.superclass.call(this,nm);
18 }
19 extend(class2,class1);
20 ao=new class2("zxf");
21 ao.getnm();
中间对象实现继承

BOM浏览器对象模型 基础

XHTML中引入javascript要注意需要CDATA段才能识别,另外要兼容不支持XHTML的浏览器(可能不识别CDATA段),因此嵌入XHTML的代码可能如下:

JavaScript基础概览
1 <script type="text/javascript">
2 //<![CDATA[
3     function add(a,b){
4         return a+b;
5     }
6 //]]>
7 </script>
XHTML的javascript嵌入

window对象中有top对象和parent对象和self对象来指明窗口对象。
window.open()方法打开新窗口,存在四个参数(URL,新窗口名字,特性字符串,是否新载入页面替换当前页面):
例如 window.open("http://www.baidu.com","_blank","height=100,width=100,top=10,left=10"); 并可以通过window.close()来关闭窗口。

window对象可以通过alert()方法弹出显示框;通过confirm()方法弹出确定框;通过prompt()方法弹出文本输入框。

setTimeout()方法设置延迟执行,其中参数可以用字符串也可以直接传递函数;取消未执行的setTimeout()可以使用clearTimeout()方法。
setInterval()方法可以设置重复执行,同样的可以通过clearInterval()方法来停止执行。
关于setTimeout()方法以及setInterval()方法的执行作用域:全局作用域,可以通过传递一个函数来实现局部变量访问:

JavaScript基础概览
1 (function(){
2     var x=10;
3     setTimeout("alert(typeof x);",1000);    /* undefined */
4     setTimeout(function(){alert(typeof x)},2000);    /* number */
5 })();
setTimeout执行作用域

window.history对象有go()方法,可以传递前进或后退的页面数,更简单的可以使用history.back()和history.forward()方法。

window.document对象比较特殊,即属于BOM又属于DOM。

window.location对象包含protocolhostportpathnamesearchhash以及href等属性。
window.location.replace()方法可以跳转到新页面并且从浏览器历史中删除原页面记录;
window.location.reload()方法可以从服务端重新加载当前页面。

window.navigator对象包含大量WEB浏览器的信息,通常使用navigator.userAgent来判断客户端环境。

window.screen对象可以获取部分用户系统信息,例如screen.availHeight可获取屏幕可以使用的像素高度,screen.height可以获取屏幕高度。

DOM文档对象模型 基础

20140408

 

JavaScript基础概览,布布扣,bubuko.com

JavaScript基础概览

上一篇:java-循环结构体


下一篇:115 Java Interview Questions and Answers – The ULTIMATE List--reference