002_JS基础_JavaScript基础语法01

2.1 注释

单行注释：在某一行使用“//”(两条斜线)可以把斜线之后的内容进行注释；
多行注释：使用“/* 这是要注释的内容 */”可以进行多行注释；

/*

弹出一个警告框

*/

alert("Js外部链接");

//向页面中输出Hello World

document.write("Hello Wolrd");

2.2 一些注意

JS中严格区分大小写，即大小写敏感；
JS中每一条语句以分号（;）结尾；如果不写分号，浏览器会在解析时自动添加，但是这样会消耗少量的系统资源，甚至有时浏览器会加错分号的位置，导致解析出错，所以在开发中一定要养成在语句末尾写分号的好习惯；
JS中忽略多个空格和换行；在写代码的过程中，我们可以格式化代码以更加美观。

2.3 字面量和变量

字面量：是一些不可改变的值，例如整数、浮点数以及字符串等，字面量可以直接使用，但是在程序中一般不会直接使用字面量。
变量：变量可以用来保存字面量，而且变量的值可以任意改变，变量更方便我们的使用。在开发中，我们都是使用变量来保存字面量，很少直接使用字面量。
使用变量：在js中使用关键字var（variable的缩写）申明变量。

//申明变量

var a;

//为变量赋值

a = 123;

//申明的同时进行赋值

var b = 100;

//还可以用一个 var 语句定义两个或多个变量;

var test1 = "hi", test2 = "hello";

//使用变量

console.log(a);

2.4 标识符

在js中所有我们可以自主命名的都可以称为标识符，例如变量名，函数名，属性名等等, 命名要注意不能是js的关键字和保留字,同时要遵守命名规则；
JS底层保存标识符实际是采用的Unicode编码，所以理论上将，所有的utf-8中含有的内容都可以作为标识符。例如变量名可以是中文，但是我们在实际中一定不能这样去使用。
值得我们注意的是，一个好的标识符名称应该是做到见名知意，提高代码的可阅读性。

命名规则：
1.第一个字符必须是字母、下划线（_）或美元符号（$）;
2.余下的字符可以是下划线、美元符号或任何字母或数字字符;

三个著名的命名规则：

Camel标记法（常用，中文名：驼峰命名法）：首字母小写，接下来的每个单词首字母大写；e.g. playerName
Pascal标记法：首字母大写，接下来的每个单词首字母都大写；e.g. MyTestValue
匈牙利类型标记法：在以Pascal标记法前面加一个小写字母，说明该变量的类型；

附录：
js关键字： break, do, instancesof, typeof, case, else, new, var, catch, finally, return, void, continue, for, switch, while, default, if, throw, delete, in, try, function, this, with, debugger, false, true, null;
js保留字符： class, enum, extends, super, const, export, import, implements, let, private, public, yield, interface, package, protected, static;

2.5 数据类型

数据类型就是指字面量的类型，在JS中一共有六种数据类型，String（字符串），Number（数值），Boolean（布尔值），Null（空值），Undefined（未定义），Object（对象），其中前五中为基本数据类型，最后一个Object为引用数据类。下面简单介绍基本数据类型：

String 字符串
- 在js中字符串需要用引号引起来(单引号或者双引号都可以)；
- 引号不能嵌套，双引号里面不能直接放双引号，双引号里面可以放单引号或者相反；
- 在字符串中，我们可以使用反斜杠（\）作为转义字符，例如 \" 表示";
Number 数值
- 在js中所有的数值都是Number类型，包括整数和浮点数；
- 使用一个运算符typeof来检查一个变量的类型；语法：typeof 变量名；
- Js中可以表示的数值的最大值：Number.MAX_VALUE = 1.7976931348623157e+308，如果使用Number表示的数值大于了MAX_VALUE则会返回一个Infinity，表示正无穷；
- -Infinity表示负无穷，使用typeof -Infinity返回number。
- 还有一个数值是MIN_VALUE = 5e-324，这明显是一个整数，表示的是0以上的可以表示的最小的小数；
- NaN是一个特殊的数字，表示Not A Number（不是一个数）;例如：var a = "abc" * "cba"; console.log(a); 此时将在控制台打印输出 NaN，使用typeof NaN返回number；
- 整数的运算基本可以保证运算结果的精确；
- 如果使用js进行浮点数的运算，可能得到一个不精确的结果，例如console.log(0.1+0.2) 将得到结果0.30000000000000004；
- 如何表示其他进制的数字？（输出后都会自动转换为十进制）
  - 表示十六进制的数字，以0x开头；
  - 表示八进制的数字，以数字0开头；
  - 表示二进制的数字，以0b开头，注意不是所有的浏览器都支持；
