一.简介
1.JavaScript 是一种具有面向对象能力的、解释型的程序设计语言。更具体一点，它是基于对象和事件驱动并具有相对安全性的 客户端脚本语言。它的主要目的是，验证发往服务器端的数据、增加 Web 互动、加强用户体验度等。
2.JavaScript发展史
3.JavaScript组成
ECMAScript是一个重要的标准，但它并不是JavaScript唯一的部分，当然，也不是唯一被标准化的部分。实际上，一个完 整 的JavaScript实现是由以下3个不同部分组成的。DOM（文档对象模型），BOM（浏览器对象模型）。
ECMAScript(基础语法) JavaScript的核心语法ECMAScript描述了该语言的语法和基本对象 DOM(文档对象模型) 文档对象模型（DOM）—— 描述了处理网页内容的方法和接口 BOM(浏览器对象模型) 浏览器对象模型（BOM）—— 描述了与浏览器进行交互的方法和接口
4.开发工具
1）浏览器: chrome 2）开发工具：hbuilder 3）进入“控制台”console：F12
控制台的作用: console对象代表浏览器的JavaScript控制台，用来运行JavaScript命令，常常用来显示网页运行时候的 错误信息。Elements用来调试网页的html和css代码。
5.JavaScript基本用法
JS需要和HTML一起使用才有效果，我们可以通过直接或间接的方式将JS代码嵌入在HTML页面中。
行内JS : 写在标签内部的js代码
<body> <button onclick="alert('Hello')">Hello</button> </body>内部JS : 定义在script标签内部的js代码
<!--内部JS--> <script type="text/javascript"> alert("这是内部JS"); </script>外部JS : 单独的js文件，在HTML中通过script标签引入
<!--引入外部js--> <script type="text/javascript" src="js/test.js" ></script>二.JS基础语法
1.语句和注释
语句：
JavaScript程序的执行单位为行（line），也就是一行一行地执行。一般情况下，每一行就是一个语句。
语句（statement）是为了完成某种任务而进行的操作，语句以分号结尾，一个分号即表示一个语句结束。多个语句可 以写 在一行内（不建议这么写代码），但是一行写多条语句时，语句必须以分号结尾。 表达式不需要分号结尾。一旦在表达式后面添加分号，则JavaScript引擎就将表达式视为语句，这样会产生一些没有任 何意义的语句。
注释：
// 单行注释
/*多行注释*/
兼容html注释方式<!-- -->
2.标识符和关键字
标识符就是一个名字，用来给变量和函数进行命名，有特定规则和规范
规则：
●关键字也称保留字，是被JavaScript征用来有特殊含义的单词
规范：
3.变量
变量即一个带名字的用来存储数据的内存空间，数据可以存储到变量中，也可以从变量中取出数据。
1）变量的声明
JavaScript是一种弱类型语言，在声明变量时不需要指明数据类型，直接用var修饰符进行声明。
a.先声明再赋值 b.声明并赋值 注：如果声明变量时不使用var修饰符，则该变量是全局变量
userName = "lisi";//userName未使用var修饰符，为全局变量 console.log(userName);2) 变量的注意点： ①若只声明而没有赋值，则该变量的值为 undefined ②变量要有定义才能使用，若变量未声明就使用，JavaScript 会报错，告诉你变量未定义 ③可以在同一条 var 命令中声明多个变量。 ④若使用 var 重新声明一个已经存在的变量，是无效的。 ⑤若使用 var 重新声明一个已经存在的变量且赋值，则会覆盖掉前面的值 ⑥JavaScript 是一种动态类型、弱类型语言，也就是说，变量的类型没有限制，可以赋予各种类型的值
3)变量提升 JavaScript 引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果，就 是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>变量</title> </head> <body> </body> <script type="text/javascript"> /*1、JavaScript是一种弱类型语言，声明时不需要指定数据类型，直接通过var修饰符声明*/ var a; // 先声明 a = 1; // 再赋值 var b = 2; // 声明并赋值 console.log(a,b); console.log("==========变量的注意点=========="); /*1）若只声明而没有赋值，则该变量的值为 undefined*/ var str1; // 只声明 console.log(str1); // undefined /*2）变量要有定义才能使用，若变量未声明就使用，JavaScript 会报错，告诉你变量未定义*/ //console.log(str2); // Uncaught ReferenceError: str2 is not defined /*3）可以在同一条 var 命令中声明多个变量。*/ var aa,bb,cc=1; console.log(aa,bb,cc); /*4）若使用 var 重新声明一个已经存在的变量，是无效的。*/ var a; console.log(a); /*5）若使用 var 重新声明一个已经存在的变量且赋值，则会覆盖掉前面的值*/ var b = 10; console.log(b); console.log("==========变量提升=========="); console.log(uname); // js引擎会将所有通过var声明的变量名提升到代码的头部 var uname = "zhangsan"; console.log(uname); // console.log(userName); // 只有var声明的变量才会变量提升 userName = "lisi";//userName未使用var修饰符，为全局变量 console.log(userName); </script> </html>4.数据类型
1）JavaScript 中有 6 种数据类型，其中有五种简单的数据类型： Undefined、Null、布尔、 数值和字符串。一种复杂数据类型 Object。 数 值（Number）： 整数和小数（比如 1 和 3.14） 字符串（String）： 字符组成的文本（比如"Hello World"） 布尔值（Boolean）：true（真）和 false（假）两个特定值 Undefined： 表示“未定义”或不存在，即此处目前没有任何值 Null： 表示空缺，即此处应该有一个值，但目前为空 对象（object）(引用) ： 各种值组成的集合 ①对象（object）{name:”zhangsan”,age:”18”} ②数组（array）[1,2,3] ③函数（function）function test() {} 2）typeof 操作符 typeof 操作符是用来检测数据类型。 说明： ①typeof null 返回的是 object 字符串 ②函数不是数据类型，但是也可以使用 typeof 操作符返回字符串。 typeof 操作符可以操作变量也可以操作字面量。 注意：函数在 JavaScript 中是对象，不是数据类型，所以使用 typeof 区分 function 和object 是有必要的 3）undefined undefined 类型的值是 undefined。 undefined 是一个表示"无"的原始值，表示值不存在。 出现 undefined 的常见情况： ①当声明了一个变量而没有初始化时，这个变量的值就是 undefined ②当函数需要形参，但未传递实参时 ③函数没有返回值，但定义了变量接收 4）null null 类型是只有一个值的数据类型，即特殊的值 null。它表示空值，即该处的值现在为空，它表示一个空对象引用。 使用 Null 类型值时注意以下几点： ①使用 typeof 操作符测试 null 返回 object 字符串。 ②undefined 派生自 null，所以等值比较返回值是 true。所以，未初始化的变量和赋值为 null 的变量相等 5)数值型 ①数值型包含两种数值：整型和浮点型。 所有数字（整型和浮点型）都是以 64 位浮点数形式储存。所以，JS 中 1 与 1.0 相等， 而且 1 加上 1.0 得到的还是一个整数。浮点数最高精度是 17 位小数，由于浮点数运算时可能不精确，尽量不要使用 浮点数做判断。 ②在存储数值型数据时自动将可以转换为整型的浮点数值转为整型。 ③对于过大或过小的数值，可以使用科学计数法来表示 6)Infinity、-Infinity 超过了表数范围，出现 Infinity（正无穷）或者-Infinity（负无穷） 7）isFinite()
用于检测有限性（finiteness）的值。
isFinite(number);●你可以用这个方法来判定一个数字是否是有限数字。isFinite 方法检测它参数的数值。
如果number是NaN，或者是正、负无穷大的数，则返回false；其他返回 true。
8)NaN 表示非数值（Not a Number），是一个特殊的值。 如：将字符串解析成数字出错的场合。 console.log(parseInt("abc"));//parseInt 方法将字符串解析为数值，但若无法解析，返回 NaN 注意： NaN 不等于任何值，包括它本身,因为它不是一个值 NaN 与任何数（包括它自己）的运算，得到的都是 NaN isNaN()可以用来判断一个值是否为 NaN true：不是数字；false：是数字 9)字符串 使用 ' ' 或 " "引起来，如：'sxt'，"good"。 使用加号’+’进行字符串的拼接，如：console.log('hello' + ' everybody'); 10)对象 instanceof 运算符 typeof 操作符对数组（array）和对象（object）的显示结果都是 object，那么可以利用 instanceof 运算符，它可用于判断一个变量是否某个对象的实例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>数据类型</title> </head> <body> </body> <script type="text/javascript"> var a = 1; // 数值型 console.log(typeof a); // number var b = true; // 布尔型 console.log(typeof b); // boolean var c = "Hello"; // 字符串 console.log(typeof c); // string var d; // 未定义 console.log(typeof d); // undefined var e = null; // null console.log(typeof e); // object var obj = {}; // 空对象 var obj2 = {uname:"zhangsan"}; var obj3 = new Object(); obj3.age=18; console.log(typeof obj); // object console.log(typeof obj2); // object console.log(typeof obj3); // object // 函数 function test(str) { } console.log(typeof test); // function console.log("================undefined==========="); // 1）当声明了一个变量而没有初始化时，这个变量的值就是 undefined var aa; console.log(aa); // 2）当函数需要形参，但未传递实参时 function tt(num) { console.log(num); } tt(); // 未传递实参 // 3）函数没有返回值，但定义了变量接收 function tt2() { console.log("函数..."); // return true; } tt2(); var t = tt2(); // 没有返回值 console.log(t); console.log("=================null=================="); // 1）使用 typeof 操作符测试 null 返回 object 字符串。 // 2）undefined 派生自 null，所以等值比较返回值是 true。所以，未初始化的变量和赋值为 null 的变量相等 // undefined 派生自 null console.log(undefined == null); // true var ab; // 只声明未赋值返回undefined console.log(ab == null); // true console.log("======================数值型================="); // 浮点型自动转整型 console.log(1 + 2.0); // 3 var n = 5.0; console.log(n); // 5 // 数值过大或过小会使用科学计数法显示 var num2 = 4.12e9; console.log(num2);//4120000000 console.log(0.0000000412);//4.12e-8 // 正无穷和负无穷 console.log(100e1000);//Infinity console.log(-100e1000);//-Infinity console.log(1 / -0 );// 除以负 0 得到-Infinity console.log(1 / +0); // 除以 0 得到 Infinit // isFinite() console.log(isFinite(1)); //true console.log(isFinite(100e1000)); //fasle // NaN console.log(parseInt("123")); // 123 console.log(parseInt("abc")); // NaN console.log(NaN == NaN); // false console.log(parseInt("abc") + 1); // NaN // isNaN()可以用来判断一个值是否为 NaN console.log(isNaN(parseInt("123"))); // false console.log(isNaN(parseInt("abc"))); // true console.log("================字符串==================="); console.log('Hello' + " everyone"); console.log("===============对象===================="); // instanceof 运算符 var o = {}; var ar = []; console.log(o instanceof Object); // true console.log(ar instanceof Array); // true </script> </html>5.类型转换
1）自动类型转换 2）函数转换 parseInt() ①parseInt()在转换之前，首先会分析该字符串，判断位置为 0 处的字符，判断它是否是个有效数字，如果不是，则直 接返回 NaN，不再继续，如果是则继续，直到找到非字符 ②parseInt()方法还有基模式，可以把二进制、八进制、十六进制或其他任何进制的字符串转换成整数。基是由 parseInt()方法的第二个参数指定的 ③如果十进制数包含前导 0，那么最好采用基数 10，这样才不会意外地得到八进制的值 parseFloat() parseFloat()方法与 parseInt()方法的处理方式相似，但是parseFloat()可以识别第一个小数点 3）显示转换 toString()函数将内容转换为字符串形式，其中 Number 提供的 toString()函数可以将数字以指定的进制转换为字符串，默认为十进制。 Number 还提供了 toFixed()函数将根据小数点后指定位数将数字转为字符串，四舍五入 4）强制转换 JS 为 Number、Boolean、String 对象提供了构造方法，用于强制转换其他类型的数据。 此时操作的是整个数据，而不是部分。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>类型转换</title> </head> <body> </body> <script type="text/javascript"> // parseInt() console.log(parseInt("123ab1c")); // 123 console.log(parseInt("123.4.5ab1c")); // 123 console.log(parseInt("0xA")); //returns 10 console.log(parseInt("22.5")); //returns 22 console.log(parseInt("blue111")); //returns NaN console.log(parseInt("AF", 16)); //returns 175 console.log(parseInt("10", 2)); //returns 2 console.log(parseInt("10", 8)); //returns 8 console.log(parseInt("10", 10)); //returns 10 console.log(parseInt("010")); //returns 8 console.log(parseInt("010", 8)); //returns 8 console.log(parseInt("010", 10)); //returns 10 console.log("=========================="); // parseFloat() console.log(parseFloat("123ab1c")); // 123 console.log(parseFloat("123.4ab1c")); // 123 console.log(parseFloat("0xA")); //returns 10 console.log(parseFloat("22.5")); //returns 22 console.log(parseFloat("blue111")); //returns NaN console.log("====================显式转换=========="); var data = 10; console.log(data.toString()) console.log(data.toString(2))//1010（将10转换为二进制的数并将将其以字符串的形式输出） data = 1.4; console.log(data.toFixed(0)); data = 1.49; console.log(data.toFixed(1)); data = true; console.log(data.toString()); console.log("===================强制转换=========="); console.log(Number("1")); console.log(Number("1.4")); console.log(Number("123aabc")); console.log(Number("abc")); console.log(Number(true)); console.log(Number(false)); console.log(Number(19)); console.log(Number(new Object())); console.log(Number(new Array())); </script> </html>6.数组 1）数组的特点： ①数组的长度是可变的 ②数组的类型可以不一样 ③不存在下标越界 2）数组的定义 ①隐式创建 var 变量名 = [值1,值2,...]; ②直接实例化 var 变量名 = new Array(值1,值2,...); ③实例化并指定长度 var 变量名 = new Array(size); 3）获取数组的长度 数组.length 4)数组的遍历 数组的遍历即依次访问数组的每一个元素 ，JS 提供三种遍历数组的方式： ①普通 for 循环遍历 for(var i = 0; i < 数组名.length; i++) { } 注：可以拿到undefinded的值，无法获取数组中属性对应的值 ②for ... in for(var i in 数组) { // i是下标或属性名 } 注：无法拿到undefinded的值，可以获取数组中属性对应的值 ③foreach 数组.foreach(function(element,index){ // element：元素；index：下标 }); 注：无法获取属性对应的值与undefinded的值 * for -- 不遍历属性 * foreach -- 不遍历属性和索引中的 undefined * for in -- 不遍历索引中的 undefined 5)数组提供的方法 push 添加元素到最后 unshift 添加元素到最前 pop 删除最后一项 shift 删除第一项 reverse 数组翻转 join 数组转成字符串 indexOf 数组元素索引 slice 截取（切片）数组，原数组不发生变化 splice 剪接数组，原数组变化，可以实现前后删除效果 concat 数组合并
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>数组</title> </head> <body> </body> <script type="text/javascript"> // 1、隐式创建 var arr1 = [1,'a','b','c']; // 2、直接实例化 var arr2 = new Array('aa','bb','cc'); // 3、实例化并指定长度 var arr3 = new Array(5); // 获取数组的长度 console.log(arr1.length); console.log(arr2.length); console.log(arr3.length); arr1.length = 10; console.log(arr1.length); console.log(arr1); // 赋值 arr1[0] = 2; // 修改数组的值 arr1[6] = 'hello'; // 修改数组的值 arr1[13] = '13'; console.log(arr1); // 取值 console.log(arr1[10]); // 设置数组的属性 arr1["ii"] = "zhangsan"; console.log(arr1); console.log(arr1.ii); console.log("=======数组的遍历========="); // 1、普通 for 循环遍历 for (var i = 0; i < arr1.length; i++) { console.log(i + "----------" + arr1[i]); } console.log("==============="); // for... in for (var i in arr1) { console.log(i + '----------' + arr1[i]); } console.log("==============="); // foreach arr1.forEach(function(elem,index){ console.log(index+ '----' + elem); }); console.log("========数组提供的方法======="); console.log(arr2); arr2.push("dd"); // 数组的最后添加元素 arr2[arr2.length] = "ee"; console.log(arr2); arr2.unshift("hello"); console.log(arr2);// 数组的最前面添加元素 // 分割数组 var str = arr2.join("-"); console.log(str); // 将字符串转换成数组 var strarr = str.split("-"); console.log(strarr); </script> </html>7.函数： 函数，即方法。函数也是对象。 1）函数的定义 定义方式有3种： ①函数声明语句 function 函数名([形参]) { } 调用：函数名([实参]); ②函数定义表达式 var 变量名/函数名 = function([形参]){ } 调用：变量名([实参])/函数名([实参]); ③Function构造函数 var 函数名 = new Function('参数1','参数2','函数的主体内容'); 调用：函数名([实参]); 注：构造函数的最后一个参数是函数体。 注意： ①js 中的函数没有重载，同名的函数，会被后面的函数覆盖。 ②js 中允许有不定数目的参数，后面介绍 arguments 对象 函数名的提升（了解） JavaScript 引擎将函数名视同变量名，所以采用 function 命令声明函数时，整个函数会像变量声明一样，被提升到 代码头部。所以，下面的代码不会报错 但是，如果采用赋值语句定义函数，JavaScript 就会报错。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>函数</title> </head> <body> </body> <script type="text/javascript"> /* 函数的定义 */ // 1、函数声明语句 function fn1(a,b) { console.log(a+b); } fn1(1,1); // 2、函数定义表达式 var fn2 = function(x){ console.log(x); } console.log(fn2); fn2(10); // 3、Function构造函数 var fn3 = new Function('x','y','console.log(x+y);') fn3(1,2); fn4(); /*函数名的提升*/ function fn4() { console.log("函数名的提升。。。。"); } fn5(); var fn5 = function(){ console.log("函数名的提升..."); } </script> </html>2）函数的参数、调用和return
①参数 函数运行的时候，有时需要提供外部数据，不同的外部数据会得到不同的结果，这种外部 数据就叫参数，定义时的参数称为形参，调用时的参数称为实参 ⑴实参可以省略，那么对应形参为 undefined ⑵若函数形参同名（一般不会这么干）：在使用时以最后一个值为准。 ⑶可以给参数默认值：当参数为特殊值时，可以赋予默认值。 ⑷参数为值传递，传递副本 ；引用传递时传递地址，操作的是同一个对象 ②函数的调用 ⑴常用调用方式：函数名([实参]); 存在返回值可以变量接收，若接收无返回值函数则为 undefined ⑵函数调用模式 ⑶方法调用模式 ⑷call()和apply() 注：谁调用函数，this就指向谁 ③匿名函数立即调用 ⑴匿名函数：function ([参数]){} ⑵调用：(function ([形参]) {})([实参]); 在函数只被使用一次的情况下可以使用这种方式，简便省事 ④ return 语句 函数的执行可能会有返回值，需要使用 return 语句将结果返回。return 语句不是必需的， 如果没有的话，该函数就不返回任何值，或者说返回 undefined。 作用：在没有返回值的方法中，用来结束方法。 有返回值的方法中，一个是用来结束方法，一个是将值带给调用者。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>函数的参数、调用和return</title> </head> <body> </body> <script type="text/javascript"> /* 参数 */ // 1、实参可以省略，那么对应形参为 undefined function fn1(a,b) { console.log(a); } fn1(); fn1(1); fn1(1,2); // 2、若函数形参同名（一般不会这么干）：在使用时以最后一个值为准。 function fn2(x,x){ console.log(x); } fn2(10,20); // 3、可以给参数默认值：当参数为特殊值时，可以赋予默认值。 function fn3(str) { str = str || "Hello"; console.log(str); } fn3(); fn3("你好"); function fn4(str) { (str !== undefined && str !== null) ? str = str : str = "值不存在"; console.log(str); } fn4(); fn4("你好呀"); // 4、参数为值传递，传递副本 ；引用传递时传递地址，操作的是同一个对象 // 值传递 var num = 10; function fn5(n) { n = 20; } fn5(num); console.log(num); // 引用传递 var arr = [1,2,3]; var obj = { uname:"zhangsan" }; function fn6(a,b) { a[0] = 100; b.uname = "lisi"; } fn6(arr,obj); console.log(arr); console.log(obj); function fn7(a,b) { a = [4,5,6]; b = { uname:"wangwu" }; } fn7(arr); console.log(arr); console.log(obj); console.log("===============函数的调用=============="); // 直接调用 function fn8() { console.log(this); // Window对象 } fn8(); // 函数调用模式 var fn9 = function() { console.log(this); // Window对象 return 1; } var f = fn9(); console.log(f); // 方法调用模式 var obj = { uname:"zhangsan", uage:18, cats:["喵喵","猫猫"], sayHello:function() { console.log(this); // obj对象 console.log("你好呀~"); } }; console.log(obj.sayHello); obj.sayHello(); // 间接调用 var obj2 = {}; function fn10(x,y) { console.log(x+y); console.log(this); } fn10(1,2); // Window对象 fn10.call(); // Window对象 fn10.call(obj2); // obj2 fn10.call(obj2,10,20); // obj2 fn10.apply(obj2,[100,200]); // obj2 console.log("===============匿名函数立即调用=============="); (function(a,b) { console.log(a-b); })(10,2); </script> </html>3）arguments 对象和函数的方法及属性 arguments对象可以得到函数的实参数量 函数名.name 得到函数名称 函数名.length 得到函数的形参数量 函数名.toString() 得到函数的源码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>arguments 对象和函数的方法及属性</title> </head> <body> </body> <script type="text/javascript"> function fn1 (a,b,c) { // arguments对象可以得到函数的实参数量 console.log(arguments.length); console.log("函数...."); console.log(arguments); } fn1(1,2); console.log(fn1.name); console.log(fn1.length); console.log(fn1.toString()); </script> </html>4）函数的作用域 函数作用域：全局(global variable)和局部(local variable) ①全局变量与局部变量同名问题 ②在函数中定义变量时，若没有加 var 关键字，使用之后自动变为全局变量 ③变量作用域提升
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>函数的作用域</title> </head> <body> </body> <script type="text/javascript"> var num = 1; function fn() { var num = 10; // 这是个局部变量，与全部变量毫无关系 console.log(num); // 就近原则 var b = 2; // 局部变量 c = 3; // 不用var修饰符声明的变量时全局变量 } fn(); console.log(num); //console.log(b); console.log(c); function foo(x) { if (x > 100) { var tmp = x - 100; } console.log(tmp); } function foo(x) { var tmp; if (x > 100) { tmp = x - 100; } console.log(tmp); } foo(1); </script> </html>8.闭包
1.闭包的形成： 1）外部函数内部嵌套内部函数 2）内部函数中使用外部函数的环境 3）外部函数返回内部函数 2.闭包的作用： 1）获取函数内部的变量 2）保存变量的值在内存中 3）避免变量名重复
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>闭包</title> </head> <body> </body> <!-- 闭包 <script type="text/javascript"> // 1、外部函数内部嵌套内部函数 function fn1() { var a = "Hello!"; function fn2() { // 2、内部函数中使用外部函数的环境 console.log(a); } // 3、外部函数返回内部函数 return fn2; } var f = fn1(); console.log(f); f(); function test() { var num = 1; num++; console.log(num); } test(); test(); test(); console.log("===================="); // 1、外部函数内部嵌套内部函数 function outFn() { var num = 1; function inFn(){ // 2、内部函数中使用外部函数的环境 num++; console.log(num); } // 3、外部函数返回内部函数 return inFn; } var inF = outFn(); inF(); inF(); inF(); inF(); var inF1 = outFn(); inF(); console.log("===========浇水实例========="); document.write("==========浇水实例=========<br>"); // 定义外部函数，设置形参（水壶的容量） function waterFlower(total) { // 定义内部函数，执行浇水过程 （每次浇水，水容量减50ml） function water(flower) { // 当水容量大于50ml则浇水 if (total >= 50) { // 每次浇水减50 total = total - 50; } else { // 如果没水，则自动加水 document.write("<h4>正在重新装水....</h4>"); total = 200; // 浇水 total = total - 50; // } document.write("给"+flower+"浇水50ml，剩余" + total + "ml的水！<br>"); } // 返回内部函数 return water; } // 装水 var t = waterFlower(200); // 浇水 t("桃花"); t("兰花"); t("玫瑰花"); t("菊花"); t("桂花"); </script> </html>9.DATE:
//获取 ◦ getFullYear()年, getMonth()月, getDate()日, ◦ getHours()时,getMinutes()分,getSeconds()秒 //设置 ◦ setYear(), setMonth(), … ◦ toLoacaleString() 说明： 1)getMonth()：得到的值：0~11（1 月~12 月） 2)setMonth()：设置值时 0~11 3)toLocaleString()：可根据本地时间把 Date 对象转换为字符串，并返回结果。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>内置对象</title> </head> <body> </body> <script type="text/javascript"> // 得到系统当前时间 var mydate = new Date(); console.log(mydate); // toLocaleString()：可根据本地时间把 Date 对象转换为字符串，并返回结果。 console.log(mydate.toDateString()); console.log(mydate.toLocaleString()); var mon = mydate.getMonth()+1; if (mon < 10) { mon = "0" + mon; } var newDate = mydate.getFullYear() + "-" + mon + "-" + mydate.getDate(); newDate += " " + mydate.getHours() + ":" + mydate.getMinutes() + ":" + mydate.getSeconds(); console.log(newDate); </script> </html>10..JS对象 JS中一切数据皆对象。 1)定义对象 JS 创建自定义对象，主要通过三种方式： ①字面量形式创建对象 var 变量名 = {}; // 空对象 var 变量名 = {键:值,....}; ②通过 new Object 对象创建 var 变量名 = new Object(); ③通过 Object 对象的 create 方法创建对象 var 变量名 = Object.create(null或对象); 2)对象的序列化和反序列化 序列化即将 JS 对象序列化为字符串，反序列化即将字符串反序列化为 JS 对象。JS 中通过 调用 JSON 方法，可以将对象序列化成字符串，也可以将字符串反序列化成对象 。 序列化对象，将对象转为字符串 JSON.stringify(object) 反序列化，将一个 Json 字符串转换为对象。 JSON.parse(jsonStr) 3)eval() ①可借助 eval()动态函数，将参数字符串解析成 js 代码来执行，只接受原始字符串作为参数 eval(“console.log(‘你好’)”);//控制台输出你好 2、可将 json 串转为 json 对象 1）第一种解析方式：得到的 json 对象名就是 jsonObj eval("var jsonObj = " + jsonStr); 2）第二种解析方式：对象中有多个属性 var jsonObj = eval("(" + jsonStr + ")"); 由于 json 是以{ }的方式来开始以及结束的，在 eval 中会被当成一个语句块来处理，故必 须强制将它转换成一种表 达式。加上圆括号是使 eval 函数在处理时强制将括号内的表达式转化为对象而不作为语句来执行。 3）第二种解析方式：对象中只有一个属性 eval(jsonStr);
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS对象</title> </head> <body> </body> <script type="text/javascript"> // 1、字面量形式创建对象 var obj = {}; // 空对象 var obj2 = { uname:"zhangsan", uage:18 }; obj2.usex=true; console.log(obj); console.log(obj2); // 2、通过 new Object 对象创建 var obj3 = new Object(); obj3.name = "Tom"; console.log(obj3); // 3、通过 Object 对象的 create 方法创建对象 var obj4 = Object.create(null); console.log(obj4.uname); var obj5 = Object.create(obj2); console.log(obj5.uname); console.log('============序列化和反序列化============'); var str = '{"uname":"zhangsan", "uage":18 }'; // 反序列化：将字符串转换成对象 var object1 = JSON.parse(str); console.log(object1); console.log(object1.uname); // 序列化，将对象转换成字符串 var json1 = JSON.stringify(object1) console.log(json1); console.log(json1.uname); console.log("=============eval()============"); console.log('你好'); eval("console.log('你好')");//控制台输出你好 // 1）第一种解析方式：得到的 json 对象名就是 jsonObj var ab = '{"uname":"zhangsan", "uage":18 }'; eval("var jsonObj = " + ab); console.log(jsonObj); // 2）第二种解析方式：对象中有多个属性 var jsonObj2 = eval("(" +ab + ")"); console.log(jsonObj2); var arrStr = "[1,'1a','fg']"; // 第一种解析方式eval("var arrObj = " + arrStr); eval("var arr=" + arrStr); console.log(arr); // 第二种解析方式：eval(arrStr); console.log(arrStr); console.log(eval(arrStr)); </script> </html>
