JavaScript 2

5.javascript中的注释

    5.1 单行注释
           //注释
    5.2 多行注释
            /*
                多行注释
                多行注释
            */

6.中的标示符(变量名):

    大小写敏感
    不能以数字开头
    可以由字母、数字、下划线、$符号组成
    不能是javascript中的关键字

7.javascript中声明变量:

    任何类型的变量都可以用var关键字来声明.

    var a = "";
    var b = 10;
    var c = 10.9;
    var d = new Date();
    var e = true;

8.javascript中的null和undefined

    //弹出null
    var age = null;
    alert(age);
    
    //弹出undefined (根据浏览器来定)
    var age;
    alert(age);

9.javascript中的三种弹框:

    alert  confirm  prompt
            
    alert    提示框/警告框
    confirm  确认框
    prompt     输入对话框

    这三个方法都是window这个对象的方法.window是
JS中的一个内置对象,只有window对象的方法,调用的时候才
可以省去对象的名字,直接用方法名字来调用
window.alert("hello")和alert("hello")是一样的效果.

这三种弹框都有一个共同的特点,当浏览器运行一个弹框代
码的时候,用户如果不点击弹框中的确定或者取消按钮的话,
浏览器就会卡这个弹框处,下面的页面代码就不会被执行.
    
alert弹出一个警告框/提示框,用户点击确定按钮之后就可以
继续访问。

confirm弹出一个确认框,用户可以点击确定或者取消,
这个confirm方法会相应的返回true或者false.
    
prompt弹出一个可以让用户输入的框口,用户输入后点击
    确定,这个方法会把用户输入的内容返回.
    prompt("请输入你的性别:");
同时还可以在输入框设置一个默认值.
prompt("请输入你的性别:","男");


10.javascript中的输出

    10.1 写到 HTML 某个元素中
        使用 document.getElementById(id) 方法获得要操作的html页面元素
        再使用并 innerHTML 来获取或插入元素内容
        例如:

        <div id="demo">hello</div>
        <span id="s1"></span>
        //获得id=demo的元素中的文本内容
        var v = document.getElementById("demo").innerHTML;
        //把变量v的内容插入到id=s1的元素中
        document.getElementById("s1").innerHTML=v;

    10.2 写到 HTML 文档
        document.write(....);
        类似于java中的System.out.println(.....);
        参数可以是字符串或者数字或者其他的一个对象
        
        注意:document.write(....)是直接写给浏览器的,让浏览器解析显示的
    10.3 写到控制台
        使用 console.log() 方法在浏览器中显示 JavaScript 值。
        浏览器中使用 F12 来启用调试模式, 在调试窗口中点击 "Console" 菜单进行查看。
        注意:有些浏览器可能需要安装相应的插件才能开启调试模式
        例如:

        var name = "tom";
        console.log(name);

        另外:console.info(...);
例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
//提示用户输入内容,用户输入内容
//确定得到参数,取消获得null值
//注意:加第二个参数表示默认值
/* var name=prompt("请输入用户名","jake");
console.log(name); */
/* var name=prompt("请输入用户名");
console.log(name); */
//判断用的返回值boolean类型
//confirm参数是表示提示信息
	/* var b=confirm("确定否");
	//if判断的参数boolean表达式
	if(b){
		alert(1111);
	}else{
		alert(222);
	} */
//bom对象代表的是浏览器对象
//浏览器对象维护的函数(方法)
//可以省略window
	/* alert(111);
	window.alert(2222); */
	/* var n=null;
	console.log(n);//null
	var nn;
	console.log(nn); *///undefined申明了没有赋值
	//js中所有的变量声明都是var
	/* var a="";
	var b='';
	var c=10;
	var d=11.88;
	var bb=true;
	console.log(bb);
	var date=new Date();
	//将js的结果输出到浏览器的
	//开发工具上(IE不支持)
	console.log(date); */
	//输出内容到浏览器的开发工具控制台
	/* console.log("test1");
	console.info("test2");
	console.error("test4"); */
	//将内容输出到浏览器
	//等价与System.out.println();
	/* document.write(new Date()+"<br>");
	document.write(1+1+"<br>");
	document.write(true+"<br>");
	document.write("test.....ok<br>"); */
