JavaScript(一)——基本语法+数据类型+基本运算

js输出

输出方式

• window.alert() 浏览器弹出的警告框
• document.write() 写到HTML文档中
• innerHTML 写到html元素中
• console.log() 写到浏览器控制台

代码示例

警告框

window.alert("这是警告框");

写入html文档中

document.write("<p style='color: red;'> document.write</p>");

写入html元素中

document.getElementById("text").innerHTML="<p style='color: red;'> document.write</p>";

诸如window.alert()的函数window可省略
document.write()和innerHTML作用都是写入一个html语句，区别在于document.write()是将语句写入整个HTML文档中，而innerHTML需要获取指定的元素然后将语句写入元素中

js语句与注释

JavaScript语句标识符

var、let、if、for等称为语句标识符

var和let都用做变量的声明，区别在于var具有声明提升，let不具有
function函数也具有声明提升
声明提升是指变量或者函数在任何位置声明，都可以在做在代码的最前面声明，即代码顺序不会影响变量或者函数的调用

代码块

如函数

function x(){
	var a = 1;
	var b = 1;
}

在调用此函数时整段代码全部执行，该段代码称作一个代码块

注释

//这是单行注释
/*
 * 这是多行注释
*/

js数据类型

• 字符串(String)
• 数字(Number)
• 布尔(Boolean)
• 数组(Array)
• 对象(Object)
• 空(Null)
• 未定义(Undefined)

数组

//数组
var a = new Array();//声明一个大小为0的数组
var b = new Array(2);//声明一个大小为2的数组
			
//给数组赋值可以随意给定索引，中间未赋值的索引会空出
a[0]="1";
a[3]="2";
b[3]="1";
			
//在js中数组和对象时互通的，当给定字符串作为索引时，会以键值对的形式存入
b['a']="x";
			
//创建数组同时初始化对象
var c = ["1","3"];
var d = new Array("1","2","3");
			
console.log(a);
console.log(b);
console.log(c);
console.log(d);

1. 数组的大小没有限定，即使设置了初始化大小也是可以改变的
2. 数组和对象是可以相互转换的，当数组索引是字符串时，就对应了对象中的键值对

对象

//对象
var student={
	id:1,
	name:"张三",
	age:18,
}
//通过键值对的方式存储
console.log(student);
console.log(student.age);
console.log(student["name"]);

1. 通过键值对的方式存储数据
2. 可以通过对象名.属性或者**对象名[属性]**来通过键获取值，键相当于索引

空和未定义

//空和未定义
var a;
console.log(a);
a = null;
console.log(a);

undifined表示只是被声明了，此处应该有值只是还没有定义

1. 变量被声明了但没有定义
2. 函数被调用了但还没有提供参数，该参数为undifined
3. 对象中还没有赋值的属性
4. 无返回值的函数，默认返回undifined

null表示定义了值不过该值为空值
可作为函数的参数使用，表示该函数的参数不是对象类型

变量

1. 变量必须以字母、_、$开头，但不推荐使用 $和 _
2. 变量的命名大小写敏感

函数

定义

函数是由事件驱动的或者当它被调用时执行的可以重复使用的代码块（函数具有声明提升）

声明方式

• function x(){}
• var x = function(){}匿名函数

//普通函数
function x(){
	console.log(1);
}
x();
//匿名函数
var y = function(){
	console.log(2);
}
y();

return值

//return值
function z(){
	return 2;
}
var a = z();
console.log(a);

构造函数

//构造函数
function Student(id,name,age){
	this.id = id;
	this.name = name;
	this.age = age;
	this.sayHi = function(){
		alert("Hi");
	}
};
var s = new Student(1,"张三",18);
s.sayHi();
console.log(s);

1. 构造函数的命名一般首字母大写
2. 构造函数的作用是新建一个对象
3. 构造函数需要new 函数名()来调用，这个函数名也是该对象的类名
4. 构造函数内部用this来构造属性和方法
5. 构造函数会创建一个新对象并且返回，而普通函数在没有返回值的时候会返回undifined

运算符

算术运算符

• 赋值运算符 =、+=、-=等
• 算数运算符+、-、*、/等（弱类型，定义了a=1也可以给a赋值为1/3）
• 字符串的+运算（与java相同，直接连接）

逻辑运算符

小于、大于、等于、绝对等于、不等于、与、或

等于与绝对等于

//等于和绝对等于
var a = 1;
console.log(a=="1");
console.log(a==="1");
//不等于绝对不等
console.log(a!="1");
console.log(a!=="1");

==会忽略数据类型，仅仅比较值是否相同
===比较数据类型和值是否都相同

条件语句

if语句和switch语句

switch

var a=1;
switch(a){
	case 5:
	console.log(1);
	break;
	case 2:
	console.log(2);
	break;
	default:
	console.log("null");
	break;
}

当所有case都不满足时执行default下的代码块