javascript常用知识点

一、JS基础

1. JavaScript是一种基于对象和事件驱动的客户端脚本语言，最初的设计是为了检验HTML表单输入的正确性

2. JavaScript的组成：完整的JavaScript是由ECMAScript（语法）、Browser Objects（DOM、BOM）（特性）组成的

3. 单行注释// 、多行注释/**/

4. 标识符：

1) 什么是标识符：变量、函数、属性的名字，或者函数的参数

2) 标识符的命名规则：

①　有字幕、数字、下划线（_）或美元符号（$）组成

②　不能以数字开头

③　不能使用关键字、保留字等作为标识符

5. 变量：

1) 变量的声明（语法）：var 变量名

2) 变量的赋值（语法）：

①　声明的同时赋值：var 变量名=值

②　先声明后赋值：变量名=值

6. 数据类型的分类：

1) 简单数据类型（基本数据类型）

①　Undefined：只有一个值，即特殊的undefined

②　Null：表示一个空对象指针，如果定义的变量准备在将来用于保存对象，那么最好将改变初始化为null而不是其他值。Undefined值是派生自null值的，所有undefined==null返回结果是true

③　Boolean：true/false，（0、“ ”、null、undefined转换时为false，其他的都是true）

④　Number：表示整数和浮点数

⑤　String：用于表示由零或多个16位Unicode字符组成的字符序列，即字符串，字符串可以由双引号（“”）或单引号（‘’）表示；length:获取长度

2) 复杂数据类型：Object

7. 检测变量类型（语法）：typeof（string、number、boolean、object、undefined、function）

①　typeof 变量

②　typeof（变量）

8. NaN：即非数值（Not a Number）是一个特殊的数值

注：①任何涉及NaN的操作（例如NaN/10）都会返回NaN

    ②NaN与任何值都不相等，包括NaN本身

9. 检测是否是“非数值”：isNaN（n），其返回值是boolean类型

10. 类型转换：

1) 数值转换

①　把字符串转换成int类型：parseInt()，会忽略字符串前面的空格，知道找到第一个非空格字符；转换空字符串返回NaN

②　把字符串转换成float类型：parseFloat()，从第一个字符开始解析每个字符，直至遇见一个无效的浮点数字符为止

③　Number():可以转换任何数据类型

2) 字符串转换

①　String()：可以将任何类型的值转换为字符串，包括null和undefined

②　toString()：str.toString()，str是要转换的内容，可以是数值、布尔值、对象和字符串

11. 什么是表达式：将同类型的数据（如常量、变量、函数等），用运算符号按一定的规则连接起来的、有意义的式子称为表达式

12. 运算符的分类：

①　算数操作符：+、-、*、/ 、%

②　逻辑操作符：&&、||、！

③　赋值操作符：=、+=、-=、*=、/=、%=

④　比较操作符：>、<、>=、==、===、！=、！==

⑤　三元操作符：条件？执行代码1：执行代码2

13. 流程控制：

①　 单分支：if（）{….}

②　 双分支：if（）{….}else{….}

③　 多分支：if（）{….}else if（）{….}…else{….}

④　 switch语句：switch（）{case value：statement；break；……}

14. 循环控制：

①　 for循环：for（语句1;语句2;语句3）{被执行的代码块; }

②　 while(条件){需要执行的代码; }

③　 do{ 需要执行的代码}while（条件）;

二、函数

1. 函数的作用：通过函数可以封装任意多条语句，而且可以在任何地方、任何时候调用执行

2. 函数的定义：function functionName([arg0,arg1,…argn]){ statements }

三、内置对象

1. Array

1) 创建数组：

①　 使用Array构造函数：new Array(要保存的项目数量)

②　 使用数组字面量表示法：由一对包含数组项的方括号[ ]表示，多个数组项之间以逗号隔开

2) 数组的长度：array.length

3) 数组的栈方法：

①　 push():添加到尾部

②　 unshift()：添加到开头

③　 pop()：删除尾部

④　 shift()：删除开头

⑤　 join():用于将数组中的所有元素放入一个字符串

⑥　 reverse():用于颠倒数组中元素的顺序

⑦　 sort():对数组的元素进行排序

⑧　 concat():用于连接两个或多个数组

⑨　 slice(start,end):从已有的数组中返回选定的元素

⑩　 splice(index,count):删除从index处开始的零个或多个元素

⑪　 splice（index,count,item1,…..,itemX）:在制定位置插入值，且同时删除任意数量的项

⑫　 indexOf():从数组的开头开始向后查找

⑬　 lastIndexOf():从数组的末尾开始向前查找

2. String：

常用方法：

①　 charAt(index):返回index位置的字符

②　 charCodeAt(index):返回index位置字符的字符编码

③　 indexOf():从一个字符串中搜索给定的子字符串，返回子字符串的位置

④　 lastIndexOf():从一个字符串中搜索给定的子字符串，返回子字符串的位置

⑤　 slice(start,end): 截取子字符串

⑥　 substring():截取子字符串

⑦　 substr(str,len): 截取子字符串

⑧　 split():把一个字符串分割成字符串数组

⑨　 replace():在字符串中用一些字符替代另一些字符，或替换一个与表达式匹配的字串

⑩　 toUpperCase():

⑪　 toLowerCase():

