零、JS引入
外部引入
<script type="text/javascript" src="js/index.js"></script> //写到body内的最后面
一、注释
快捷键：ctrl+/ //单行注释
快捷键：ctrl+shift+/ /*多行注释*/
二、输出
下面是三种不同的输出方式：
var name = 'Petter'; //将字符串Petter赋值给 变量name
1.控制台输出
console.log('Hello,world01'); //输出字符串 "Hello,world"
console.log(name); //输出变量 "Petter"
console.log('Hello,' + name + '01!'); //输出变量+字符串 "Hello,Petter!"
2.页面输出
document.write('hello,world02'); //能够在HTML页面里面输出内容
3.提示框输出
alert('hello,world03');
1.控制台输出
2.页面输出
3.提示框输出
三、变量
1.原始变量声明赋值用法（声明与赋值分开写）
var a; //声明变量a，分配内存
a = 10; //为变量a赋值
console.log(a); //控制台输出为10
2.简化变量声明赋值用法（声明与赋值一起写）
var a = 10;
console.log(a);
3.通过typeof来查看变量的数据类型
var a;
a = 10; // number
a = true; // boolean
a = 'Henrry Browne' // string
a = function(){}; // function
a = {age:26}; // object
console.log(a);
console.log(typeof a); //输出语句
四、标识符命名
- 标识符首字母可以用 abc _ $ 来开头，用驼峰命名法的英文单词
- 不能用关键字与保留字命名变量
- 变量名对大小写敏感 a 和 A 不是一个物种
五、关键字与保留字
- 关键字
JS正在使用的名称，用途包括：系统变量名、JS内置方法函数名、已知宿主环境提供的API
| break | do | instanceof | typeof | if | else |
|---|---|---|---|---|---|
| case | var | new | finally | return | void |
| continue | for | switch | while | debugger | function |
| this | with | try | catch | throw | delete |
| default | in | implements | package | public | interface |
| private | static | let | protected | yield |
- 保留字
将来javascript可能会用的名称。
| abstract | enum | int | short | boolean | export |
|---|---|---|---|---|---|
| byte | extends | long | super | native | synchronized |
| class | float | throws | const | goto | transient |
| volatile | double | import |
六、全局变量与局部变量
var a = "local var"; //a 在函数外部创建的 为全局变量
function print(){
console.log(a); // a 为全局变量，因为前面没加var
}
------
function test(y) { // 参数y为局部变量
var x = "global var" // x在函数内部创建 为局部变量
}
console.log(x); //x为局部变量
console.log(y); //y为局部变量
----------
// 块（block）
{
var x1 = "hello,world";
}
console.log(x1); // hello,world 结论：js（ES5）没有块级作用域
var n1 = "123"; // 声明全局变量
console.log(n1); //123
(function () {
var x2 = "Hi,boy";
console.log("自调用函数执行"); //自调用函数执行
console.log(n1); //123
})();
console.log(x2); x2为局部变量，这里无法访问
-
全局变量：函数外部定义的变量，其作用域（全局作用域）范围为整个文件系统。
-
局部变量：函数内部定义的变量/函数参数，其作用域范围为函数内部。
-
函数作用域：作用域就是函数变量起作用的区域 。
七、运算符与表达式
1. 基本运算符
+：加法运算符，如a + b-：减法运算符，如a - b*：乘法运算符，如a * b/：除法运算符，如a / b%：模运算（取余数），如a % b++：自增运算符（自身+1）--：自减运算符（自身-1）
var a = 'My name si:'; //字符串相加
var b = 'laoYe';
console.log(a + b); //控制台输出：My name si:laoYe
var a = 10;
var x = ++a; // x = 11, a = 11
var a = 10;
var x = a++; // x = 10, a = 11
console.log(x);
- 不管++在前，还是++在后，变量自身都会+1
- ++在前，先自增再赋值；++在后，先赋值在自增
2. 赋值运算符
var num = 10;
num = num + 10; //可以被简写为 num += 10;
console.log(num);
赋值运算符是为JavaScript中的变量赋值，即将该运算符右方计算出的值赋予左侧的变量。
=：赋值运算符，如x = 10;，将10赋值给变量x+=：变量与值相加，如x += y;相当于x = x + y-=：变量与值相加，如x -= y;相当于x = x - y*=：变量与值相加，如x *= y;相当于x = x * y/=：变量与值相加，如x /= y;相当于x = x / y%=：变量与值相加，如x %= y;相当于x = x % y
3. 关系运算符
关系运算符描述两个变量的关系，其返回值类型为布尔类型（boolean），即 true 和 false。
==：判断两个变量是否相等，如'Henrry Lee' == 'Henrry Lee'，返回true>：判断等号左边的变量是否大于等号右边的变量，如20 > 10，返回true<：判断等号左边的变量是否小于等号右边的变量，如20 < 10，返回false>=：判断等号左边的变量是否大于等于等号右边的变量，如20 >= 10，返回true<=：判断等号左边的变量是否小于等于等号右边的变量，如20 <= 10，返回false===：恒等于，要求不仅数据类型要一致，值也要一致，如1 === '1'，返回false!==：不恒等于，只要类型或值不一样，结果为true，如1 !== '1'，返回true
4. 逻辑运算符
逻辑运算符是JavaScript用于判断几条语句成立情况的一种运算，该运算符的返回值类型为布尔类型。
- 逻辑与：
&&，同时为真才为真，如(1 > 2) && (2 > 3)，返回false - 逻辑或：
||，同时为假才为假，如(1 > 2) || (2 > 3)，返回true - 逻辑非：
!，取反，如!(1 > 2)，返回true
5. 三元运算符
var isLogin = false;
isLogin ? console.log('已登录') : console.log('未登录');
-----
var a = 40, b = 30;
var max = a > b ? a : b;
console.log("max = " + max);
三元运算符：a ? b : c;
首先判断表达式a的值（true false），如果为true，则执行语句b
如果为false，执行语句c。
八、基本数据类型
1. 数值类型(number)
“0”、正数、负数、浮点数（小数）
var a = 0;
var b = 1;
var c = -1;
var d = 1.1;
console.log(typeof a); //控制台输出类型：number
console.log(typeof b); //控制台输出类型：number
console.log(typeof c); //控制台输出类型：number
console.log(typeof d); //控制台输出类型：number
2. 字符串类型(string)
放到 '' "" 单引号、双引号里面的就是字符串类型 "Hi" 'hi'
var a = '0';
var b = '1';
var c = '-1';
var d = '1.1';
console.log(typeof a); //控制台输出类型：string
console.log(typeof b); //控制台输出类型：string
console.log(typeof c); //控制台输出类型：string
console.log(typeof d); //控制台输出类型：string
注意：该类型特点是，引号内的值，你输入什么就显示什么。
3. 布尔类型(boolean)
true false
var a = true;
var b = false;
console.log(typeof a); //控制台输出类型：boolean
console.log(typeof b); //控制台输出类型：boolean
4. 对象类型(object)
数组是对象、空值
null也是对象 {}, []
console.log(typeof []); // object
console.log(typeof {}); // object
5. 函数类型(function)
// 定义函数
function sum(a, b) {
return a + b;
}
// 调用函数
var result = sum(10, 20);
console.log(result); // 30
函数类型是JavaScript中最复杂的一个数据类型，但它在JavaScript中扮演中相当重要的作用，它也同是面向对象编程中一个非常核心的内容。函数的设计非常大程度地决定了一个网站或应用的性能。从编程角度来讲，它直接影响到了代码的可复用性，代码量，可以维护性，可扩展性等因素。这个对于JavaScript的初学者来说也是最难掌握好的一个部分，就算一个已经工作了好几年的Web前端开发工程师，在对函数的组织和优化上都会下不少功夫。