Boolean 布尔值
- 布尔值只有两个值，true表示真，false表示假；
- 使用typeof检查布尔值时，将返回boolean；
Null 空值
- Null类型的值只有一个，就是null；
- null这个值专门用来表示一个为空的对象；
- 使用typeof检查null值时，将返回object；
Undefined 未定义
- Unfedined类型的值只有一个，就是undefined；
- 当声明一个变量但是并没有赋值时，它的值就是undefined；
- 使用typeof检查一个只声明没有赋值的变量时，返回undefined;

2.6 强制类型转换

强制类型准换是指将一个数据类型转换为另一种数据类型。

将其他的数据类型转换为String
- 方法一：调用被转换对象的toString() 方法，注意该方法不会影响原变量，它会将转换的结果返回。另外null和undefined这两个值没有toString()这个方法，如果调用，则会如下错误：
  Uncaught TypeError: Cannot read property 'toString' of null；
- 方法二：调用String() 函数，并将被转换数据作为参数传入该函数。使用该方法时，对于Number和Boolean时，实际上还是调用的toString()方法；对于null和undefined时，将直接装换成字符串"null"和"undefined";
将其他的数据类型转换为Number
- 方法一：使用Number() 函数；
  - 字符串-->数字，若字符串为存数字，则返回number类型的数字；若字符串中包含非数字，则返回NaN；若字符串是一个空串或者全是空格的字符串，则返回数值0；
  - 布尔值-->数字，若布尔值为ture，则返回1；若布尔值为false，则返回0；
  - null-->数字，则返回0；
  - undefined-->数字，则返回NaN；
- 方法二：这个方法主要用于把字符串转换为数值；
  - 函数parseInt()把一个字符串中的数字转换为一个有效的整数，函数parseFloat()把一个字符串转换成一个有效的浮点数；
  - 若字符串的首位为非数字，则返回NaN；
  - 注意如果对一个非String类型使用上述两个函数，它会先转化为String，在进行操作。例如a = true; 则调用上述方法后会返回NaN；
  - 像"010"这种字符串，将其转换为整数，有的浏览器会当成八进制解析为8，有的会当成十进制解析为10，若遇到这种情况，可以使用parseInt("010",10)函数来指定数字的进制；
将其他的数据类型转换为Boolean
- 方法一：调用函数Boolean();
  - 数字-->Boolean：0和NaN返回false，其余的都是true；
  - 字符串-->Boolean：除了空串（var a = ""），其余的都是true；
  - null-->Boolean：false；
  - undefined-->Boolean：false；
  - 对象-->Boolean：true;
- 方法二：隐式类型转换，为任意的数据类型作两次非运算；

2.7 运算符

运算符又叫做操作符，它可以对一个或者多个值进行运算，并获取运算结果；之前见过的typeof就是一个运算符，它可以获取值的类型，它会将该值的类型以字符串的形式返回。

算数运算符：‘+’，‘-’， ‘*’， ‘/’，‘%’；

对于非Number类型的值进行运算时，都会将其转换为number类型后再进行运算；
任何值和NaN做运算时，结果都是NaN；
如果对两个字符串进行加法运算，则此时+表示连接字符串的符号；
任何值和字符串做加法，都会先转换为字符串，然后再和字符串做拼串的操作我们可以利用这一特点将任意的数据类型准换为字符串，只需要为该任意类型加上一个空串（""），其返回结果便是一个String，这是一种隐式的类型转换，由浏览器自动完成，实际上也是调用的String()函数；

//注意运算顺序

var result = 1 + 2 + "3";

console.log(result); //result结果为'33'，类型为string

var result = "1" + 2 + 3;

console.log(result); //result结果为'123', 类型为string

任何值做- * /运算时都会自动转换为Number，我们可以利用这一特点做隐式的类型转换，可以通过为一个值'-0', '*1', '/1'来将其转换为Number。

一元运算符：只需要一个操作数，正号（+），符号（-），检查数值类型（typeof）；

对于非Number类型的值，它会先准换为Number类型，在做运算；
我们通过上面这一特点，可以对其他类型的值前面加一个正号（+），即可转换为number类型；

var result = 1 + +"2" + 3;

console.log(result); //result结果为6，类型为number

自增和自减：

自增（++）：通过自增可以在变量的自身基础上加1；
自增分为两种前++（a）和后（a++）；
无论是a还是a，都会立即使a的值自增1；
不同的是a和a的值不同，a++等于原变量的值（自增前的值）；++a等于原变量自增后的值；

var a = 10;

console.log("a++ = " + a++); //输出值为10

var b = 10;

console.log("++b = " + ++b); //输出值为11

