JS入门 01

概述：

前端小白Js入门第一课，记录一些重点概念，简单实例，初学者必备，从基础抓起

参考书籍：JS DOM编程艺术

标签目录：

-- 什么是DOM

-- 编写js语言

-- JS中的注释

-- 变量赋值

-- 变量的命名

-- 数据类型

1.什么是DOM
DOM是一套对文档的内容进行抽象和概念化的方法
DOM是一种API（应用编程接口）。API是一组已经得到有关各方共同认可的基本约定。
W3C对DOM的定义：一个与 系统平台 和 程序语言 无关的接口，程序和脚本可通过这个接口动态的访问和修改文档的内容、结构、样式。


2.编写js语言
- 将写好的js代码放入head标签中的script中
- 将js代码存为扩展名为.js的文件，并在script中引入，以src指向该文件
- 最好的办法，将script标签写入HTML文档的最后，</body>前，这样游览器加载速度更快


3.js中每个语句可用换行分隔，但最好以封号结尾（便于阅读，养成良好习惯）


4.JS中的注释
//单行注释
/* 多行注释 */


5.变量赋值
mood="happy";


6.声明变量
<script>
var mood;var age;   //分别声明   var是关键字 mood、age是变量名
var mood,age    //多个变量声明，逗号隔开
var mood="happy",age=33;  //声明及赋值
</script>


7.变量的命名
- JS中 变量和其他语法元素的名字均区分大小学。
- JS变量命名时 不可使用空格，标点符（$除外）
- 变量名允许包含字母 数组 美元符号 下滑线 （第一个字符不能是数字）
- ex：var my mood="happy";   //错误 不含空格
     var my_mood="happy";   //正确
     var myMood="happy";    //驼峰式命名


8.数据类型
JS是弱类型语言，无需类型声明，程序员可在任意阶段改变变量的数据类型
1) 字符串
字符串由0个或多个字符组成。字符包括字母，数字，标点符号，空格。
字符串必须写在 引号 里，‘’或"";
若要在引号中使用引号，需用 反斜线 \  进行字符转义
<script>
var mood='don\'t play';
</script>
2) 数值
给变量赋值为数值，不必一定是整数，JS允许小数且任意位小数，称为 浮点数。也可取负值
3）布尔值（boolean）
布尔数据只有两个值：true、false;
布尔值不是字符串 不可用引号引起来！、
<script>
var married=false;
</script>
4) 数组（array）
字符串、数值、布尔值都是标量（在任意时刻只能存储一个值）；
想用一个变量存储多组数值，需使用 数组；
数组：用一个变量表示一个值的集合，集合中每个值都是这个数组的一个元素；
数组声明：
var beatles=Array(4);//4表示数组长度，创建数组时可不写长度
向数组添加元素的操作成为填充
array[index]=element;
数组中元素的排序从0开始；
<script>
var beatles=Array(4);
beatles[0]="John";
beatles[1]="Paul";
beatles[2]="George";
beatles[3]="Ringo";
</script>
声明数组同时对内容填充：
<script>
var beatles=Array("John","Paul","George","Ringo");
//或
var beatles=["John","Paul","George","Ringo"];
</script>
数组元素不必是字符串。可将布尔值、数值等存入数组
<script>
var lennon=["John",1940,true];
</script>
数组赋值
<script>
var names=["John","Paul","George","Ringo"];
beatles[1]=names[3];
</script>
数组可包含其他数组，可将任意数组赋值给数组中的某一个元素。
<script>
var lennon=["John",1940,true];
var beatles=[];
beatles[0]=lennon;
//beatles 的第一个元素即为lennon数组。如何获取
beatles[0][2];//获取Beatles第一个元素中的第三个值  true；
</script>
5）关联数组
在为新元素给出下标时，不必局限于数字，可以使用字符串。
<script>
var lennon=Array();
lennon["name"]="John";
lennon["year"]=1940;
</script>
虽可读性变强 但不推荐。所有变量实际上是某种类型对象。添加name year相当于给数组加了2个额外属性。
6）对象（Object）
与数组类似，使用一个名字表示一组值；
对象的每个值都是对象的一个属性；
<script>
//创建对象
var lennon=Object();
lennon.name="John";
lennon.year=1940;
lennon.living=false;
//创建对象 花括号法
var lennon={name:"John",year:1940,living:false};
</script>
用对象来代替传统意义的数组，表示可以通过元素名字而非下标进行引用；
<script>
var beatles=Array();
beatles[0]=lennon;
//现在要得到name不可使用beatles[0][0];
beatles[0].name;//可得到John；
//将beatles声明为对象
var beatles={};
beatles.vocalist=lennon;
beatles.vocalist.name//"John"
beatles.vocalist.year//1940
beatles.vocalist.living//false