</script>
</head>
<body>
<input type="text" id="inp" name="name" 
	value="hello"/>
<div id="div" >test</div>
<script type="text/javascript">
	//document表示浏览器解析html得到的
	//文档对象,名字固定的
	var div=document.getElementById("div");
	//标签中没有默认value属性的
	//取值innerHTML
	/* console.log(div.innerHTML); */
	//给含有id=“div”的属性标签赋值
	div.innerHTML="briup";
	var inp=document.getElementById("inp");
	//标签中自带value属性取值用value
	console.log(inp.value);
	//给自带value属性的标签赋值
	inp.value="jd1812";
	</script>
</body>
</html>

11.javascript中的数据类型

    字符串(String)、数字(Number)、布尔(Boolean)
    数组(Array)、对象(Object)、空(Null)、未定义(Undefined)。
    注意:可以使用全局函数typeof()来判断一个变量的数据类型,
只能判断基础数据类型。对于使用内置构造函数创建的对象
,均返回object

    11.1 JavaScript 拥有动态类型的特点。
    这意味着相同的变量可用作不同的类型:
        例子:

        var x;               // x 为 undefined
        var x = 5;           // 现在 x 为数字
        var x = "John";      // 现在 x 为字符串

    11.2 字符串 String 

        字符串可以是引号中的任意文本。可以使用单引号或双引号:
        var name="tom";
        var name='tom';
        
        可以在字符串中使用引号,只要不匹配包围字符串的引号即可:
        var v="He is called 'tom'";
        var v='He is called "tom"';
        
        字符串对象的常用方法:
        var s = "hello world";
        document.write("<h1>字符串对象</h1>")
        //获得字符串的长度
        document.write(s.length+"<br>");
        //从下标为3的位置开始,截取4个字符,包括下标为3的位置的字符
        document.write(s.substr(3,4)+"<br>");
        //从下标为6的位置开始截取,截取到下标为8的位置,但是不包括下标为8的字符[6,8)
        document.write(s.substring(6,8)+"<br>");
        //trim()去掉字符串俩边的空格,但是这个方法有可能浏览器不支持.
        document.write(s.trim().length+"<br>");
        //字符串转换为大写
        document.write(s.toUpperCase()+"<br>");
        //字符串转换为小写
        document.write(s.toLowerCase()+"<br>");
        //分割字符串 返回一个数组
        document.write(s.split(" ")+"<br>");
        document.write(s.split(" ").length+"<br>");
        document.write(s.split(" ")[0]+"<br>");
        document.write(s.split(" ")[1]+"<br>");

             注意:javascript中的转义符和java的一样也是\

    11.3 数字 Number
        JavaScript 只有一种数字类型。数字可以带小数点,也可以不带

        var x1=34.00;      //使用小数点来写
        var x2=34;         //不使用小数点来写

             极大或极小的数字可以通过科学(指数)计数法来书写:      

        var y=123e5;      // 12300000
        var z=123e-5;     // 0.00123

    11.4 布尔
        布尔(逻辑)只能有两个值:true 或 false。    

        var x=true;
        var y=false;

    11.5 数组 Array
        javascript中数组的特点:
        1.数组的长度是可变的
        2.数组里面放的数据类型也可以不同
        3.数组的长度是和你所使用到的数组中最大下标相关联的.     

        //创建数组的时候,可以指定长度也可以不指定
        //var a = new Array(4);
        //var a = [1,3,4,"tom"];
        var a = new Array();

        a[0] = "tom0";
        a[1] = "tom1";
        a[2] = "tom2";
        a[6] = "tom6";

        document.write(a.length+"<br>");
        /*
            正常情况的循环

        这个循环的输出结果为:
        tom0
        tom1
        tom2
        undefined
        undefined
        undefined
        tom6
        */
        for(var i=0;i<a.length;i++){
            document.write(a[i]+"<br>");
        }

        /*
            for-in循环

        这个循环的输出结果为:
        tom0
        tom1
        tom2
        tom6
        */
        //for-in除了变量数组外还能变量一个对象,这时变量i拿的就不是下标了,而是对象中的属性.
        //这里的这个变量i每次拿到的是数组下标,而且是已经存在值的位置的下标,对于那些值是undefined的位置下标是不会拿的.
        for(i in a){
            document.write(a[i]+"<br>");
        }

    11.6 空(Null)、未定义(Undefined)

        //null
        var name = null;
        //Undefined
        var age;

    11.7 对象 Object
        javascript中{}可以代表对象
        11.7.1 javascript已经存在的类型的对象       

            var v = new Date();
            var obj1 = new Object(), obj2 = {};//Object 对象
            var arr1 = new Array(), arr2 = [];//Array 对象
            var boo1 = new Boolean(true), boo2 = true;//Boolean 对象
            var num1 = new Number(123), num2 = 123.45;//Number 对象
            var str1 = new String("abc"), str2 = 'abc';//String 对象

        11.7.2 自定义的对象1:           

            var person={firstname:"John", lastname:"Doe", id:5566};
            alert(person.firstname);
            alert(person.lastname);
            alert(person.id);

        11.7.3 自定义的对象2:  

            var p =
                    {       
                       grade:1,
                       name : "tom",
                       age:27,
                       sex:"男",
                          
                       speak:function(words)
                       {
                          alert(this.name+"说:"+words+"!");
                       }

                    }
        
            p.speak("hello");

        11.7.4 自定义的对象3:       

            function Person(name){
                this.name = name;
                this.age = 20;

                this.say=say;
            
            }

            function say(){
                document.write(this.name+":大家好,我今年"+this.age+"岁了");
            }
            
            var p = new Person("张三");
            p.say();

            -----------------------------
            function Person(name){
                this.id = 1;
                this.name = name;
                this.age = 20;

                this.say=function(msg){
                    document.write(this.name+" 说:"+msg);
                };

            }
            var p = new Person("张三");
            p.say();