自减（--）：通过自减可以在变量的自身基础上减1；
自减也是分为两种，同自增；

逻辑运算符： js中一共有三种逻辑运算符。

! 非，非运算就是对一个布尔值进行取反操作；
&& 与，可以对符号两侧的值进行与运算，js中的与运算是“短路”的，第一个值为true则检查第二个值，若第一个为false，便直接返回false，不会查询第二个值；
|| 或，只要有一个true，便返回true；同样也是“短路”的。

注意：对于非布尔值进行与或运算时，会先将其转换为布尔值，然后在进行运算，并且返回原值；与运算：如果两个值都是true，则返回后面的那个原值；如果两个值中有false，则返回靠前的false。或者按照“与”的短路原则理解：如果一个值为true，则必然返回第二个值；如果第一个值为false，则直接返回第一个值。
或运算：如果第一个值时true，则直接返回第一个值的原值；如果第一个值为false，则直接返回第二个值的原值。

var result;

//&&运算符左右两侧都为true

result = 'a' && 1; //result = 1;

result = 1 && 'a'; //result = 'a';

//&&运算符左右两侧都为false

result = NaN && "";//result = NaN

result = "" && NaN;//result = ""

//&&运算符左右两侧一个true一个false

result = 1 && NaN;//result = NaN

result = NaN && 1; //result = NaN

//||运算符左右两侧都是true

result = 1 || 2; //result = 1;

result = 2 || 1; //result = 2;

//||运算符左右两侧都为false

result = NaN || ""; //result = "";

result = "" || NaN; //result = NaN;

//||运算符左右两侧一个true，一个false

result = 1 && NaN; //result = 1;

result = NaN && 1; //resutlt = 1;

赋值运算符：

“=”，将符号右侧的值赋值给符号左侧的变量； a = 2 + 3；
“+=”， a += 5 等价于 a = a + 5;
“-=”， a -= 5 等价于 a = a - 5;
“*=”， a *= 5 等价于 a = a * 5;
“/=”， a /= 5 等价于 a = a / 5;
“%=”， a %= 5 等价于 a = a % 5;

关系运算符：通过关系运算符可以比较两个值之间的大小关系，若成立则返回true，否则返回false；关系运算符有>，<，>=，<=，==，!=, ===, !==
注意：非数值的情况，现将其转换为数字在进行比较；任何值和NaN做比较都是false；
特殊情况：如果符号两侧的值都是字符串时，不会将其准换为数字比较，而是比较字符的unicod编码，并且是一位一位的进行比较。所以一定要注意在比较两个字符串类型的数字时，一定要将其中一个字符串转换为数字（字符串前面加+即可）；
补充：如何输出Unicode编码对应的字符？
js中：在字符串中使用转义字符输入Unicode编码，\u四位编码，例如：console.log("\u2620"); 则会输出 ☠（一个骷颅头的标志）；
HTML中：格式：“&#编码;”，注意此处编码要准换为十进制；例如在网页中打印上面的骷颅头符号：<h1>☠</h1>
相等运算符：== ，当使用==来比较两个值时，如果两个值的类型不同，则会自动进行类型转换，将其转换为相同的类型在进行比较；
全等运算符： === ，当使用三个等号做全等时，它和相等类似，不同的是当两个值的类型不一致时，直接返回false；

console.log("1" == 1); //true

 console.log(true == "1"); //true

 console.log(null == 0); // false 

 //undefined衍生自null，所以这两个值做相等运算时会返回true；

 console.log(undefined == null); //true

//NaN不和任何值相等，包括它本身

console.log(NaN == NaN); //false

console.log(1 == NaN); //false

//如何判断一个数是NaN,使用函数isNaN()

var a = NaN;

console.log(isNaN(a)); //true

//全等运算符

console.log("1" === 1); //false

console.log(null === undefined); // false

//不全等

console.log("1" !== 1); //true

条件运算符：又叫作三元运算符；格式：“条件表达式?语句1:语句2”，执行流程：首先对条件表达式进行求值，若该值为true，则执行语句1并返回执行结果；若为false则执行语句2并返回执行结果。若条件表达式为非布尔值，则会自动转换为布尔值在执行对应的语句。
获取a和b的较大的值： var max = a > b ? a : b;
获取a,b,c中的最大值： var max = a > b ? (a > c ? a ： c) : (b > c ? b : c);

运算符的优先级：
逗号运算符(,)可以用来分割多个语句，一般在申明多个变量时使用；var a = 1, b = 2, c = 3;
和数学中一样，js中也有运算符的优先级；参照优先级表，优先级越高，就先执行，若优先级相等，安装表达式从左到右计算；我们可以使用括号灵活的执行的先后顺序。