HTML学习笔记day4之JS

JS（JavaScript）

什么是脚本语言？
脚本语言是为了缩短传统的编写-编译-链接-运行(edit-compile-link-run)过程而创建的计算机编程语言。
1、脚本语言(JavaScript，VBscript等)介于HTML和C,C++,Java,C#等编程语言之间。
　HTML通常用于格式化和链接文本。而编程语言通常用于向机器发出一系列复杂的指令。
2、脚本语言与编程语言也有很多相似地方，其函数与编程语言比较相像一些,其也涉及到变量。
与编程语言之间最大的区别是编程语言的语法和规则更为严格和复杂一些.
3、与程序代码的关系：脚本也是一种语言，其同样由程序代码组成。
4、脚本语言是一种解释性的语言,例如Python、vbscript,javascript等等,它不像其他语言可以编译成二进制代码,
以可执行文件的形式存在，脚本语言不需要编译，可以直接用，由解释器来负责解释。
5、脚本语言一般都是以文本形式存在,类似于一种命令。
优点：
快速开发：脚本语言极大地简化了“开发、部署、测试和调试”的周期过程。
容易部署:大多数脚本语言都能够随时部署，而不需要耗时的编译/打包过程。
优点：
快速开发：脚本语言极大地简化了“开发、部署、测试和调试”的周期过程。
容易部署:大多数脚本语言都能够随时部署，而不需要耗时的编译/打包过程。

JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、
平板电脑和智能手机等设备。
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
JavaScript 很容易学习。
JS输出方式：

<script>
        //alert():弹框
        alert("hello js");
        /*把内容输出到body里显示*/
    document.write("hello js1");
    /**/
   document.write("<h1>这是一个一级标题</h1>");
    </script>

变量

变量是一种引用内存位置的容器，用于保存在执行脚本时可以更改的值。
变量的命名：
变量名必须以字母或下划线 (_) 开头
变量名可以包含数字，但是不能以数字开头
由于JavaScript区分大小写，所以可用的字母包括A到Z（大写）和a到z（小写）的字符
不能使用JavaScript的关键字保留字
定义变量、初始化、赋值
1.定义变量
关键字:var
例:var num;
也可以同时声明多个变量，各个变量之间用逗号隔开。
2.初始化变量
在定义变量的时候，就给值 如：var num=1;
3.给变量赋值
(1)定义变量: var username;
(2)变量赋值: username=”张三”;
JS是一种弱类型语言，在定义变量的时候，不需要指定变量的明确类型，统一用var定义

 <script>
        var num=1;//定义一个变量mun，将数值1赋值给mun
        var a,b,c=3;//定义多个变量，每个变量之间用","隔开
            a=1;
        b=2;
        var x=5;
        var y=6;
        var z=7;
        var num1=a+b+c;
        document.write("num的值是："+num+"<br />")
        document.write("num1的值是："+num1+"<br />")
        var num2=x+y-z;
        document.write("num2的值是："+num2+"<br />")
        var str;//未赋值
        alert(str);
    </script>

在 JavaScript 中，对象是拥有属性和方法的数据。

1.属性和方法
属性是与对象相关的值。
方法是能够在对象上执行的动作。
举例：汽车就是现实生活中的对象。
汽车的属性：名称、型号、重量、颜色。
汽车的方法：启动、驾驶、刹车。

2.JavaScript中的对象
例:var message=”Hello World!”
实际上已经创建了一个JavaScript字符串的对象，字符串对象拥有内建的属性length。length=5
属性：txt.length=5;
方法:txt.indexof()
txt.replace()
3.创建JavaScript对象
JavaScript 中的几乎所有事物都是对象：字符串、数字、数组、日期、函数，等等。

 <script>
        //创建字符串对象
        var str="昨天下大雨了";
        var len=str.length;
        document.write("字符串的长度："+len+"<br />")
        //创建对象

        //1.使用字面量表示法(字面量表示如何表达这个值,一般除去表达式，给变量赋值时,等号右边都可以认为字面量）
        //方法：将成员信息写到{}中,并赋值给一个变量,此时这个变量就是一个对象
        var person={};//创建无初始值对象的方法，{}为空，就是一个空对象
        //创建一个汽车对象
        var car={
            brand:"奥托",name:"小包",color:"黄色",price:"50000",//属性
            show:function(){//方法
            alert("姓名:"+this.name+"品牌:"+this.brand+"颜色："+this.color);
            }
        };
            //调用对象的方法
            car.show();
            var person1={
                name:"李四",
                mycar:car,//对象的属性也可以是对象
                age:16,
                meg:function(){
                    alert("姓名："+this.name+"年龄："+this.age)
                }
            }
            //第一种调用对象属性
            person1.age=30;
            person1.name="carson";
            //第二种方式
            person1["age"]=20;
            person1["mycar"].brand="宝马";
            document.write("姓名："+person1.name+"年龄："+person1.age+"汽车："+person1.mycar.brand);
            //调用方法
            person1.msg();
            //第三种，可以通过构造器方式创建对象
            var person2=new Object();
            person2.age=19;
            person2.msg();
      </script>

数组

1.声明一个数组

var scores=new Array();
        scores[0]=20;
        scores[1]=30;
        scores[2]=40;
        scores[3]=50;

数组的长度用数组名.length表示
2.可以同时声明数组并且同时指定元素的值

var scores1=new Array(20,30,40,50);

3.也可以使用简单的语法声明数组并赋值

var scores2=[20,30,40,50];

4.声明数组,并且指定数组的长度

var scores3=new Array(20);

5.分离字符串

var str="a,b,c";
        var strs=str.split(",");//以逗号为分割标志分割字符串放进strs数组中

6.数组元素的添加 JavaScript提供了数组添加方法:push()

var arr=[1,2];
        //添加元素
        arr.push(3);
        //返回新数组的长度
        document.write(arr.length);

7.数组元素的删除
pop()：除数组arr最后一个元素，返回被移除的元素

var arr1=[1,2,3,4,5,6,7];

        //从数组的尾部移除一个元素,返回值为移除的元素 pop()
var obj=arr1.pop();

shift()：移除最前一个元素并返回该元素值，数组中元素自动前移。

var  arr1 = [1,2,3, true];
var r1 = arr.shift();//从头部移除一个元素(返回移除的元素)
alert(arr1);
alert(r1);

arrayObj.splice(deletePos,deleteCount)：删除从指定位置deletePos开始的指定数量deleteCount的元素，数组形式返回所移除的元素。

 //删除位于 arr2  2 的元素，并添加一个新元素来替代被删除的元素：
var arr2 = [1,2,3, true];
document.write(arr2 + "<br />")
arr2.splice(2,1,"a") //1,2,a,true
document.write(arr2);

8.循环遍历数组
for循环

for(var i=0;i<arr3.length;i++){
            document.write(arr3[i]+"<br />");
        }

for in

for(var number in arr3){//number是数组的索引值，对用在对象数组
            document.write(arr3[number]+"<br />");
        }