JavaScript基础语法介绍

语法

区分大小写注释：单行//, 多行 /* … */分号作为代码的结束符号。花括号为块代码。

变量

使用var来声明一个新变量。例如var a;, 变量默认值为undefined多个变量使用逗号分隔。变量类型是弱类型，就是根据赋值来决定变量类型。

数据类型

JavaScript具有5中基础类型：undefined, null, boolean, number, string。还有一个复杂类型: object。 查看变量属于那种类型可以通过typeof：

var a = 100; console.log(typeof a);

undefined和null

undefined表示一个未定义的基础类型的变量；而null表示一个空对象。所以object类型变量最好初始化为null。

var obj = null; obj = {name: "kris", age: 20};

boolean类型

有五种值会转为false：0, NaN, undefined, null, “”（空字符串），其他值都转成true。

number类型

数值使用十进制。八进制前面以零开头。十六进制以0x开头。

var a = 100; var b = 020; var c = 0xFF;

浮点数可以使用小数点和指数。

var f = 3.14; var m = 3e5; // 表示 3 * 10^5

string类型

字符串可以使用单引号或者双引号。长度使用length获取。字符拼接使用加号。

object类型

object是拥有属性和方法的数据类型。

var person = new Object(); person.name = "kris"; person.age = 20; person.grow = function() { this.age += 1; }

操作符

算术操作符

包括：+, -, * , /, ++, –;

布尔操作符

非!, 与&&, 或||

关系操作符

大于>, 小于<, 大于等于>=, 小于等于<=, 相等==, 全等===, 不相等!=, 不全等!==

条件操作符

三元 5 > 3 ? true : false;

控制语句

if-else if-else while, do-while for, for-in 其中for-in用于遍历对象属性和方法：

for(var prop in person) { console.log(prop); }

switch-case-default语句。 break, continue, label语句。label标记在循环之前，用于退出到最外层的label名称，在break之后指定。

函数

function add(n1, n2) { return n1 + n2; } 或者 var add = function(n1, n2) { return n1 + n2; }

对象

创建对象：

var person = { name: "kris", age: 20, grow: function() { this.age += 1; } } 或者 function Person(name, age) { this.name = name; this.age = age; this.grow = function() { this.age += 1; } } var p = new Person("kris", 20);

数组

JavaScript的数组其实是一种对象。

var a = [1,2,3]; 或者 var a = new Array(1, 2, 3); var b = new Array(20); //长度为20，没有赋值的数组

访问和修改HTML元素

document.getElementById("id"); document.getElementByTagName("p"); document.getElementByClassName("className");

使用style属性修改元素的样式表，例如：

var div = document.getElementById('divid'); div[0].style.backgroundColor = "red";

注意：在CSS中的background-color，由于变量名不能带有横线，所以改成backgroundColor。

添加和删除节点

var p = document.createElement("p"); p.innerHTML = "hello"; var div = document.getElementById("divid"); div.appendChild(p);

删除节点为： div.removeChild(x);。

事件

var p = document.getElementById("pid"); p.onclick = function() { this.innerHTML = "Hello, kris"; }

事件种类包括： - onload: 页面或者图片加载完成 - onclick： 鼠标点击。 - ondbclick：鼠标双击 - onkeydown： 键盘按键按下 - onkeypress：按下并松开 - onkeyup： 按键松开 - onmousedown： 鼠标按下 - onmousemove： 鼠标移动 - onmouseout：鼠标移开 - onmouseover：鼠标在上面 - onmouseup： 鼠标松开。

@待续