初步了解JavaScript

一、<script>标签的使用

JavaScript可以直接嵌入网页中，也可以进行网页分离。

直接嵌入时，用<script type="text/javascript"></script>标签标记，其中的type=”text/javascript”属性可以省略。

引用外部文件进行网页分离时，使用<script src="js/index.js" type="text/javascript"></script>进行连接。

为了防止出现乱码的情况，在js的编写中尽量少出现或者不出现中文。

二、js的基本语法

js变量分为局部变量和全局变量，要了解局部变量和全局变量的区别之前，要先了解js的数据类型、变量声明和方法声明。

1.js的6种基本数据类型

1）boolean简称bool，即布尔类型，用于判断真假的类型。

2）undefined，未定义类型。

3）null，空值类型。

4）object，对象类型。

5）number，数字类型。

6）string，字符串类型。

在这6种基本数据类型中，object类型和null类型为引用类型，其余四中均为值类型。

2.声明变量

变量的声明格式是：关键字+“空格”+变量名称

js里声明变量的关键字是var（需要注意的是在js的编写中是区分大小写的）

在使用变量之前，一定要进行变量初始化，也就是我们常说的赋值。赋值有两种方式，1）直接赋值。如“var stu=100;”。2）使用前赋值。如“var sum;sum=0;”。

js的6种基本数据类型的声明举例：

var a=true;
var b=undefined;
var c=null;
var d=new Studen();
var e=20;
var f="abcd";

在变量里，我们可以使用typeof操作符检测所写变量是否为以上6种基本数据类型，但不能检测它们属于值类型还是引用类型。还可以使用instanceof判断两边的类型是否一致，检测的是原型链里的构造函数。

检测使用的代码：

console.log(typeof(a));
console.log(a instanceof b);

3.声明方法

方法的声明格式是：关键字+“空格”+方法名称(){}

function student(){
            console.log("本校学生");
}
student();

student();是调用该方法，console.log指在控制台输出。

4.全局变量与局部变量

通过目前所学习的知识，我们可以用变量的位置来区分全局变量和局部变量。

var sex="性别";
name();
function name(){
    var people="kiki";
    console.log(people);
    console.log(sex);
}
function abc(){
    console.log(people);
    console.log(sex);
}

sex的变量是在外部定义，两个方法均可以使用该变量，但是people的变量只在name方法中被定义，运行后的结果中，abc方法无法使用people的变量值。

通过这些，我们将在<script>中直接定义的变量称为全局变量，在function内部中定义的变量称为局部变量。全局变量在任何方法中都可以使用，而局部变量只限方法自己使用，其他方法在未给予权限时不能使用。

在调用方法时要注意，确保调用的方法中变量是初始化的。

name();
var people="kiki";
var sex="性别";
function name(){
    console.log(people);
    console.log(sex);
}

在上述语句中，调用方法时，系统直接进行方法的读代码，中间的两句变量定义是未被执行的，所以此时的运行结果是没有值的，输出会显示undefined。

三、函数（方法）及其带参和返回值

1.函数不带参和带参

//不带参函数
function hanshu(){
    console.log("abc");
}
hanshu();
//带参函数
function Stu(name,sex,age){
    console.log(name);
    console.log(sex);
    console.log(age);
}
Stu("kiki","女","18");

2.两种匿名函数的不带参和带参

匿名函数分为两种，我们按照其运行方式称之为调用函数和自执行函数。

1）调用函数

//调用函数不带参
 var a= function () {
     console.log("koko");
 }
 a();
//调用函数带参
 var b= function (x,y,z) {
     console.log(x);
     console.log(y);
     console.log(z);
 }
 b("one","two","three");

2）自执行函数

//自执行不带参
(function () {
    console.log("121")
})();
//自执行带参
(function(yi,er,san){
    console.log(yi);
    console.log(er);
    console.log(san);
})("一","二","三");

3.函数的返回值

函数都可能存在返回值，使用return语句。

//函数返回值
function one(){
    return "123";
}
console.log(one());
//调用函数返回值
var two=function (){
    console.log("1");
    return "10";
}
console.log(two());
//函数返回值，可进行变量定义，而后输出该变量
var x;
function three(){
    x=100;
    return x;
}
var y=three()
console.log(y);
//自执行函数返回值
var z;
var four = (function () {
    z = 10 + 5;
    return z;
})();
console.log(four);

四、js的操作运算符

1.算数运算符：+、 - 、*、 / 、% 、++、 --

其中要注意a++是先使用后自增，++a是先自增后使用；a--是先使用后自减，--a是先自减后使用。

2.类型的强制转换：parseInt强制转换为整型，parseFloat强制转换为小数点型。

3.比较运算符：> 、< 、>= 、<=、== 、!=

在比较运算符中还要了解=、==、===的区别，=表示赋值，==表示判断两边值是否相等，===表示判断两边值是否相同切类型是否相同。

4.逻辑运算符：||（或）、&&（与）、!（非）

5.三元运算符：条件？true:false；即若条件为真则运行true中所写的代码，否则运行false中所写的代码。

3<6?document.write("正确"):document.write("错误");

document.write()表示在页面上输出。

五、循环结构

循环结构分为for循环、while循环和do while循环。

//for循环
var s=0;
for(var i= 0,a=10;i+a<20;i++){
    s+=(i+a);
    console.log(s);
}
//while循环
var a=0;
while(a<10){
    a++;
    console.log(a);
}
//do while循环
var a=0;
do{
    a++;
    console.log(a);
}while(a<10);

其中，while循环是先判断后执行，若条件不符合，可能执行0次；do while循环是先执行后判断，所以至少会执行一次。

在循环语句中，break表示跳出当前循环并终止整个循环；continue表示跳出并终止当前循环，进入下一次循环。