例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	//对象的构建
	//获取系统的时间
	var date=new Date();
	//console.log(date);
	//document.write(date);
	//构建一个js空对象  等价于{}
	/* var obj=new Object();
	document.write(obj); */
	/* var arr=new Array();
	document.write(typeof(arr)); *///object
	/* var b=new Boolean(true);
	document.write(typeof(b)+"<br>");//object
	document.write(b+"<br>");//true */
	/* var num=new Number(23);
	var nu=34;//number
	document.write(typeof(nu)+"<br>");
	document.write(nu+"<br>");
	document.write(typeof(num)+"<br>");//object
	document.write(num+"<br>"); */
	
	/* var str=new String("test");
	document.write(str+"<br>");
	document.write(typeof(str)+"<br>");//object */
	//1自定义js对象
	//{key:value,key:value....}
	//key表示对象中的属性名,value表示
	//对象中的属性值
	/* var person=
	{name:"lisi",age:30,gender:true,email:"14@qq.com"};
	//给js构建的对象赋值
	person.name="wangwu";
	//从js构建的对象中取值
	document.write(person.name+"<br>");
	document.write(person.age+"<br>");
	document.write(person.email+"<br>");
	document.write(person.gender+"<br>"); */
	//2自定义对象的构建(加函数(java方法))
	var per1={
			name:"lisi",
			age:30,
			gender:true,
			//对象中函数(方法)的声明
			//js中函数声明不需要类型限制
			//可以接受任意类型
			say:function(msg){
				document.write("test....."+msg+"<br>");
			}
	};
	//调用js中自定义对象的方法
	//per1.say("test");
	//per1.say(345);
	per1.say(true);
	document.write(per1.name+"<br>");
	document.write(per1.age+"<br>");
	document.write(per1.gender+"<br>");
	//数组的使用
	//特点:1js中的数组可以存储任意类型
			//2. js中的长度可变,长度和使用的
			//长度有关
		//数字也可以声明的时候赋予值
		var arr=["test",true,33,new Date()];
		arr[100]="briup";
		//for循环和java一样
		//单前循环不能忽略undefined
		/* for(var i=0;i<arr.length;i++){
			//console.log(arr[i]);
			document.write(arr[i]+"<br>");
		} */
		/* for(i=0;i<arr.length;i++){
			//console.log(arr[i]);
			document.write(arr[i]+"<br>");
		} */
		//js增强循环
		//i表示的角标,自动把数组中
		//undefined修饰的数组位置忽略掉
		//只显示有具体值的位置
		/* for(i in arr){
			document.write(arr[i]+"<br>");
		} */
	/* 	for(var i in arr){
			document.write(arr[i]+"<br>");
		} */
		/* console.log(arr.length);
		console.log(arr[0]);
		console.log(arr[1]);
		console.log(arr[2]);
		console.log(arr[3]); */
	//数组的声明
		//var arr=new Array(4);
		//申明数组的过程不指明长度
		/* var arr=new Array();
		//给数组赋值,中间没有赋予值的
		//操作书undefine修饰的
		arr[0]="tets";
		arr[1]=true;
		arr[2]=34;
		arr[10]=new Date();
		//从数组中取值,
		console.log("0:"+arr[0]);
		console.log("1:"+arr[1]);
		console.log("2:"+arr[2]);
		console.log("3:"+arr[3]);
		console.log("4:"+arr[4]);
		console.log("10:"+arr[10]);
		console.log(arr.length); */
	
	//boolean类型的申明
	/* var b=true;
	var b1=false;
	console.log(typeof(b));//boolean
	console.log(typeof(b1));//boolean
	console.log(b);//true
	console.log(b1);//false */
	//数字类型
	var num=23;
	var num1=23.44;
	/* console.log(typeof(num));//number
	console.log(typeof(num1));//number
	console.log(num);
	console.log(num1); */
	//科学技术表示数字
	//var n=123e5;//123*10^5次方
	//console.log(n);//12300000
	//var n1=123e-5;//123除以10的5次方
	//console.log(n1);//0.00123

	/* var ss="test ... 'test'";
	console.log(ss);//test ... 'test'
	var ss1='test ... "test"';
	console.log(ss1);//test ... "test"
	var str="hello";
	console.log(typeof(str)); */
	var str1='test briup';
	/* console.log(typeof(str1)); */
	//字符串的长度
	//console.log(str1.length);//10
	//substr截取字符串
	//第一个参数表示从那个位置开始截取
	//第二个参数表示截取的位数是多少
	//console.log(str1.substr(2,2));//st
	//console.log(str1.substr(2,5));//st br
	//第一个参数表示开始的位置
	//第二个参数表示结束位置 [2,4)
	//console.log(str1.substring(2,4));//st
	//console.log(str1.substring(2,8));//st bri
	//表示去掉字符串前面和后面的空格
	//console.log(str1.trim());
	//将字符串转化为大写
	//console.log(str1.toUpperCase());
	//将字符串转化为小写
	//console.log(str1.toLowerCase());
	//拆分字符串,得到的是数组
	//注意:如果拆分的字符串有特殊含义
	//使用转义\
	/* var arr=str1.split(" ");
	console.log(arr[0]);//test
	console.log(arr[1]);//briup
	console.log(arr[2]); *///undefined
//同一个变量在js中可以表示多种类型
	/* //boolean类型
	var n=true;
	//typeof判断变量是什么类型
	console.log(typeof(n));
	//数字类型
	n=33;
	console.log(typeof(n));
	//字符串类型
	n="test";
	console.log(typeof(n)); */
</script>
</head>
<body>

</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
//3自定义js对象
/* function Person(name,age){
    //对象属性的定义
	this.name=name;
	this.age=age;
	this.gender=true;
	//对象行为(方法)的定义
	this.say=say;
}
function say(msg){
	console.log("test....."+msg);
}
//对象构建
var p=new Person("tom",33);
//打印到控制台
console.log(p.name);
console.log(p.age);
console.log(p.gender);
p.say();
p.say(1);
p.say(true);
p.say("byebye"); */
//4.js对象的构建
function Person(name,age,gender){
	this.name=name;
	this.age=age;
	this.gender=gender;
	//对象行为(方法)的定义
	this.say=function(a){
		console.log("test...ok"+a);
	}
}
var p=new Person("jake",30,true);
console.log(p.name);
console.log(p.age);
console.log(p.gender);
p.say();
p.say(1);
p.say(new Date());

</script>
</head>
<body>

</body>
</html>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值