JavaScript基础& Bom

JS描述
1、构建网站的三大技术
(1)HTML：网页支撑的骨架
(2)CSS：层叠样式结构
(3)JS：动态脚本
特点：
交互性（它可以做的就是信息的动态交互）
安全性（不允许直接访问本地磁盘）
跨平台性（只要是可以解释js的浏览器都可以执行，和平台无关）
2、JS三大部分组成

为什么要学JavaScript
JavaScript在互联网中的应用几乎无处不在，为了提升用户体验和数据的操作，常见的适用场景
(1)页面效果(用户体验)
(2)表单验证
(3)事件监听数据处理
(4)页面跳转
(5)局部刷新
JS的三种引入方式
1、行内JS
行内使用较少，只针对某些特殊的标签
语法：点我，点我…
我们将JS代码写在href属性中，这样我们在点击链接的时候，执行的就不是跳转地址，而是其中的JS代码

2、内部JS
页面内的JS是写在一组

仅仅在页面使用的代码

3、外部JS
外部JS方式，其实就是先单独定义一个JS文件，然后将这个JS文件与要使用的网页将关系关联起来

引入外部JS文件：

多个页面共享的js代码，提取到公共的js文件中

JavaScript变量
1.使用var关键字，无论是何种数据类型的变量，均可以使用var关键字来进行声明；弱类型
2.程序可以用变量名来指向具体的对象内存，并通过变量名来获得对应的对象
语法
var 变量名; //声明变量【推荐方式】
var 变量名=值; //声明变量并赋值【推荐方式】
已声明赋值的变量 = 另一种类型值; //【不推荐】
不声明变量 = 值; //不事先声明变量直接使用
示例代码

JavaScript原始数据类型
1.JavaScript中的原始数据类型相当于Java的基本数据类型，在js中可以使用typeof 和typeof()判断当前变量属于那种数据类型；
例子：var a = true; alert(typeof a);//boolean alert(typeof (a));//true
number类型
var num = 10;
无穷数
console.debug(1/0);//无穷大
console.debug(isFinite(1/0));//是否有穷
非数
console.debug(123/“abc”);//nan
console.debug(123/“123”);//1

Boolean（布尔类型）
var res = false;
console.debug(res);
res=new Bollean()
console.debug(res);
if(“屁神”){
console.debug(“牛皮啊”);
}
String(字符串类型)
var b = “小弟弟”
b=“小哥哥”
console.debug(b)
console.debug(b.length)

undefined（未定义或未初始化
var pson=null
console.debug(pson)//null值
var aml;
console.debug(aml);//undifined没定义

JavaScript运算符
1、赋值运算符

算术运算符

比较运算符（关系运算符)
var num1 = 10;
var num2 =20;
console.debug(num1num2);//true
console.debug(num1=num2);//false
console.debug(num1!==num2);//true

	for(var i=0;i<=10;i++){
		console.debug(666)
		
}

JavaScript控制流程
1.分支：
(1)if语句
(2)switch语句
2.循环：
(1)while语句
(2)do-while语句
(3)for循环
3.break/continue语句
4.三目表达式
JavaScript函数
语法
function run(num1,num2){
console.debug(num1+num2)
}
run(10,20)
run(10)
run();
全局变量和局部变量
var name=“全局变量”
function walk(){
name=“小姐姐”;
}
//walk
function smile(){
var name=“小哥哥”
}
smile;
console.debug(name);

匿名函数语法
/匿名函数/
var fun=function(){
console.debug(“小姐姐”)
}
fun();
JavaScript对象
本地对象
Date：日期对象
var date= new Date();
console.debug(date);
date.dateFormat = function(){//为改对象添加一个函数
var year = this.getFullYear();
var mouth = this.getMonth();
var day = this.getData();
var hour = this.getHours();
var min = this.getMinutes();
var sec = this.getSeconds();
return year+"/"+mouth+"/"+day+" “+hour+” “min+” "+sec;
}

		var frm = date.dateFormat();
		console.debug(frm);

