javascript二：基本概念以及作用域

四种输出方式：

1. window.alert() : 写入警告框
2. document.write() ：写入HTML输出，会删除已有的HTML语句
3. innerHTML : 写入HTML元素
4. console.log() : 写入浏览器控制台

同步例子：
http://blueskyawen.com/angular-work-cook/main/webcop/web-start/cardsMore

1 基本概念

1.1 变量

1. 变量申明：

var num1 = 2;

2. 变量算术运算

var x = “bill” + " " + “Gates”;      //x为bill Gates
var x = “8” + 3 + 5;      //x 为835，默认为字符串级联
var x = 5 + 3 + “8”;      // x为88。。。。。神奇的操作

1.2 数据类型

类型	描述	示例
Undefined	没有值的变量	var person;
NULL	数据类型是对象，通过设置为null清空对象	var person = null;
Bollean	布尔属性	var x = true;
String	字符串	var answer = “It’s alright”;
Number	数值类型，用不用小数点均可	var x1 = 34.00;
object	对象用花括号书写，name:value对，逗号隔开	var person = {firstName:“Bill”, lastName:“Gates”}

Undefined与Null的区别

 Undefined与null的值相等，但类型不相等；
 null === undefined           //false
 null ==  undefined			 //true

1.3 函数

函数结构如下：

function myFunction(p1, p2) {
    return p1 * p2;              // 该函数返回 p1 和 p2 的乘积
}

1. js没有重载，后面定义的函数会覆盖前面定义的函数；

1.4 字符串

函数	描述	参数	返回
indexOf()	返回字符串中指定文本首次出现的位置		number
lastIndexOf()	返回指定文本在字符串中最后一次出现的位置		number
search()	返回字符串中指定文本首次出现的位置		number
length	返回字符串长度		number
slice()	提取某个部分字符串并返回	起始索引，终止索引	string
substring()	提取部分字符串	起始索引，终止索引	string
substr()	提取部分字符串	起始索引，长度	string
replace()	替换字符串	需替换string,替换string	新的string
toUpperCase()	将字符串转换为大写
toLowerCase()	将字符串转换为小写
concat()	连接两个字符串	text3 = text1.concat(" ",text2);
trim()	删除字符串两端的空白符	str.trim();
charAt()	提取字符串字符	number	char
charCodeAt()	返回字符串字符Unicode	numbe	unicode
split()	字符串分割函数	txt.split("");//分割成字符

indexOf()与search()的区别：

1. indexOf()无法设置更强大的搜索值（正则表达式）；
2. search()无法设置第二个开始位置参数；

提取部分字符串三种方法区别：

1. slice() : 参数可以为负数，从尾到头
2. substring()：参数不能为负数
3. substr(): 第二个参数为提取字符串长度

1. replace()一次只能替换一个字符串，若想一次性替换全部字符串，需要用到正则表达式g标志
   var n = str.replace(/Microsoft/g, "W3School");
2. 取消大小写敏感，使用正则表达式/i;

1.4数字与数字方法

1. 精度：整数的精度为15位， 小数最大数是17位；

var x = 0.1 + 0.2; //x = 0.30000000000000004
var x = (0.2 * 10 + 0.1 * 10) / 10; // x 将是 0.3

2. 不同于c语言的大杂烩运算：

var x = 10, y = 20;
var m = “10”, n = “20”;
var sum = “The result is:” + x + y; //sum为1020
var sum = x + y + m; //sum = 3030
var z = n / x; //z = 10;(number)
var z = n /(*) m; //z = 10(1000);(number)
var z = n - m; //z = 10;(number)

> 计算时超出最大数返回Infinity;
  进制转换：tostring()

1.6 数组（方法/排序/迭代）

函数/属性	描述	备注
length	返回数组长度	、
toString()	把数组转换为字符串（逗号分隔）返回
join()	将所有数组元素结合为一个字符串	fruits.join(" * ")
pop()	从数组中删除最后一个元素	fruits.pop();
push()	在（数组结尾处）向数组添加一个新的元素	fruits.push(“Kiwi”);
shift()	移除数组第一个元素	fruits.shift();
unshift()	在数组开头添加新元素	返回新数组长度
delete	删除元素 delete fruits[2];
splice()	拼接数组，向数组添加新项	fruits.splice(2,“Kiwi”);
concat()	合并数组
slice()	剪裁数组
sort()	以字母顺序对数组进行排序
reverse()	反转数组中的元素
Math.max.apply()	查找数组中的最高值	Math.max.apply(null, arr);
Math.min.apply()	查找数组中的最小值
forEach()	为每个数组元素调用一次函数（回调函数）	numbers.forEach(myFunction);
map()	对每个数组元素执行函数来创建新数组	numbers1.map(myFunction);
filter()	创建一个包含通过测试的数组元素的新数组
reduce()	数组求和
every()	检查数组中所有数组值是否通过测试	返回值为bool
some()	数组中某些值是否通过了测试	返回值Bool
find()	返回通过测试函数的第一个数组元素的值

1.7 Math

