JavaScript入门

什么是脚本语言?

单独使用没有意义,配合其他语言使用,例与html语言结合使用,单纯使用脚本语言边写不出程序

脚本语言是为了缩短传统的编写-编译-链接-运行(edit-compile-link-run)过程而创建的计算机编程语言。
1、脚本语言(JavaScript,VBscript等)介于HTML和C,C++,Java,C#等编程语言之间。
 HTML通常用于格式化和链接文本。而编程语言通常用于向机器发出一系列复杂的指令。
2、脚本语言与编程语言也有很多相似地方,其函数与编程语言比较相像一些,其也涉及到变量。
(强类型语言:例java语言,在java中定义变量必须定义变量的类型)
(弱类型语言:例JavaScript而在JavaScript中没有String、int…根据运行结果来
再声明变量的时候不需要定义变量类型,统一使用vr来定义变量,例va a=123456; 最后 结果输出的就为int类型 )
与编程语言之间最大的区别是编程语言的语法和规则更为严格和复杂一些.
3、与程序代码的关系:脚本也是一种语言,其同样由程序代码组成。
4、脚本语言是一种解释性的语言,例如Python、vbscript,javascript等等,它不像其他语言可以编译成二进制代码,
以可执行文件的形式存在,脚本语言不需要编译,可以直接用,由解释器来负责解释。
使用谷歌浏览器来进行打断点进行调试。
5、脚本语言一般都是以文本形式存在,类似于一种命令。

  优点:
  快速开发:脚本语言极大地简化了“开发、部署、测试和调试”的周期过程。
  容易部署:大多数脚本语言都能够随时部署,而不需要耗时的编译/打包过程。

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

JavaScript基础

  1. 注释:
    JavaScript 不会执行注释。
    我们可以添加注释来对 JavaScript 进行解释,或者提高代码的可读性。
    单行注释以 // 开头。
    多行注释以 /* 开始,以 */ 结尾。

  2. 变量

<!--
   	定义变量、初始化、赋值
    1.定义变量
                   关键字:var
                   例:var num;    var 变量名1,变量名2....
                   也可以同时声明多个变量,各个变量之间用逗号隔开。
    2.初始化变量
                  在定义变量的时候,就给值 如:var num=1;
    3.给变量赋值
      (1)定义变量: var username;
      (2)变量赋值: username="张三";
      js是一种弱类型语言,在定义变量的时候,不需要指定变量的明确类型,统一用var定义
 -->
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>变量</title>
    <meta charset="utf-8" />
     <!--
     	<script>放所有的标签</script>
     -->
     <script>
     	//定义一个变量,给变量赋值为10
     	var num=10;
     	
     	//输出到浏览器上(两种方式)
     	//1.弹框 alert 
     	alert(num); 
     	
     	//2.文本的形式document   write输出
     	document.write("num的值为"+num);
  
     	//同时声明多个变量
     	var a,b,c=3;//只是给c赋值
     	a=5;//给a赋值
     	//换行标签:<br/>   
     	document.write("b:"+b+"<br/>");
     	document.write("c:"+c+"<br/>");
     	document.write("a:"+a+"<br/>");
     	var d=a+b-c;
     	document.write("d:"+d);
     	
     	var str;
     	alert(str);
     	
     	var str="张三";
     	alert(str);//alert提示框中输出
     	document.write(str);
     </script>
  
</head>
<body>
   
</body>
</html>

  1. 对象
    在 JavaScript 中,对象是拥有属性和方法的数据。
    1.属性和方法
    类是造汽车的图纸。
    属性是与对象相关的值。
    方法是能够在对象上执行的动作。
    举例:汽车就是现实生活中的对象。(万物皆对象)
    汽车的属性:名称、型号、重量、颜色。
    汽车的方法:启动、驾驶、刹车。

     2.JavaScript中的对象
             例:var  message="Hello World!"
             实际上已经创建了一个JavaScript字符串的对象,字符串对象拥有内建的属性length。length=5
             属性:txt.length=5;
             方法:txt.indexof()
            txt.replace()
     3.创建JavaScript对象
       JavaScript 中的几乎所有事物都是对象:字符串、数字、数组、日期、函数,等等。
    
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>JavaScript对象</title>

    
    <script>
    	//创建字符串对象
    	var str="今天雾好大呀";
    	str.length;//字符串长度
    	var len=str.length;//  获取一个变量接受str.length;
    	//document.write(len);//输出
    	
    	//创建对象
    	//1.使用字面量表示法(字面量表示如何表达这个值,一般除去表达式,给变量赋值时,等号右边都可以认为字面量)
        //方法:将成员信息写到{}中,并赋值给一个变量,此时这个变量就是一个对象
        var person={};//这就创建一个对象,如果{}为空,这就是一个空对象
        //创建一个汽车对象
        var car={
        	//属性
        	color:"黑色",
        	brand:"奔驰",
        	name:"商务",
        	price:"60.8万",
        	//方法
        	show:function(){
        		alert("品牌:"+this.brand+"名字:"+this.name);//提示框上输出
        	}//最后一个方法不加逗号
        };
        //调用方法
        car.show();
        
        //我可以在一个对象里面去引用一个对象
        var person1={
        	name:"尼古拉斯赵四",  //直接赋值
        	age:45,
        	myscar:car,//对象的属性也可以是对象
        	msg:function(){
        		alert("我叫:"+this.name+"我有一辆:"+this.myscar.brand)
        	}
        };
        person1.msg();
        
        //为属性赋值(两种方式)
        person1.age=18;
        person1.name="赵小四";
        document.write("姓名:"+person1.name+"<br />");
        //第二种方式
        person1["age"]=19;
        document.write("年龄为:"+person1.age);
   </script>
