JavaScript

JavaScript基础语法

书写语法

1.区分大小写:与Java一样，变量名、函数名以及其他一切东西都是区分大小写的
2.每行结尾的分号可有可无

输出语句

window.alert()  //弹框
document.write() //写入html输出
console.log()    //写入浏览器控制台

变量（var）

JavaScript是一门弱类型语言，变量可以存放不同类型的值

变量名需要遵循如下规则:

• 组成字符可以是任何字母、数字、下划线(_)或美元符号($)
• 数字不能开头
• 建议使用驼峰命名

ECMAScript 6新增了let关键字来定义变量。它的用法类似于var，但是所声明的变量，只在let关键字所在的代码块内有效，且不允许重复声明

ECMAScript 6新增了const关键字，用来声明一个只读的常量。一旦声明，常量的值就不能改变。

数据类型

JavaScript中分为:原始类型和引用类型5种原始类型:

• number:数字（整数、小数、NaN(Not a Number))
• string:字符、字符串，单双引皆可
• boolean:布尔。true,false
• null:对象为空
• undefined:当声明的变量未初始化时，该变量的默认值是undefined

使用typeof运算符可以获取数据类型

var obj = null;
alert(typeof obj)     //Object

运算符

和java运算符相同，除了== 和全等于“===”

==：
1.判断类型是否一样，如果不一样，则进行类型转换
2.再去比较对应的值
===：全等于
1.判断类型是否一样，不一样直接返回false
2.再去比较对应的值

类型转换（加一个“+”）

其他类型转为number:

• string:按照字符串的字面值，转为数字.如果字面值不是数字，则转为NaN。一般使用parseInt()
• boolean: true转为1，false转为0

其他类型转为boolean:

• number :0和NaN转为false，其他的数字转为true
• string:空字符串转为false，其他的字符串转为true
• null:false
• undefined :false

流程控制语句

跟java一毛一样

函数

定义: JavaScript函数通过function关键词进行定义

语法1：

function functionName(参数1,参数2..){
		xxxxx
}

注意：

• 形式参数不需要类型。因为JavaScript是弱类型语言
• 返回值也不需要定义类型，可以在函数内部直接使用return返回即可

function add(x,y){
		return x+y
}

let sum = add(1,1)

语法2：

var add = function(a,b){
		return a+b
}
var sum = add(1)   //NAN

对象

数组

push：添加元素
splice：输出元素

arr.splice(0,1)    //从第几个开始删，删几个

String

trim()    //去除字符串前后两端的空白字符

BOM

window（浏览器窗口对象）

• alert() // 警告弹窗
• confirm() // 确认和取消对话框,确认返回true，取消返回false
• setInterval(function(),毫秒值) // 在一定的时间间隔后执行一个function，循环执行
• setTimeout(function(),毫秒值) //在一定的时间间隔后执行一个function，只执行一次

Navigator（浏览器对象）

不常用

screen（屏幕对象）

不常用

History（历史记录对象）

history.back() 加载前一个url
history.forward() 加载后一个url

Location（地址栏对象）

location.href 获取当前url

DOM(文档对象模型)

将标记语言的各个组成部分封装为对象

• Document:整个文档对象
• Element:元素对象
• Attribute:属性对象
• Text:文本对象
• Comment:注释对象

获取Element

使用Document对象的方法来获取

• getElementByld:根据id属性值获取，返回一个Element对象

document.getElementById("id")

• getElementsByTagName:根据标签名称获取，返回Element对象数组

document.getElementsByTagName("div")

• getElementsByName:根据name属性值获取，返回Element对象数组

document.getElementsByName("name")

• getElementsByClassName:根据class属性值获取，返回Element对象数组

document.getElementsByClassNam("class")

使用HTML Element对象

img.src=“地址”
div.style.属性名称
div.innerHTML=“文本或者拼接“

文档

事件监听

事件绑定，推荐方式2，职责单一

常见事件

正则表达式

本文图片摘抄自黑马程序员