bootstrap 学习之路 9 （javascript part1）

要想学好web编程，没有javascript还是不行的。所以接下来准备把我自己学javascript的几个过程记录下来。我准备分几部分来学习javascript. 学技术最好去官网学，所以去：http://www.w3schools.com/js/ 才是王道！
part1 主要是javascript的基本语法。只是基本语法，完全不能操作网页显示。我测试使用的是chrome 工具，javascript 控制台！
part2 javascript针对DOM编程，当然也包括DOM基础.
part3 javascript 高级应用。

开始javascript之前，先推荐一本书， javascript DOM编程艺术。 言简意赅、简洁明了。如果有编程基础，可能花1 、2 天看完，会有很大的收获的。

言归正传。

任何一门语言也就是学一门语法而已。语法大概包括：语句、注释、变量、数据类型、函数、操作符。条件判断和循环。
1. 语句：javascript跟其他语言差不多。var hello = 5; 表示一句，语句de结束可以是回车ye可以是分号。 如果想两行表示一句就是用 '\'
2.注释：没什么好讲的'\\'he /**/''
3. 变量： 变量有声明、定义、类型。在javascript中。var i 表示一个变量。var i，j 就是声明了两个变量。 如： var x=2; var y=3; var z = x+y;
4. 数据类型（重点）： javascript 数据类型包括：数字、数组、字符串、布尔。 javascript 的数据类型为动态数据类型。即一个变量在使用过程中数据类型可以变化。如：

var x;               // Now x is undefined
var x = 5;           // Now x is a Number
var x = "John";      // Now x is a String

数字（nuber）

var x1=34.00;      //Written with decimals
var x2=34;         //Written without decimals
var y=123e5;      // 12300000
var z=123e-5;     // 0.00123

字符串(string)

var answer="It's alright";
var answer="He is called 'Johnny'";
var answer='He is called "Johnny"';

数组

var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";
或
var cars=new Array("Saab","Volvo","BMW");
或
var cars=["Saab","Volvo","BMW"];

布尔类型

var x=true;
var y=false;//boolean类型只有这两个

4. 1 变量扩展：Object(对象).在javascript中所有的数据都是对象（用W3C官方原话就是，"Everything" in JavaScript is an Object: a String, a Number, an Array, a Date....）函数也是对象！一个对象)就是一个数据体，数据体中包含方法(method)和属性（properties）。

简要说下：

官网介绍一个car 就是一个对象，如下：



拿真实的例子来说。一个String对象可以是

var txt = "hello world";

或

var txt = new String("hello world"); //当做一个对象来使用

他在javascript 内部的表示如图：



4. 2 其实把变量当做对象来理解，很容易，真正的难点是把函数当做对象来理解。 函数在javascript中被称为function . 它同样是一个对象，包括properties and methods。 在这里method是方法。而function 是函数。 虽然在很多编程语言中function 和 method 是同一个概念。但在这里为了把对象的概念说清楚。可以这样理解。method是对象中的方法。而function 本身就是一个对象。 具体函数当做对象在下面介绍。

5. 函数：

5.1 函数的标准定义(其实跟其他编程语言的函数用法一模一样。不做赘述)：

function functionname()
{
some code to be executed
}
或
function functionname(parama,paramb)
{
some code to be executed
}
或
function functionname()
{
some code to be executed
 return any value;
}

5.2 函数也是对象：

这个概念很难理解。我们慢慢来。

5.2.1 对象的简单定义

person=new Object();
person.firstname="John";
person.lastname="Doe";
或
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};

使用方法：

person.firstname; //因为这个定义的就是一个对象！ 比如 var person = "";

这个比较容易理解。这是javascript对象定义的基本方法。这个就是一个对象。 甚至可以理解成一个变量person . 是一个高级语言的结构体。

5.2.2 构造函数构造对象。 比如C++中的class 中的构造函数。 使用构造函数来构造一个对象。 这个对象可以被定义多个。因为使用了构造函数，就具有扩展性。看例子

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname; //构造函数中都是使用this来表示当前的对象。其实对象本身是省略了。 全部都写入到构造函数中了。
this.age=age;
this.eyecolor=eyecolor;
}
使用方法：
var yao = new person("ming","yao","black");

这个是通过构造函数定义的。 所以就是只能使用new person();来构造一个新的对象来使用。因为是构造函数。

5.2.3 很拗口的理解。 javascript把函数(function)当做对象。其实是把每个函数当做是一个对象的构造函数。 你调用了这个对象的构造函数，当然就可以构造一个新的对象。

所以其实，javascript中的任何物体都是对象。就是真正的对象本身(跟变量对应)就是一个变量。可以随便使用。 而对象的主要概念还是说，函数就是构造函数。调用了函数就可以创建一个新的对象来使用。

5.2.4 javascritp对象的prototype模式和继承的方法。在这里不做描述，因为我找到了一个很好的介绍的网站，我前面的拗口的理解，如果理解了，就很容易看懂这个网站了。http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_encapsulation.html。 也可以参考书籍：object-oriented javascript 和 professional javascript for web developers,2nd
edition(我没看过)

6. 操作符，操作符没有什么可讲的就是+-*/之类。官网描述如下：

+  加  y = x+2       x= 5  y = 7    (x 初始值均为5)
- 减    y = x-2       x= 5  y = 3 
* 乘   y = x*2       x= 5  y = 10
/ 除    y = x/2       x= 5  y = 2.5 
% 求余   y = x%2       x= 5  y = 1 
++ 自增   y = x++   x= 6 y =5      或者y =  ++x       x= 6  y = 6 
-- 自减   y = x--    x=4  y = 5        或者   y=--x    x= 4  y = 4 
= 赋值    y = x       x= 5  y = 5 
+= 加赋值   x +=2       x= 7
-= 减赋值   x -= 2       x= 3 
*= 乘赋值   x * =2       x= 10  
/= 除赋值   x /= 2       x= 2.5 
%= 求余赋值  x %=2       x= 1

7. 条件判断和循环

条件其实就是：

if(x>y){
    x++;
}else{
    y++;
}

或者
swith(x){  //注意，在很多语言中x只能是整数或者字符，而在javascript当中可以是任何东西，字符串也可以（非官方文档，我自己试的）
  case 1:  x++;break;
   case 2: y++;break;
   default: break;

}

循环其实就是:

for(var i=0;i<10;i++)
{
   x++;
}
或者
while(i>0)
{
    i--;
}
或者
do{
   x++
}while(i>0)

总结：

javascript 的基本语法就是这些。 当然还包括： javascript objects.和 javascript window. 这两部分还是在以后的练习中慢慢学吧。这里说不清楚。如果我学到了。有机会我会将学习感悟传上来的。

学习javascript基本语法是不能够操作网页的。要想操作网页必须学会DOM编程，以及 javascript操作DOM。 会在下一节来学习。

再次重申我们的目标是，完全剖析bootstrap 结构。 所以我们接下来把javascript学完后，会紧接着学jquery. 这样就可以进入bootstrap 的js部分了。然后学less进入bootstrap的css部分。最终将其一点一点剖析。

谢谢，如有问题，敬请指正！