String字符串对象
var str = “佳宇是个大沙雕”
var s = str.split();
console.debug(s)

		var word=String.fromCharCode(65)
		console.debug(word)

Array数组对象
arr = new Array(10);//单独写一个长度
console.debug(arr)

		arr = new Array(10,20,30);//多个元素
		console.debug(arr)
		console.debug(arr[1])
		
		arr[66]=88;
		console.debug(arr)
		console.debug(arr[66]);
		
		
		/*for in 遍历*/
		for(var i in arr){
			console.debug(arr[i])
			
		}

系统函数
需要，解码和编码
//IE浏览器不允许发送中文
var ss = “百度”
var str = “www.baidu.com?url=”+ss;
//编码
var u =encodeURI(str);
console.debug(u);
//解码
var i = decodeURI(u)
console.debug(i)

	/*
	 使用encodeURICommponent和decodeURICommponent
	 * */
	/*编码*/
	str = "www.baidu.com?url=http://www.qq.com";
	var se =encodeURIComponent(str);
	console.debug(se);
	
	//解码
	var a = "console.debug('eval函数实例')";
	console.debug(a)
	**event(a);

Math**
num = Math(1.1);
console.debug(num)

	//65-97
	var num = parseInt(Math.random()*32)+65
	console.debug(num)
	
	var word = String.fromCharCode();
	console.debug(word)

自定义类
function Person(){
console.debug(“2222”)
}
var pson = new Person();
console.debug(typeof pson)
Person();

		/*
		 * 字段
		 */
		function Person(name,age){
			this.name = name;
			this.age = age;
			
		}
		var p = new Person("佳宇",20);
		console.debug(p)
		console.debug(p.name)
		/*
		 * 方法
		 */
		function eat(){
			console.debug("吃甲鱼")
		}
		function Person(){
			//this.drink=eat;//前面代表Person属性，属性梭赋值的是函数
			this.smok=function(){
				console.debug("吸一口")
			}
		}
		p = new Person()
		//p.drink
		p.smok()
		
		
		/*
		 * part2对象添加属性的方式
		 */
		function Animal(name,age){
			this.name=name;
			this.age=age;
			this.toString=function(){
				console.debug(this.name+"-"+this.age);
			}
		}
		var aml = new Animal("二狗",18)
		console.debug(aml)
		console.debug(aml.age)
		console.debug(aml.name)
		aml.toString()
		var vml = new Animal("李四",22)
		console.debug(vml)
		//给对象添加属性
		aml.sex="男";//相当于给aml对象。仅仅是给aml这个对象添加属性
		aml.run=function(){
			console.debug("6666")
		}
		console.debug(aml)
		aml.run();
		
		/*
		 * part2给原形添加属性
		 * 
		 */
		Animal.prototype.song=function(){
			console.debug("佳宇来一个")
			
		}
		Animal.prototype.phonenum = "159645236554";
		aml.song()
		vml.song()
		console.debug(aml.phoneNum)
		console.debug(vml.phoneNum)

BOM

Window
1.window对象是BOM中的顶级对象，默认可以省略（即调用其函数时可以省略window.）；
2.window对象是相对于web浏览器而言的，依赖于浏览器，在浏览器中全局对象指的就是window对象；
3.window对象可以获取其他BOM对象；
注意：全局函数和window对象的函数不一样。全局函数不属于任何一个内置对象
需要提示框

		var res;//时钟任务的标记
		function stop(){
			res=setInterval("document.getElementById('text2').value=new Date()",1000);
			
		}
		
		function change(){
			var pass = document.getElementById("pass")
			is(pass.type=="password"){
				pass.type="text"
				
				
			}else{
				pass.type="password"
				
			}
				window.location.href = "http://www.baidu.com";
		}

	password:<input id="pass" type="password" /><input type="button" value="密码" onclick="change()"/>
	
</body>