{{name}}
性别{{gender==1?"男":"女"}}
学习js的课堂笔记（一）---基础
一、编程语言
c语言
是一种编译语言
hello.c无法直接运行在操作系统上
编写-> 编译 ->运行（直接运行在操作系统上）
Java语言（跨平台）
编写-> 编译 ->运行（运行在jvm）
js语言（nodeJS）
解释性语言
弱类型语言
编写 -> 运行
二、快速入门
1、js组成
IE ----- ies
firefox ----- ffs
google chrome ----- gcs
opera
safari
ECMAScript (ECMA)
js语法标准
变量
数据类型
关键字
操作符
语句（流程，循环）
数组
面向对象
js开发者
js解析者
DOM (jquery)
文档对象模型
js语法标准开发出来的操作元素的js库
var dom = document.getElementById()
dom.onclick()
BOM
浏览器对象模式
window.alert();
confirm()
prompt()
setInterval()
setTimeout()
2、第一个js例子：hello.js
var str = “hello”;
console.log(str);
$ node hello.js
3、js注释
// 单行注释
/**/多行注释
1:1
html注释
css注释 /**/
4、 关键字和保留字
var str = “hello”
var, if, else, while, do, switch,…
5、变量
可以变化的量
js中的变量是弱类型的。变量的数据类型只有在初始化的时候才能被确定
1) 弱类型
var a ; //undefined
a = 3; //number
a = true //boolean
a = “19” //string
a = null //null
-
变量声明
var a ;
var b , c; -
初始化
a = 3;
b = true; -
变量声明的提升
console.log(e); //undefined
var e = 3;-> var e; (声明提升) console.log(e); e = 3;
5)变量的数据类型
①基本数据类型（5种）
1.1 string
“true” ‘1’
“hello"11"world”
" ’ \t \n
1.2 number
1 1.1
NaN (not a number)
isNaN(变量)
如果变量为NaN，那么返回true
Infinity
var a = 1/0;
无限大
isFinite(变量)
如果变量正常，返回true
1.3 boolean
true / false
1.4 undefined
未初始化
以undefined来初始化
1.5 null
以null来初始化
function createPerson(name,age){
var person = null;
if(name && age){
person = new Object();
person.name = name;
person.age = age;
}
return person;
}
var p = createPerson("terry",22);
if(p == null){
console.log("未初始化");
} else {
console.log(p.name);
}
if(typeof a == 'boolean') {
}
判断变量所属数据类型
typeof 变量名
②引用数据类型
除了基本数据类型之外所有的其他数据类型都为引用数据类型
三、JS中的操作符
1) 算术运算符 (Number)
+ +=
- -=
* *=
/ /=
% %=
5%2 = 1
var a = 3;
a+=3
//a = a+3;
2) 一元运算符
++
前置，先自增再参与其他运算
var a = 3;
var b = ++a + 1;
后置，先参与其他运算再自增
var a = 3;
var b = (a++)+1;
--
与++类似
+
var a = 3;
+a;
var a = 'a';
+a;
将其他类型转化为Number类型
-
var a = 3;
-a // -3
var a = 'a''
-a
将其他类型转换为Number类型，再加-
+a
-（-a）
3) 比较运算符 （boolean）
== 比较值
=== 先比较数据类型再比较值
null == undefined //true undefined派生自null
null === undefined //false
'12' == 12 //true
'12' === 12 //false
!=
!==
>
<
>=
<=
4) 逻辑运算符(短路运算符) (boolean)
&& 并且
同真则真，有假则假
exp1 && exp2
exp1,exp2可以为boolean也可以为其他数据类型，如果为其他数据类型在运算前先转换为boolean在进行运算
exp2 = true
exp1 = false
如何证明？
||
有真则真，同假才假
var a = 3;
var b ;
var input = '19';
!
var a = true
!a //false
var a = 'hello';
!a //false
快速将其他类型转换为布尔类型的方法
!!a
5) 三目运算符
? :
boolean_exp ? exp1 : exp2;
var xb = gender == 1 ? '男' : '女';
var a = day==1?'周一':day==2?'周二':'周三'
姓名
6) 位运算符
四、基本数据类型的类型转换
1) 将其他数据类型转换为Number
转换
+a
-(-a)
Number(a)
true 1
false 0
undefined NaN
解析
parseInt() 解析为整数
parseFloat() 解析为小数
true NaN
false NaN
undefined NaN
2) 将其他数据类型转换为Boolean
!!a
Boolean(a)
number
非0/Infinity true
0/NaN false
string
非空字符串 true
空字符串 false
null false
undefined false
- 将其他数据类型转换为String
var a = true;
a = a+’’
五、流程控制语句
1) if语句
if(exp){
//…
}
当exp为真，才可以执行大括号中的内容
当exp不为boolean的时候，先转换为boolean类型
2) if-else
if(condition) {
exp1
} else {
exp2
}
当condition为真，执行exp1，否则执行exp2
3) if-else if - else
if(condition1){
exp1
} else if (condition2) {
exp2
} else {
exp3
}
4) switch
var day = "3";
switch(day){
case 1:
break;
case 2:
break
case 3:
break;
default:
...
}
1. 变量与常量比较的时候使用===
2. 在case代码块不可以省略break;不然代码会直接向下执行直到遇到break或者代码结束
3. default的位置可以不在最后，当在其他位置上时，break不能省略
六、 循环语句
要素
初始化条件
结束条件
迭代
1) for循环
for(初始化条件; 结束条件; 迭代) {
//循环体
}
初始化条件执行1次
结束条件执行 n+1次
迭代 n次
1 + 2 + 3 + ... + 100
(1+100)*50
2) do-while
var i = 10;
var total = 1;
do {
total *=i;
i--;
} while(i>0);
3) while
var i = 10;
var total = 1;
while(i>0){
total *= i;
i--;
}
10
4) for-in (增强for循环)
主要用于遍历数组或者对象
var arr = ["terry","larry",true,12];
for(var i in arr){
console.log(i);
}
七、对象
引用数据类型
复杂的数据结构，类似于C语言中的结构体，用于保存多个值。
1) 创建
1. 通过构造函数（根 Object）
Object是一个构造函数，所有的子构造函数都继承自Object
var obj; //创建一个东西
obj = new Object(); //引用
obj.name = 'terry';
obj.age =22;
obj.gender = true;
var a ;
a = 12; //基本
2. 使用对象字面量
var obj = {
name:'terry',
age:12,
gender:true,
firends:null
};
属性名与属性值通过:隔开，属性与属性之间通过,隔开。属性名可以不加引号。当属性名出现特殊字符，需要加引号。 属性可以动态添加删除
2) 对象属性的访问
var obj = {name:'terry',age:12};
obj.属性名
obj.name
obj[属性名]
obj['name']
=>
var a = 'name';
obj[a]
属性删除
delete obj.key
3) 引用拷贝，值拷贝
var obj1 = {name:'terry',age:12};
var obj2 = obj1;
obj2.age++;
obj1.age 13
obj2.age 13
var a = 1;
var b = a;
b++;
a 1
b 2
4) 检测
in
var obj = {name:"terry",age:12};
'name' in obj
user
if('gender' in user){
console.log(user.gender);
} else {
console.log('性别未初始化');
}
console.log(user.gender);
5) Object（拓展）
var obj = new Object();
=>
var obj = {};
Object是一个构造函数 人类
obj2构造函数产生的实例 李老师
Object
toString() 对象转换为字符串
valueOf() 对象转换为number
obj1 obj2 obj3
由于obj1是Object的实例，所以obj1可以调用Object中的方法。
obj2,obj3也同样可以。因为他们都属于Object的实例