day51---前端之JavaScript二

1. 函数

函数的定义

	function 函数名(参数名1,参数名2) {
			函数体;
			return 返回值;
	}

函数的功能

  • 函数由关键字function定义

  • 可以使用变量、常量或表达式作为函数调用的参数

  • 函数名的定义规则与标识符一致，区分大小写

  • 返回值使用return关键字

Function类

  • 描述：Function类可以表示开定义的任何函数

  • 用Function类直接创建函数的语法：

	var 函数名 = new Function('参数1','参数2','函数体');

函数的调用

  • 函数调用语法：

	函数名(参数值1,参数值2);

  • 注意：在调用有参数的函数时，只要把函数名写对就不会报错

    • 不写参数返回NaN
    • 传入参数的个数小于接收参数的个数返回NaN
    • 传入参数的个数大于接收参数的个数，只取有效位置的参数传入

函数的加载

  • 描述：JavaScript中的函数加载跟Python是有区别的，JavaScript是先把整个文件中的代码都加载到内存中，然后再执行，所有函数的声明和调用顺序是不严格的

匿名函数

	// 声明匿名函数
	var 函数名 = function (参数名1,参数名2) {
			函数体;
	}
	// 调用匿名函数
	函数名(参数值1,参数值2)

自执行函数

	(function(参数名1,参数名2){
			函数体;
	})(参数值1,参数值2)

函数的作用域

  • 局部变量：在JavaScript函数内部使用var声明的变量叫局部变量，局部变量的作用域是函数内部，它只能在函数内部访问

  • 全局变量：在JavaScript函数外部声明的变量叫全局变量，全局变量的作用域是全局，网页上的所有脚本和函数都能访问它

  • 变量的生存周期：

    • JavaScript变量的生命期从它们被声明的时间开始
    • 局部变量会在函数运行以后被删除
    • 全局变量会在页面关闭后被删除

函数的嵌套

  • 描述：JavaScript中的函数嵌套跟Python类似，先在内层函数中查找变量，找不到则到外层函数查找，逐步向外一层一层查找到最外层为止

闭包函数

  • 描述：JavaScript中的闭包函数跟Python类似，内部函数可以访问外部函数的变量

函数的应用

	// 简单版
	function f1(){
			var name = 'yy';
			console.log(name);
	}
	f1();
	>>> yy
	// 带参数版
	function f2(x, y) {
			var z = 2;
			console.log((x * y) / z);
	}
	f2(10, 5);
	>>> 25
	// 带返回值版
	function f3(name, age) {
			var res = 'name is: ' + name + ',' + 'age is: ' + age;
			return res;
	}
	ret = f3('yan', 20);
	console.log(ret);
	>>> name is: yan,age is: 20
	// 嵌套版1
	var name = 'yy';
	function f4() {
			var name = 'yan';
			function f5() {
				console.log(name)
			}
			f5()
	}
	f4();
	>>> yan
	// 嵌套版2
	var age = 18;
	function f6() {
			return age;
	}
	function f7() {
			var age = 20;
			return f6();
	}
	console.log(f7());
	>>> 18
	// 匿名函数
	var sum = function(a, b) {
			return a + b;
	};
	console.log(sum(2, 3));
	>>> 5
	// 自执行函数
	(function(x, y) {
			console.log(x * y);
	})(5, 6);
	>>> 30
	// 闭包函数
	var num = 10;
	function outer() {
			var num = 100;
			function inner() {
			   console.log(num);
			}
			return inner;
	}
	res = outer();
	res();
	>>> 100

