javascript基础

javascript学习笔记

简介

javascript是什么？

JavaScript是一种运行在浏览器中的解释型、面向对象、事件驱动式的编程语言。

javascript能干什么？

交互式操作；表单验证；网页特效；Web游戏；服务器脚本开发等。

javascript有何特点？

事件驱动、跨平台、动态、交互式的操作方式

javascript与ECMAScript的区别？

ECMAScript是一种语言标准，javascript是语言标准的实现。

javascript执行方式？

解释执行（由上而下）

javascript执行平台？

web浏览器，浏览器有两大对象模型：DOM和BOM，js的最主要功能就是操纵这两个模型里面的东西

引入

直接嵌套在在网页的任何地方，一般放在标签中或者标签后，建议使用后者，因为js解释执行从上到下，可避免js代码延迟加载导致网页的显示。

将代码单独写在一个js文件中，通过在HTML中通过引入这个文件。

基本语法

注释

单行注释：//

多行注释：/* */

注意

JavaScript区分大小写；

语句末尾不强制加分号；

变量声明

规则

可以用 _、数字、字母、$、组成 , 且数字不能开头，声明变量用var变量名来声明。

变量名也不能是JavaScript的关键字，如if、while等。

如果不写var时，则为全局变量

赋值
变量名 = 变量值;

变量作用域

全局变量：省略var，或在函数外声明，全局变量可在整个脚本中被使用，可在不同的窗口中相互引用（指定窗口名）

局部变量：在函数内声明

数据类型

数值：整数、浮点数，整数：由正负号、数字构成，八进制、十进制、十六进制，浮点数：由正负号、数字和小数点构成，常规记数法、科学记数法；

逻辑值：布尔值，true、false；

字符串值： 单引号、双引号；

空值： null

未定义值： undefined，根本不存在的对象、已定义但没有赋值的量；

数组：是一组按顺序排列的集合，集合的每个值称为元素。JavaScript的数组可以包括任意数据类型,写法："[]" 包围 ,"," 号隔开每一个值，例如：[1, 2, 3.14, 'Hello', null, true];,还可以用Array()函数实现；

对象：是一组由键-值组成的无序集合，例如：var i = {'name':'leo','age':23};,可以通过i.name或者i.age获取一个对象的属性，即对象变量.属性名。后面会详细介绍。

运算符

算术运算符:+　　-　　*　　/　　%（取余）　　++（递增）　　--（递减）

赋值运算符:=　　+=　　-=　　*=　　/=　　%=

比较运算符:==　　!=　　===（值及类型）　　!==（值及类型） <　　<=　　>　　>=

逻辑运算符:&&　　||　　!

拼接运算符：+

特殊运算符:1、new运算符：创建对象（实例）

　　　 格式：对象名称=new 对象类型（参数）

2、this运算符：表示当前对象

　　　 格式：this[.属性]

3、条件运算符：三元运算符

格式：<条件表达式> ? 第一个值：第二个值

语句

条件语句

有if...else和switch语句两种

//if语句

if(表达式){
语句
}else if(表达式){
语句
}else{
语句
}

//switch语句

switch (<表达式>) {
case <数值1>:<语句组1>
break;
case <数值2>:<语句组2>
break;
...
default <语句组>
}

循环语句

有for、while、do...while、for...in语句

//for语句,常用于利用索引来遍历数组

for (<初始表达式>；<条件表达式>；<变动量表达式>){
<语句组>
}

var arr=['a','b','c','d'];
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}

//while语句

while (<表达式>){
<语句组>
}

//do...while语句

do {
<语句组>
} while (<表达式>)

//for...in语句

for ( 变量 in 对象 ){
<语句组>
}

var i={
name:'leo',
age:'27',
city:'shanghai'
};
for(var key in i){
console.log(key);
}

函数

函数概念：独立于主程序的、具有特定功能的一段程序代码块。

函数定义：

//一般函数

function 函数名([参数[,参数...]]){
<语句组>
[return <表达式>；]
}

//匿名函数

var fun=function(x){
if (x >= 0) {
return x;
} else {
return -x;
}
};

函数调用：

函数名([参数[,参数...]]);

<script>
function tell(name){
document.write("I am"+name);
}
tell("leo");
</script>

事件

定义：可以被 JavaScript 侦测到的行为，事件通常与函数配合使用，当事件发生时函数才会执行。

常见事件：onclick、onfocus、onblur、onmousedown、onselect、onsubmit

调用：浏览器等待用户的交互操作，并在事件发生时，自动调用事件处理函数，完成事件处理过程。

对象详解

原则：在js中一切皆对象

Date对象：

var date=new Date();
date;
//格式：日期对象名称.方法（[参数]）
date.getFullYear();//2016 年份
date.getMonth(); // 月份，注意月份范围是0~11，5表示六月
date.getDate(); // 日期
date.getDay(); //  表示星期几
date.getHours(); // 小时, 24小时制
date.getMinutes(); //  分钟
date.getSeconds(); // 秒
date.getMilliseconds(); // 毫秒数
date.getTime(); //  以number形式表示的时间戳
/**
*其他方法
Date.parse(日期字串) 返回对应日期基线的毫秒
setTime(时间值) 指定一日期对象的值
toGMTString() 以GMT格式表示日期对象
toUTCString() 以GMT格式表示日期对象
*/

数组对象

/**
*
*新建数组
　　1. 数组对象名称=new Array([元素个数])
　　2. 数组对象名称=new Array([[元素1][，元素2，...]])
　　3. 数组对象名称=[元素1[，元素2，...]]
*/
var j = ['A', 'B', 'C', 1, 2, 3];
var arr = ['A', 'B', 'C'];
var s=new Array('apple','orange','banan');
s.length;//数组的属性length
s.indexOf('orange');//搜索一个指定的元素的位置
s.slice(0,1);//截取Array的部分元素，然后返回一个新的Array：
s.push('A', 'B');//向Array的末尾添加若干元素
s.pop();//把Array的最后一个元素删除掉
s.unshift('hello'); //往Array的头部添加若干元素
s.shift();//把Array的第一个元素删掉
s.sort();//默认排序
s.reverse();//数组翻转
s.splice();//从指定的索引开始删除若干元素，然后再从该位置添加若干元素
arr.concat([1, 2, 3]);//当前的Array和另一个Array连接起来，并返回一个新的Array：
j.join('=');//当前Array的每个元素都用指定的字符串连接起来，然后返回连接后的字符串

面向对象

三大特性：封装、继承、多态

注意：1. JavaScript不区分类和实例的概念，而是通过原型（prototype）来实现面向对象编程。

2. JavaScript的原型链和Java的Class区别就在，它没有“Class”的概念，所有对象都是实例，所谓继承关系不过是把一个对象的原型指向另一个对象而已

其他

JSON

序列化：

var xiaoming = {
name: '小明',
age: 14,
gender: true,
height: 1.65,
grade: null,
'middle-school': '\"W3C\" Middle School',
skills: ['JavaScript', 'Java', 'Python', 'Lisp']
};

JSON.stringify(xiaoming);

反序列化

JSON.parse('[1,2,3,true]');