JavaScript基础语法介绍
2017-04-04 22:36
281 查看
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: 鼠标松开。
@待续
相关文章推荐
- javaScript基础语法介绍
- JavaScript基础语法介绍
- javaScript基础语法介绍
- javaScript基础语法介绍
- JavaScript基础语法介绍
- SQL的详细语法介绍——对于学习数据库最基础知识[转]
- JavaScript语法基础
- JavaScript 语法集锦 脚本之家基础推荐
- javascript 语法基础 想学习js的朋友可以看看
- JavaScript 高级语法介绍
- JavaScript基础语法
- 复习关于Javascript的语言基础运用和语法
- SQL的详细语法介绍——对于学习数据库最基础知识一
- JavaScript语法介绍
- 关于PhoneGap的12件事:基础介绍javascript数组
- JavaScript基础语法让人疑惑的地方小结
- SQL的详细语法介绍——对于学习数据库最基础知识一
- JavaScript 语法集锦 脚本之家基础推荐
- SQL的详细语法介绍——对于学习最基础知识一
- javascript 语法基础 想学习js的朋友可以看看