JavaScript全总结之控制和函数

流程控制语句

• 最常用的当然是if

if(condition){
    //true statement
}else {
    //false statement
}

其中js很厉害的一点就是conditon不一定是布尔值，会帮你自动转换。

• 当分支比较多，然后就用if还是挺麻烦的，就可以使用switch

switch(expresstion){
    case value1:
        statement;
        break;
    case value2:
        statement;
        break;
    case value3:
        statement;
        break;
    default:
        statement;
}

• switch和case可以使用任意表达式，不一定是常量
• switch语句进行比较的时候是全等于（===）操作，不会发生类型转换
• while和do-while

while(expression){
    statement;
}
do{
    statement;
}while(expression);

• while语句属于前测试循环语句，也就是在循环体内的代码被执行之前，就会对条件求值，不符合的话就不会执行
• do-while是后测试循环语句，在出口条件判断之前就会执行一次代码
• for和for-in

for(var i = 10; i > 0; i--){
    console.log(i);
}
for(property in object){
    statement
}

• for语句也是前测试循环语句，但具备在执行循环代码以前初始化变量和定义循环后要执行代码的能力，改造一下while语句
• for-in是一种迭代语句，用于枚举对象的属性
• break和continue

for(var i = 1; i< 10; i++){
    if(i % 4 === 0){
        break;
    }
    console.log(i);
}
for(var i = 1; i< 10; i++){
    if(i % 4 === 0){
        continue;
    }
    console.log(i);
}

• break 用于强制退出循环体，执行循环后面的语句
• continue 用于退出本次循环，执行下次循环

函数和作用域

JavaScript函数是指一个特定代码块，可能包含多条语句，可以通过名字来供其它语句调用以执行函数包含的代码语句。

1. 声明函数
   ECMAScript规定了三种声明函数方式

• 构造函数
  首先函数也是对象的一种，我们可以通过其构造函数，使用new来创建一个函数对象
  var printName = new Function("console.log('Byron');");
  不推荐使用
• 函数声明

function functionName(){
    statement;
}
使用function关键字可以声明一个函数，看个例子
function printName(){
    console.log('Byron');
}
printName();

• 函数表达式

var printName = function(){
    console.log('Byron');
};

2. 参数

function printName(name){
    console.log(name);
}
printName('Byron');
printName('Casper);

• 定义函数的时候在括号内写了个name做占位符，也就是在定义函数的时候也不知道要输出什么，用个占位符代替，在函数实际执行的时候，用真实的值替代占位符.
• 我们说的占位符在术语上叫做形参，也就是形式参数，而在调用函数的时候传入的值叫做实参，也就是实际的参数
  在函数内部,你可以使用arguments
• 对象获取到该函数的所有传入参数

3. 返回值
   有时候我们希望在函数执行后给我们一个反馈，就像表达式一样，给我们个结果，我们可以通过return
   来实现，调用return后，函数立即中断并返回结果，即使后面还有语句也不再执行，其实我们不写return语句，函数也会默认给我们返回undefined

4. 命名冲突

• 当在同一个作用域内定义了名字相同的变量和方法的话，无论其顺序如何，变量的赋值会覆盖方法的赋值

 var fn = 3;
function fn(){}
console.log(fn); // 3

• 当函数执行有命名冲突的时候，函数执行时载入顺序是 变量、函数、参数。看个例子

function fn(fn){
   console.log(fn); 
   var fn = 3; 
   console.log(fn);
}
fn(10); //10 3

5. 作用域
   在JavaScript中{}并没有带来块作用域，JavaScript的作用域是靠函数来形成的，也就是说一个函数内定义的变量函数外不可以访问
6. var
   在声明变量的时候需要var，不写var会声明一个全局的变量，这是我们在编程中应该要避免的，即使真的需要全局变量，也应该在最外层作用域使用var声明
7. Function.prototype.bind
   ES5 为Function新增bind方法
   Function.prototype.bind返回一个把内部this设为thisArg的方法，读起来很绕，其实就是，返回一个新方法，这个方法内部的this是参数thisArg
   说的再简单一点就是——改变this的目标。

// DOM
<div id="test">Click Here</div>
// js
var handler = {
    message: 'This is a test',
    click: function () {
        alert(this.message);
    }
};
document.getElementById('test').onclick = handler.click;

如果这样绑定div的click事件处理程序，大家都会看出来，点击的时候弹出来的对话框内容是undefined，因为执行的时候this是window，我们需要一定的技巧才可以处理此事，达到预期效果，但是使用新添的bind我们可以轻松改变this

document.getElementById('test').onclick = handler.click.bind(handler);