2. 对象

  • 描述：从传统意义上来说，ECMAScript 并不真正具有类。事实上，除了说明不存在类，在 ECMA-262 中根本没有出现“类”这个词。ECMAScript 定义了“对象定义”，逻辑上等价于其他程序设计语言中的类

  • 说明：在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象，也可以用创建对象的方法定义变量

  • 对象的实例化方法：

	var o = new Object();

  • 对象的概念与分类：

    • 由ECMAScript定义的本地对象.独立于宿主环境的 ECMAScript 实现提供的对象(native object)
    • ECMAScript 实现提供的、独立于宿主环境的所有对象，在ECMAScript程序开始执行时出现.这意味着开发者不必明确实例化内置对象，它已被实例化了。ECMA-262 只定义了两个内置对象，即Global和Math，它们也是本地对象，根据定义，每个内置对象都是本地对象(built-in object)
    • 所有非本地对象都是宿主对象(host object)，即由ECMAScript实现的宿主环境提供的对象。所有 BOM 和 DOM 对象都是宿主对象

  • object对象：ECMAScript中的所有对象都由这个对象继承而来；Object对象中的所有属性和方法都会出现在其他对象中

    • ToString()：返回对象的原始字符串表示
    • ValueOf()： 返回最适合该对象的原始值。对于许多对象，该方法返回的值都与ToString()的返回值相同

  • 11种内置对象：Array,String,Date,Math,Boolean,Number,Function,Global,Error,RegExp,Object

  • 内置对象的分类：

    • 数据对象：Number(数字对象)/String(字符串对象)/Boolean
    • 组合对象：Array(数组对象)/Math(数学对象)/Date(日期对象)
    • 高级对象：Object(自定义对象)/Error(错误对象)/Function(函数对象)/RegExp(正则表达式对象)/Global(全局对象)

创建对象

	// 创建对象
	var info = {'name': 'yy', age: 18};
	// 实例化对象obj
	var obj = new Object(info);
	// name和age是obj对象的属性
	console.log(obj.name);
	console.log(obj['age']);

Date对象

  • 创建Date对象：

	// 无参数，默认为当前时间
	var date1 = new Date();// 实例化日期对象，不传入参数默认获取当前时间
	console.log(date1);// 中国时区日期和时间格式
	console.log(date1.toLocaleString());// 本地日期和时间格式
	console.log(date1.toUTCString());// UTC时区日期和时间格式
	console.log(date1.toDateString());// 中国时区日期
	console.log(date1.toTimeString());// 中国时区时间
	console.log(date1.toLocaleDateString());// 本地日期格式
	console.log(date1.toLocaleTimeString());// 本地时间格式
	console.log(date1.toISOString());// ISO标准格式的时间与日期
	console.log(date1.toJSON());// JSON数据格式的时间与日期
	>>>
	Wed Dec 27 2017 17:14:28 GMT+0800 (中国标准时间)
	2017/12/27 下午5:14:28
	Wed, 27 Dec 2017 09:14:28 GMT
	Wed Dec 27 2017
	17:14:28 GMT+0800 (中国标准时间)
	2017/12/27
	下午5:14:28
	2017-12-27T09:14:28.471Z
	2017-12-27T09:14:28.471Z
	// 参数为日期字符串
	var date2 = new Date('2017-11-11 11:11:11');
	console.log(date2);
	var date3 = new Date('2017/11/11 11:11:11');
	console.log(date3);
	var date4 = new Date('2017.11.11 11:11:11');
	console.log(date4);
	var date5 = new Date('2017,11,11 11:11:11');
	console.log(date5);
	>>>
	Sat Nov 11 2017 11:11:11 GMT+0800 (中国标准时间)
	Sat Nov 11 2017 11:11:11 GMT+0800 (中国标准时间)
	Sat Nov 11 2017 11:11:11 GMT+0800 (中国标准时间)
	Sat Nov 11 2017 11:11:11 GMT+0800 (中国标准时间)
	// 参数为毫秒数，注意：这里的单位是毫秒(1秒 = 1000毫秒)
	var date6 = new Date(1514365333000);
	console.log(date6);
	>>>
	Wed Dec 27 2017 17:02:13 GMT+0800 (中国标准时间)
	// 参数为年、月、日、时、分、秒、毫秒的数字类型(毫秒不显示)，注意：月份的取值范围是0~11，0代表一月份，11代表十二月份
	var date7 = new Date(2016,12,12,12,12,12,500);
	console.log(date7);
	var date8 = new Date(2017,11,11,11,11,11,500);
	console.log(date8);
	>>>
	Thu Jan 12 2017 12:12:12 GMT+0800 (中国标准时间)
	Mon Dec 11 2017 11:11:11 GMT+0800 (中国标准时间)

  • Date对象的方法：

