WEB_JS学习笔记_基础

1、JS和JAVA对比

 

JS是基于对象(调用浏览器内置对象的方法),java是面向对象

JS只需解释就可以由浏览器执行, java需要先编译成字节码文件再执行

js是弱类型(数据类型之间任意转换),java是强引用

js和java一样区分大小写

 

2、一个完整的JavaScrip由以下几部分组成

核心：ECMAScript

文档对象模型：DOM  (内置两大内对象之一)

浏览器对象模型：BOM  (内置两大内对象之一)

 

3、JS和Html结合方式

方式一：放置<scrip>标签：

<script type="text/javascript">
    js code...
</script>

 缺点：这段js code 只能在该页面使用

方式二：将js代码封装到一个文件中,使用script标签的src属性引入一个js文件

<script src="test.js" type="text/javascript"></script>

 优点：方便维护,便于扩展

注意：浏览器加载页面从上到下,加载到哪则运行到哪

例如：若加载的js文件比较大,又相对耗时,则可放在body标签的最后面,js为单线程

 

4、JS的5种基本变量类型和引用类型(typeof 引用类型 为Object)

　　string number boolean undefined null

typeof 用于判断 变量的数据类型 ,返回一个字符串

alert() -- 弹出一个警告框

 

5、js弱类型的转换

(1)显示转换,即使用全局函数进行转换

数字转字符串

        var num=100;
	var str = String(num);
	//String为全局函数 类似的还有Number  Boolean
	//num为任意类型数据,均可通过String转换成字符串
	alert(typeof str);
	alert(str);

 字符串转数字

        //NaN 一个很特殊的数字，表示，不是数字。not a number    NaN == NaN --> false
	var str = "100abc";
	var num = Number(str);
	//alert(typeof num);
	alert(num);//结果为：NaN

 数字转boolean,只有非0和非NaN其他都为true

	//100   true
 	//0	false
	//NaN  false
	var num=NaN;
	var boo = Boolean(num);
	alert(typeof boo);
	alert(boo);//false

 字符串转boolean,只有""才为false,注意：" "里面有个空格也为true

	//abc		true
	//""		false
	var msg="";
	var boo = Boolean(msg);
	alert(typeof boo+" : "+boo);//boolean : false

 undefined和null转换成boolean：都为false

(2)隐式转换：使用逻辑判断

	var msg="abc";
	if(msg){
		alert(msg);//注意：此处的msg仍为"abc",并没有赋值操作
	}

 

6、JS中的函数

定义方式一：

	/*
	格式：
		function  函数名(形式参数...)
		{
		执行语句；
		return 返回值；
		}
		函数是多条执行语句的封装体，只有被调用才会被运行。
		函数的执行，只要写了函数名后面跟一对小括号，该函数就会运行
		调用有参数的函数，但没有给其传值，函数一样可以运行
		调用没有参数的函数，给其传值，该函数也一样运行。
			
	*/
	function test(a,b,c){
		
		//alert(b+a+c);
		return a+b+c;
		
	};

var r = test(10,20,30);//60
var r = test("hi","nihaoa",""hehe);//hinihaoahehe

 定义方式二：动态函数

	/*
		定义动态函数,参数特点：最后一个为函数体,前面的都是形参
	
	通过JS的内置对象Function实现。
		例：
		var demo = new Function("x","y","alert(x+y);");
		demo(4,6);
		等同：
		function demo(x,y)
		{
		alert(x+y);
		}
		demo(4,6);
		不同的是，动态函数，参数以及函数体都可以通过参数进行传递，可以动态指定。
	
	*/

	var arg1="a";
	var arg2="b";
	var funbody="alert(a+b);";//这三个变量可从网络获取从而实现动态设置函数
	
	
	//var funtest= new Function("a","b","alert(a+b);");
	var funtest= new Function(arg1,arg2,funbody);

	funtest("hello"," word");//hello word

 定义方式三：匿名函数

	/*
		格式：function(){...}
		例如：
		var demo = function(){...};           
		demo();
		
		* 通常在定义事件属性的行为时较为常用。
	*/
	
	
/* 	function(a,b){
		return a+b;
	} */
	
	alert("内容 还没显示");
	
	// 给当前窗体加载完成以后事件添加监听,window为内置对象
	window.onload = function(){
	
		alert("窗体显示完了");
	};