</head>
<body>

</body>
</html>

  1. 数组
    在java中有三种定义数组的方式
    拿上节内容说
  • 创建JavaScript对象 JavaScript 中的几乎所有事物都是对象:字符串、数字、数组、日期、函数,等等。
    则声明数组也用 var
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>数组</title>
    <script>
     	//1.声明一个数组(和java一样也有三种方式)
     	 var scores=new Array();
     	 scores[0]=20; 
     	 scores[1]=30;
     	 scores[2]=40;
     	 
     	//数组的长度
     	document.write("数组0的长度"+scores.length+"<br />")
    
     	//2.可以同时声明数组并且同时指定元素的值(在声明数组的同时给数组赋值)
     	var scores1=new Array(20,30,50,60);//(注意:在java中后面是[]括号,而在JavaScript中是用小括号())
     	document.write("数组1的长度"+scores1.length+"<br />")
     	
     	//3.也可以使用简单的语法声明数组并赋值
     	var scores2=[20,30,60,80];
     	document.write("数组2的长度"+scores2.length+"<br />")
     	//4.声明数组,并且指定数组的长度
     	var scores3=new Array(10);//当为单个值时,就为长度
     	//注意当单个值的时候是数组长度而不是赋值!!!
     	document.write("数组3的长度"+scores3.length+"<br />")
     	
     	//5.分离字符串
     	var str="A,B,C,D";  //声明一个字符串,
     	//在java中字符串分离用 split 方法,在JavaScript也是这样
     	var strs=str.split(","); //声明一个数组使用 split 方法,strs是一个字符串
     	document.write("strs:"+strs+"<br />");
    
     	//6.数组元素的添加 JavaScript提供了数组添加方法:push()
     	var arr=[1,2];//声明一个数组并赋值
     	//添加元素
     	arr.push(3);
     	//返回新数组的长度
     	document.write(arr.length)//输出结果:3
     	
     	//7.数组元素的删除  (了解即可)
     	var arr1=[0,1,2,3,4,5,6,7,8,9];
     	//从数组的尾部移除一个元素,返回值为移除的元素 pop()
     	var obj=arr1.pop();
     	alert(obj);
     	//8.循环遍历数组(在java中循环遍历有两种:for循环、for each语句遍历)
     	var arr3=["张三","李四","王五","马六","赵七"]; //遍历该数组的值
     	//for循环
     	for(var i=0;i<arr3.length;i++){//遍历
     		document.write(arr3[i]+"<br />")
     	}
     	//for in
     	for(var number in arr3){  //类似于java中for(var number : arr3){
     	//在java中解释为: 定义变量number,arr3的取值给number,
     	// 而在JavaScript中解释为:定义变量number,arr3的取值的索引值给number,则number是数组的索引值(下标),多用在对象数组
     		document.write(number+"<br />") 
     	}
     	
     	//对象数组:顾名思义就是对象类型的数组
     	var car1={name:"宝马",brand:"宝马7系",price:"200万"};
     	var car2={name:"奔驰",brand:"G600",price:"220万"};
     	var car3={name:"奥迪",brand:"A8",price:"190万"};
     	var arr4=[car1,car2,car3];
     	//for遍历
     	for(var i=0;i<arr4.length;i++){
     		document.write("品牌:"+arr4[i].name+"<br />"+
     		 "型号:"+arr4[i].brand+"<br />"+"价格"+arr4[i].price+"<br />");
     	}
     	
     	
     	
    </script>
</head>
<body>

</body>
</html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值