getDate()：获取日
getDay()：获取星期(0~6)
getMonth()：获取月(0-11)
getFullYear()：获取完整年份
getYear()：获取年
getHours()：获取小时
getMinutes()：获取分钟
getSeconds()：获取秒
getMilliseconds()：获取毫秒
getTime()：返回累计毫秒数(从1970/01/01 00:00:00开始)

  • Date对象的应用：

	// 把当前时间格式化：'1970-01-01 00:00:00 星期四'
	function getnow(date) {
			var Dyear = date.getFullYear();
			var Dmonth = date.getMonth();
			var Dday = date.getDate();
			var Dhour = date.getHours();
			var Dminute = date.getMinutes();
			var Dsecond = date.getSeconds();
			var Dweek = date.getDay();
			if ( Dminute < 10) {
				Dminute = '0' + Dminute;
			}
			var week_list = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
			console.log(Dyear + '-' + Dmonth + '-' + Dday + ' ' + Dhour + ':' + Dminute + ':' + Dsecond + ' ' + week_list[Dweek]);
	}
	date = new Date();
	getnow(date);

JSON对象

  • 说明：序列化与反序列化

  • 序列化：JSON.stringify

  • 反序列化：JSON.parse

	var d = {'name': 'yy', 'age': 18};
	sd = JSON.stringify(d);
	od = JSON.parse(sd);
	console.log(d, typeof d);
	console.log(sd, typeof sd);
	console.log(od, typeof od);
	var l = [1,2,3,4,5];
	sl = JSON.stringify(l);
	ol = JSON.parse(sl);
	console.log(l, typeof l);
	console.log(sl, typeof sl);
	console.log(ol, typeof ol);
	>>>
	{name: "yy", age: 18} "object"
	{"name":"yy","age":18} string
	{name: "yy", age: 18} "object"
	[1, 2, 3, 4, 5] "object"
	[1,2,3,4,5] string
	[1, 2, 3, 4, 5] "object"

RegExp对象

  • 说明：正则表达式

  • 创建正则表达式对象的方式：

    • var 对象名 = new RegExp(正则表达式,匹配模式)
    • var 变量名 = /正则表达式/匹配模式

  • 匹配模式：

    • g：global全局
    • i：(ignore case)忽略大小写

  • 正则表达式对象的方法：test

	var 变量名 = /正则表达式/匹配模式
	变脸名.test(判断的字符串)

Math对象

  • 说明：数学运算

  • Math是内置对象，与Global的不同之处是，在调用时需要使用"Math."前缀

  • Math的常用方法：

	max(x,y)：返回 x 和 y 中的最高值
	min(x,y)：返回 x 和 y 中的最低值
	abs(x)：返回数的绝对值
	pow(x,y)：返回 x 的 y 次幂
	sqrt(x)：返回数的平方根
	random()：返回 0 ~ 1 之间的随机数
	round(x)：把数四舍五入为最接近的整数
	floor(x)：对数进行下舍入
	exp(x)：返回e的指数
	log(x)：返回数的自然对数(底为e)
	sin(x)：返回数的正弦
	tan(x)：返回角的正切

3. 异常处理

  • 异常处理的语法结构：

	try {
		//这段代码从上往下运行，其中任何一个语句抛出异常该代码块就结束运行
	}
	catch (e) {
		// 如果try代码块中抛出了异常，catch代码块中的代码就会被执行
		// e是一个局部变量，用来指向Error对象或者其他抛出的对象
	}
	finally {
		// 无论try中代码是否有异常抛出(甚至是try代码块中有return语句)，finally代码块中始终会被执行
	}

  • 注意：主动抛出异常 throw Error('xxxx')

posted @ 2017-12-27 16:12  _岩哥  阅读(126)  评论(0)    收藏  举报