1.什么是JavaScript
JavaScript 是一门脚本语言,主要由 ECMAScript 规范(与任何的宿主无关),DOM,BOM组成。
ECMAScript 是一种规范,定义语言的属性、语法、对象,该规范由具体语言实现,如Javascript、ActionScript、ScriptEase等;
DOM(Document Object Model 文档对象模型)是Html和Xml的应用程序接口(API),DOM将页面规划成由节点层级构成的文档;
BOM(Browser Object Model 浏览器对象模型),提供对浏览器进行访问和操作的统一接口API。BOM相关API处理浏览器窗口window和document,包含:window.open弹出新的窗口,移动,关闭浏览器,cookie支持等。
2.ECMAScript
严格来说ECMAScript才是JavaScript语言,它以任何的宿主环境无关
(1)、语法
区分大小写
弱类型
注释,函数与java近似(java 7以后有闭包)
(2)、变量定义
弱类型
下划线,字母,$起头
Pascal记法
(3)、数据类型
原始值:存储于栈空间,易于操作,共有五种:Number、Null、Undefined、String、Boolean,五种类型可以通过typeof来判断,如typeof(a) 返回”number”,”object”,”undefined”,”string”,”boolean”
注意:
null和undefined区别,undefined声明了变量但未对变量的赋初值,null 表示尚未存在的对象,但typeof(null)返回值也为object,null属于一个空的object
isNaN(num)方法判断 num 是否为数值型,NaN == Not a Number,若 num 是数字,返回值为 false,若 num 是非数字,则返回值为true
转换:数值转字符串,使用toString()方法,注意Num.toString(2)可以选择使用多少进制来转换;字符串转数值,parseInt、parseFloat函数;强制类型转换,Boolean(‘true’), var s1=String(23);
引用值:
var o = new Object(); var num = new Number(5);
调用对象的valueOf()返回原始值,注意各个对象中的属性和方法;Number,String采用 instanceof来判断一个特定对象为某特定类型
JavaScript对象:
本地对象:Object Function Array String Boolean Number Date RegExp 一批Error类
内置对象:Global Math
宿住对象:由具体的宿主环境提供,所有的BOM和DOM都是宿主对象
(4)、操作符
基本的语言操作符都近似的操作符:
数值操作 (Arithmetic Operations): + ++ – — * / %
字符串操作 (String Operations): + +=
逻辑操作 (Logical Operations): && || !
位操作 (Bitwise Operations): & ^ | ~ << >> >>> 注意: 3 << 2 == 12 自动转换成10进制
分配操作 (Assignment Operations): = += -= *= /= %= &= ^= |= <<= >>= >>>=
比较操作 (Comparison Operation): == != === !== > >= < <=
注意:
负数的表示形式为“正数取反再加1”
左移时右边补0,保留符号位(也就是第31位的1不变)
右移时左边补0,保留符号位
(5)、语法
与Java,C++基本类似,些许不同:
width(object){
// do something here
}
在width内部可以直接使用object的属性及方法,而不用通过object.fn(**);可以直接使用fn(**)
(6)、函数,对象的定义
每个对象都有共同的prototype属性,prototype可添加方法。JavaScript语言与其他高级语言的最大不同点体现在prototype属性,使用prototype可用于模拟高级语言中的对象继承!
(7)、对象
创建对象的三种方式:
// 直接新建Object对象
var obj = new Object();
obj.name = "zl";
obj.age = 23;
// 使用new 对象方式访问对象
var obj1 = new Array();
// 直接使用JSON数据
var obj2 = {"name":"zl","age":23};
(8)、闭包
总结在另一章里面:JavaScript闭包 。
(9)、正则表达式
正则表达式我喜欢abruzzi 写的JavaScript内核系列 第6章 正则表达式
3.DOM模型
页面上的每个HTML元素,都作为一个DOM对象,拥有属性和方法,参考
w3school dom。
document是重要的对象,默认document属于windows的属性对象,表示整个DOM文档,包含对DOM元素的操作API。
document查找API包括:getElementById(elemId),查找页面内唯一id的元素,若有多个id相同的对象,只返回第一个,速度最快的查找方法。若查找到,返回单个对象。
getElementsByName(elemName),按name属性查找,同一页面中可以包含多个相同name属性的对象,返回值数组类型。
getElementsByTagName(tagName),按元素标签查找元素,匹配元素的标签名。
现代浏览器还增加了一getElementsByClassName(className),在firefox上测试,里面若包含了className,同时包含其他的样式,可以被匹配出来,免去了以前用正则表达式来做处理,减少代码量。帮助用户更快的进行元素的选择。这种方法的使用使得手机端的选择器可以大大减少代码量。document还包含对body的直接访问:document.body,可以调用到body.onready函数,装载DOM元素完成时对body内的元素进行操作。cookie也属于document的属性对象,对cookie的内容进行获取并访问。title也属于document的属性对象,可直接更改页面的title。其余的div,table等元素的介绍,可参考
w3school dom。
4.BOM模型
window
所有的浏览器都应该支持window对象,window对象包含了宿主对象提供JavaScript操作的接口。
参考:
w3school window 对象的属性和方法,分类:
弹出窗口提示: alert(), confirm(), prompt()
定时器相关:setTimeout(), setInterval(), clearTimeout(), clearInterval()
打开关闭相关:open(), close() (注意:open函数,控制窗口的特征:位置,大小,模式,菜单栏等)
浏览器大小相关:resizeBy(width, height), resizeTo(x, y)
浏览器位置相关:moveBy(x, y), moveTo(x, y), scrollBy(xnum, ynum), scrollTo(xpos, ypos)
窗口打印:print()
注意 :要读取outterHeight, outterWidth, innerHeight, innerWidth,可以从document.body属性读取,即通过dom对象来读取,而不是直接操作window对象
常用属性:
父子关系:parent, opener, top
屏幕大小:screenLeft, screenTop, screenX, screenY (screen 相关有浏览器兼容问题,这个属性原本应该不是在这里的,所以才导致各个不统一)
状态:name, defaultStatus, status
window对象还包含location, history, screen, navigator, 和 document对象, document 已在 DOM小节说明,下面解析其他对象。
location
location控制当前页面 url 链接,如hash表示#号锚点,search表示?及其后的所有数据。一个链接可以表示为:href = protocol + “//” + hostname + “:” port + path
涉及到链接改变需刷新页面,location中添加了reload()方法,用于刷新当前页面:
history
go(url | num) 跳转到第几个历史页面
forward() 前进
back() 后退
navigator
浏览器版本信息等,区分浏览器非常有用,最常用userAgent属性,包含版本非常详尽的信息,然后再通过正则找出想要的浏览器信息如:chrome控制台输入navigator.userAgent,输出:Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.94 Safari/537.4
screen
浏览器的宽高,相素等信息:
availHeight: 1056
availLeft: 66
availTop: 24
availWidth: 1854
colorDepth: 24
height: 1080
pixelDepth: 24
width: 1920
- 大小: 27.4 KB
分享到:
相关推荐
javascript基础知识总结,详细的介绍了基础知识
JavaScript基础知识总汇JavaScript基础知识总汇JavaScript基础知识总汇JavaScript基础知识总汇JavaScript基础知识总汇JavaScript基础知识总汇
JavaScript基础知识例子.zipJavaScript基础知识例子.zip
这份文件是一份前端十年经验的JavaScript基础知识大纲,主要是为了帮助前端开发者系统地学习和掌握JavaScript的基础知识。该大纲采用思维构图的方式,将JavaScript的基础知识按照不同的主题进行分类和整理,包括数据...
javascript基础知识大集锦javascript基础知识大集锦javascript基础知识大集锦javascript基础知识大集锦
javascript基础知识javascript基础知识javascript基础知识
这是一份关于javascript的文档,可以帮助大家更好的理解网页制作的基础知识内容
Javascript基础知识整理.doc
个人总结 对新学者有帮助,重点地方有颜色标记,好好学习 学无止尽
关于javascript基础知识ppt里头包括javascript最基础的知识
javascript基础知识大全 javascript API
资源名称:Javascript基础知识 中文word版 内容简介: Javascript是Netscape公司开发的一种脚本语言。该语言编程的程序可以被嵌入到HTML页面中,并直接在浏览器中解释执行。喜欢的朋友...
JavaScript学习笔记,javascript基础知识,基础语法整理.pdf
PHP-Javascript基础知识java sctipt学习不求人JS.CSS代码工具
JavaScript 基础知识介绍 JavaScript 基础知识介绍 JavaScript 基础知识介绍
JavaScript基础知识.docx
javascript基础知识2,初学者的有力工具
javaScript基础知识 javaScript入门PPT
JavaScript基础知识.md