3. Math:

常用方法：

①　 min():

②　 max():

③　 ceil():向上取整，即返回大于原数的最小整数

④　 floor():向下取整，返回原数的整数部分

⑤　 round():

⑥　 abs():取绝对值

⑦　 random():返回大于等于0小于1的一个随机数；求n到m之间的随机整数的公式：random=Math.floor(Math.random()*(m-n+1)+n)

4. Date:

常用方法：

①　getFullYear():返回4位数的年份

②　getMonth():返回日期中的月份，返回值是0-11

③　getDate():返回月份中的天数

④　getDay():返回星期，返回值是0-6

⑤　getHours():返回小时

⑥　getMinutes():返回分

⑦　getSeconds():返回秒

⑧　getTime():返回表示日期的毫秒数

⑨　setFullYear(year)

四、DOM

（一）DOM基础

1. DOM查找方法

①　document.getElementById()

②　document.getElementsByTagName()

2. 设置元素的样式:DOM对象.style.styleName=styleValue

3. ele.innerHTML:返回ele元素开始和结束标签之间的HTML

4. ele.className:返回ele元素的class属性

5. 获取属性：ele.getAttribute(“attribute”)

6. 设置属性：ele.setAttribute(“attribute”,value)

7. 删除属性：ele.removeAttribute(“attribute”)

（二）DOM事件

1. 什么是事件：事件就是文档或浏览器窗口中发生的一些特定的交互瞬间

2. DOM0级事件：ele.事件=执行脚本

3. 鼠标事件：

①　onload:页面加载时触发

②　onclick:鼠标点击时触发

③　onmouseover:鼠标滑过时触发

④　onmouseout:鼠标离开时触发

⑤　onfoucs:获得焦点时触发

⑥　onblur:失去焦点时触发

⑦　onchange:域的内容改变时发生

⑧　onsubmit:表单中的确认按钮被点击时发生

⑨　onmousedown:鼠标按钮在元素上按下时触发

⑩　onmousemove:在鼠标指针移动时发生

⑪　onmouseup:在元素上松开鼠标按钮时触发

⑫　onresize:当调整浏览器窗口的大小时触发

⑬　onscroll:拖动滚动条时触发

4. 键盘事件与keyCode属性

①　onkeydown：在用户按下一个键盘按键时发生

②　onkeypress：在键盘按键被按下并释放一个键时发生

③　onkeyup：在键盘按键被松开时发生

④　keyCode：返回onkeypress、onkeydown或onkeyup事件触发的键的值的字符代码，或者是键的代码

5. this：在事件触发的函数中，this是对该DOM对象的引用

五、BOM基础

1. 什么是bom：BOM(browser object model)浏览器对象模型

2. Window是浏览器的一个实例，在浏览器中，window对象有双重角色，它既是通过JavaScript访问浏览器窗口的一个接口，又是ECMAScript规定的Global对象

3. Window对象的方法

①　警告框：window.alert(“content”),显示带有一段消息和一个确认按钮的警告框

②　对话框：window.confirm(“message”)，显示一个带有指定消息和OK及取消按钮的对话框

③　输入框：window.prompt(“text,defaultText”),text(纯文本),defaultText(默认的输入文本)

④　打开新窗口：window.open(pageURL,name,parameters),pageURL(子窗口路径),name(子窗口句柄),parameters(窗口参数，各参数用逗号分隔)

⑤　关闭浏览器窗口：window.close()

4. 超时器：

①　 超时调用：setTimeout(code,millisec)，code：要调用的函数或要执行的JavaScript代码串，millisec：在执行代码需等待的毫秒数

②　 清除超时调用：clearTimeout(id_of_settimeout),id_od_settimeout:由setTimeout()返回的ID值，该值标识要去的延迟执行代码块

5. 定时器

间歇调用：setInterval(code,millisec),每隔指定的时间执行一次代码

6. location对象：location对象提供了与当前窗口中加载的文档有关的信息，还提供了一些导航的功能，它既是window对象的属性，也是document对象的属性

1) 常用属性：

①　 location.href：返回当前加载页面的完整URL；location.href与window.location.href等价

②　 location.hash：返回URL中的hash（#号后跟零或多个字符），如果不包含则返回空字符串

③　 location.host：返回服务器名称和端口号

④　 location.hostname：返回不带端口号的服务器名称

⑤　 location.pashname：返回URL中的目录和（或）文件名

⑥　 local.port：返回URL中指定的端口号，如果没有，返回空字符串

⑦　 location.protocol：返回页面使用的协议

⑧　 location.search：返回URL的查询字符串，这个字符串以问好开头

2) 常用方法：

①　 location.replace（url）：重新定向URL

②　 location.reload（）：重新加载当前显示的页面

7. history历史对象

①　 history.back()：返回历史记录的上一步，相当于使用了history.go（-1）

②　 location.Forward()：回到历史记录的下一步，相当于使用了history.go（1）】

③　 history.go（-n）：回到历史记录的前n步

④　 history.go（n）：回到历史记录的后n步

8. Screen对象

①　 Screen.availWidth：返回可用的屏幕宽度

②　 Screen.availHeight：返回可用的屏幕高度

9. Navigator对象

①　UserAgent：用来识别浏览器名称、版本、引擎以及操作系统等信息的内容