1. Math.round() : 返回值是x四舍五入最接近的整数；
2. Math.pow(x, y) : 返回值是x的y次幂
3. Math.sqrt(x) : 返回x的平方根；
4. Math.abs(x) : 返回x的绝对值
5. Math.ceil(x) : 返回是x上舍入最接近的整数
6. Math.fllor(x): 返回值是x下舍入最接近的整数
7. Math.random() ： 返回介于0 ≤ x < 1之间的随机数

1.8 逻辑

所有不具有“真实”值的即为False
0 ； -0 ；""(空值)；undefined；null；NAN都是false;

1.9 比较

1. 字符串和数字进行比较时，会将字符串转换为数值；

2 语句

2.1 for-in语句

for-in 语句用来遍历对象的属性：

var person = {fname:"Bill", lname:"Gates", age:62}; 
var x;
for (x in person) {
  txt += person[x] + " ";
}

2.2 label语句

使用label标签可以在代码中添加标签，以便将来使用；示例如下：

start: for ( var i = 0; i < 10; i ++){
	alert(i);
	if (i == 5) 
		break start;
}

2.3 判断某个对象是否是数组或者日期方法

constructor属性返回js变量的构造器函数

function isArray(myArray) {   //判断是否为数组
    return myArray.constructor.toString().indexOf("Array") > -1;
}

function isDate(myDate) { 		//判断是否为日期
    return myDate.constructor.toString().indexOf("Date") > -1;
}

3 类型转换

函数	描述	示例
String(x)	从数值变量x返回字符串，全局方法	String(123)
toString()	同上，数学方法	123.toStrong()
Number()	字符串转换为数值	Number(" ") //返回0

> 移位操作是对**补码**进行操作

4 正则表达式

修饰符/表达式	描述	示例
正则表达式修饰符
i	大小写不敏感匹配	var patt1 = /w3school/i；
g	全局匹配	var patt1 = /w3school/g；
m	多行匹配	var patt1 = /^is/m;
[abc]	查找方括号之间的任何字符	var patt1 = /[h]/g；
[0-9]	查找任何从0-9的数字
\d	查找数字
\w	匹配字母，数字或下划线或汉字	等价于’[^A-Za-z0-9_]’
\s	查找空白字符
\b	匹配单词边界
n+	匹配任何包含至少一个n的字符串
n*	匹配任何包含零个或多个n的字符串
n?	匹配任何包含零个或一个n的字符串

1. test()是一个正则表达式方法，通过模式来搜索字符串，然后根据结果来返回true或false；
2. exec()时一个正则表达式方法，通过指定的模式（pattern）搜索字符串，并返回已找到的文本；

5 js异常

throw与try和catch一同使用，就可以控制程序流并生成自定义错误消息。
finally是无论try / catch 结果如何都执行的代码块

function myFunction() {
  var message, x;
  message = document.getElementById("p01");
  message.innerHTML = "";
  x = document.getElementById("demo").value;
  try { 
    if(x == "")  throw "是空的";
    if(isNaN(x)) throw "不是数字";
    x = Number(x);
    if(x < 5)  throw "太小";
    if(x > 10)   throw "太大";
  }
  catch(err) {
    message.innerHTML = "输入：" + err;
  }
  finally {
        document.getElementById("demo").value = "";
    }
}

6 js作用域

1. 局部变量会在函数完成时被删除，全局变量会在您关闭页面是被删除；
2. 函数参数也是函数内的局部变量；

6.1 全局作用域

1. 函数之外声明的变量，会成为全局变量；
2. 函数中为尚未声明的变量赋值，此变量会自动成为全局变量；

6.2 函数作用域

1. 在js函数中声明的变量，会成为函数的局部变量；
2. 局部变量的作用域是局部的，只能在函数内部访问它；
3. 在函数作用域中，let和var作用相似；

6.3 js块作用域

1. 通过var关键词声明的变量没有块作用域；在块{ }内声明的变量可以从块之外进行访问；
2. let关键词声明拥有块作用域的变量，在块{ }内声明的变量无法从块外访问；

{ 
  var x = 10; 
  var y = 10;
}
// 此处可以使用 x
//此处不可以使用y

6.4 循环作用域

循环作用域也可以说是块作用域之一，使用var和let的区别：

var i= 7；
for ( var i = 0; i < 10; i++){
	//省略十万行代码
}
//此处 i = 10;

let i = 7;
for (let i = 0; i < 10; i++) {
  // 此处省略又是10万行代码
}
// 此处 i 为 7

6.5 HTML中的全局变量

在HTML中，全局作用域是window对象。

var carName = "porsche";
// 此处的代码可使用 window.carName
let carName = "porsche";
// 此处的代码不可使用 window.carName

6.6 作用域提升（hoisting）

1. 通过var声明的变量会提升到顶部；
2. 通过let定义的变量不会被提升到顶部；

const常见注意点：

1. const变量必须在声明时赋值；
2. 将一个原始值赋给常量，就不能改变原始值；
3. 常量对象属性值可以更改，但是无法重新对常量对象赋值；
4. 常量数组属性值可以更改，但是无法重新对常量数组赋值；
5. 同一作用域或块中，不允许将已有的var或let变量重新声明或赋值给const;
6. 通过const定义的变量不会被提升到顶端；