JavaScript基础

本文内容是根据毕晓东老师的****总结而得。

1.概述和java的区别

一门标准的程序设计语言。JavaScript基于对象和事件驱动的脚本语言，主要应用在客户端（jsp用在服务端）。

特点：

• 交互性强（可以实现信息的动态交互）；
• 安全性（不能直接访问本地硬盘）；
• 跨平台性（只要有可以解析js的浏览器都可执行，和操作系统和平台无关）

JavaScript和Java的不同：

• JS是Netspace公司的产品，前身是LiveScript（有很多的动态效果）；Java是Sun公司的产品，现在是Oracle的产品。
• JS是基于对象（启动后，写的都变成对象），Java是面向对象（描述事物）。
• JS只需解析就可以执行，Java需要先编译成字节码文件再执行。
• JS是弱类型（分配的空间可以为任何类型）；Java是强类型（对每种数据都定义好类型，每一种类型都有具体的划分，并对该类型分配好的空间进行定义）。

2.JS和Html相结合的两种方式

以标签形式将JS与HTML结合：

• JS代码存放在标签对<script>js code…</script>中；
• 当有多个HTML页面使用到JS脚本时，可以将js代码封装到一个文件中，只要在script标签的src属性引入一个JS文件即可（方便后期维护，扩展）。

注意：

• 如果在Script标签中定义了src属性，那么标签中的内容不会被执行。例，<script src=”test.js” type=”text/javascript”></script>;所以通常导入js文件（导入的是函数库）都是用单独<script>标签来完成；
• 规范中script标签早期有一个language，而现在使用type属性

3.语法的通用体现

通常高级程序设计语言所包含的语法内容：关键字、标识符（用于标识数据和表达式的符号，可以理解为在程序中自定义的名称，如变量名、函数名等）、注释、变量（用于标识内存中的一片空间。用于存储数据，该空间中的数据时可以变化的；何时使用变量：当数据不确定时）常量、运算符、语句（用于对程序的运行流程进行控制的表达式）、函数（对功能代码进行封装，便于提高复用性）、数组（容器，对多数据进行存储，便于操作）、对象（只要是基于对象的语言或是面向对象的语言，就存在对象的概念，对象就是一个封装体，既可以封装数据也可以封装函数）。这些都是高级程序设计语言具备的共性内容，只不过各种语言对这些内容的表现形式有所不同，但是思想是一致的。JS也有变量、语句、函数、数组等常见语言组成元素。

4.JS语法-变量

 

JS中定义变量要使用到关键字var。

var x=3;

• JS是弱类型的，具体类型不确定。
• 非严谨性：结尾分号及var写与不写都行。但开发时，建议按照严谨方式写。

在JS中单引和双引都是定义字符串。

5.JS语法-算数运算符

运算符：

• 算数运算符：+ - * / % ++ --；
• 赋值运算符；
• 比较运算符；
• 逻辑运算符；
• 位运算符: & | ^ >> << >>>；
• 三元运算符；

 

6.JS语法-其他运算符

JS中单个&或者 |是位运算符。此处即1&1则结果为1。如果是t>3 && t<6运算为true&&true结果为true。所以运算真假时尽量使用&& 或 ||。

位运算符：& | ^ >> << >>>

110---6

011---3

010---结果

• 异或（^）特点：两边相同结果为假，两边不同则为真。一个数异或同一个数两次还是这个数（5^3^3）。
• 或：两边都为真结果为真
• 右移：>>>
• 左移：<<
• 三元运算符：java中是if else的简写格式，但是三元运算符运算完必须有结果， 而if else 没有。但是JS中三元运算符运算完可以没有结果。

结果为：undefined。这种情况弹出无效

这种情况弹出有效。

7.JS语法-小细节

特殊情况：

• undefined：未定义(变量没有赋值)，其实它就是一个常量；

• 要想获取具体值的类型，可以通过typeof来完成。

要判断数字是什么类型：

8.JS语句-if语句

语句：

• 顺序结构；
• 判断结构：if语句；
• 选择结构；
• 循环结构；
• 其他结构；

判断结构：

如上图，是将4赋值给x，而此处可以将x赋值为4所以打印yes。所以要注意。所以可以将判断写为if(4==x)，如果写错成if(4=x)直接会报错。

9.JS语句-switch语句

选择结构，switch语句永远第一个执行case 1，最后执行default

10.JS语句-循环语句

• 循环控制条件；
• 明确循环内容；
• 控制循环结束条件；

document.write()将js中的值写到页面会被浏览器所解析。而浏览器中<br/>就可以换行

例：document.write(“<font color=’red’> x=”+x+”</font><br/>”);

for循环：

注意for循环中初始值化要用var

11.JS语句-其他语句

• break:跳出选择，跳出当前循环，不会跳多级循环；
• continue:用于循环语句，结束本次循环继续下次循环

break直接跳出当前循环，不会跳多级循环。

结果：

循环标号：

如果是continue有结束标号，结果同上。

12.JS语句-练习-九九乘法表

对齐：

使用表格进行格式化：

结果：

13.JS数组

数组用于存储更多的数据，是一个容器。

js中的数组定义的两种方式：

• var arr =[];var arr = [2,3,4,6];
• 使用JS中Array对象来完成定义。var arr = new Array();//var arr = [];var arr1 = new Array(5);//数组定义并设置长度为5；var arr2 = new Array(4,5,2);//定义数组且元素为4,5,2

js数组的数组属性很多：lengh

特点：长度是可变的；元素类型是任意的。建议在使用数组时，存储同一类型的元素。操作起来更方便。

 

结果：

14.JS函数

函数：一个功能的封装体

定义功能通常需要两个明确：

• 功能的结果；
• 功能实现中的参与运算的未知内容。

函数定义格式：

通过指定关键字来定义；

function 函数名(参数列表){

   函数体

return 返回值；//如果没有返回值，return语句可以不写

}

示例：

15.JS函数-细节1

JS调用函数时参数传入不对或者不传，都能调用对应函数，但是建议函数中定义几个参数就传递几个实参，否则，没有传入的参数，变量取值会是undefined。

只要使用了函数的名称就是对这个函数的调用。

函数中有一个数组在对传入的参数进行存储，这个数组的名字就是arguments。

16.JS函数-细节2

调用时，函数忘记写括号时，不会报错，但是执行时会有问题。

分析：函数底层原理：js中函数基于对象，所以函数底层也是对象。

一建立funtion getSum()就在堆中建立了函数对象，这个对象了就维护了一个数组arguments，里面就是要传的各种参数，而函数名字就是getSum，也就是函数对象的名字。对象创建完后，如果调用时用getSum()，函数就会运行，然后返回。然后赋值给sum再进行打印；如果调用时写了getSum时，getSum是一个对象，里面存储的是对象的地址，当赋值给sum时，又创建一个对象，然后把getSum赋值给sum，然后就指向了函数getSum()，这样一个函数就有多个名字（getSum、sum），再打印sum时，直接将js函数对象变成字符串（相当于java中的toString()方法）进行打印。而这个字符串就是函数的定义格式。

总结：getSum和getSum()的区别：

var sum = getSum();//getSum函数运行，并将返回的结果赋值给sum;

var sum  = get sum;//getSum本身是一个函数名，而函数本身在js中就是一个对象，getSum就是这个函数对象的引用，将getSum这个引用的地址赋值给sum，这时sum也指向了这个函数对象。相当于这个函数对象有两个函数名称。

alert(“sum=”+sum)打印时如果sum指向的时函数对象那么会将函数对象的字符串表现形式打印出来。就是该函数的代码定义格式。

打印的为什么不是函数的地址值：

因为该对象有自己的表现形式，即函数的具体实现。

17.JS函数-动态函数

动态函数使用的是js中内置的一个对象Function。

var add = new Function(“x,y”,”var sum; sum=x+y;return sum;”);

var he = add(4,8);

alert(“he=”+he);

function add2(){

 var sum;

 sum = x+y;

return sum;

}

那么这个函数和 add2有什么区别：

add2一定义完就固定了，而add()new了一个函数对象，里面都是字符串，但是如果里面的参数设置成变量，则内容全是未知的，可以动态改变。只是用的不是很多。参数列表和函数体都是通过字符串动态指定的。

18.JS函数-匿名函数

匿名函数：没有名字。通常是函数的简写形式。

调用：使用变量指向匿名函数对象，再调用即可。

19.JS函数-练习1

• 定义功能，完成对数组的最值获取
• 对数组进行排序
• 对数组进行查找
• 对数组元素进行反转

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>JS练习</title>

<script type="text/javascript">

//获取最大值：

 function getMar(arr){

    var maxIndex= 0;

    for (var i = 0; i < arr.length; i++) {

      if(arr[i]>arr[maxIndex]){

         maxIndex=i;

      }

    }

    return arr[maxIndex];

 }

 //排序：

  function sortArray(arr){

    for (var i = 0; i < arr.length-1; i++) {

      for (var j = i+1; j < arr.length; j++) {

         if(arr[i]>arr[j]){

            swap(arr,i,j);

         }

      }

   }

 }

 function swap(arr,i,j){

    var temp = arr[i];

    arr[i] = arr[j];

    arr[j] = temp;

 }

 //打印数组

 function println(val){

    document.write(val+"<br/>");

 }

 var arr = [34,12,56,34,78];

 var maxValue = getMar(arr);

 println("maxValue:"+maxValue);

 //函数对象被直接打印会变成字符串，数组对象直接打印会将数组元素用逗号隔开再进行打印

 println("排序前"+arr);

 sortArray(arr);

 println("排序后"+arr);

</script>

</head>

<body>

</body>

</html>

结果：

20.JS函数-练习2

• 对数组进行查找
• 对数组元素进行反转

//查找

 function searchArr(arr,val){

    for (var i = 0; i < arr.length; i++) {

       //如果当前索引上的值与要查找的值相等则返回该值，否则返回-1

      if(arr[i]=val){

         return arr[i];

      }

   }

      return -1;

 }

println("查找："+searchArr(arr,56));

结果：

 

折半查找：

//折半查找。前提：数组必须是有序数组。最大值、中值、最小值

 function binarySearch(arr,val){

     var min,mid,max;

    max=arr.length-1;

    min=0;

    //最小值一点要小于最大值

   while(min<=max){

      mid = (min+max)>>1;

      //(最小值+最大值)/2>mid则表示该值比mid大min+1，max-1

      if(val>arr[mid]){

         min=mid+1;

      }else if(val<[mid]){

         max=mid-1;

      }else{

         return arr[mid];

      }

   }

      return -1;

 }

var arr = [7,12,23,34,78];

//折半查询：

 println("折半查找："+binarySearch(arr,34));

结果：

//反转

//反转

 function reverseArr(arr){

    for (var start = 0,end = arr.length-1; start < end; start++,end--) {

      swap(arr, start, end);

   }

 }

var arr = [34,12,56,34,78];

//数组反转：

 println("数组反转前："+arr);

 reverseArr(arr);

 println("数组反转后："+arr);

结果：

21.全局和局部变量

如上图，如果实在java中，x出了循环就会不能使用，但是在JS中是全局变量是有用的。

而下面的for里的x是对上面x的重新赋值而不是像java里一样重新定义。

如果想要改变x的全局属性。

如上，这种方式会报错，x的值未定义。

总结：在函数里定义的变量是局部变量，而直接在脚本里写的变量是全局变量（在脚本片段中定义的变量是全局变量，如for循环，函数外变量定义）。

为什么结果为3？show上的x是形式参数，函数里的x是局部变量，当函数执行完成时，局部变量也使用完。再打印x时打印的是全局变量的x。

22.常见对象-Object

JS底层全部都是Object，类似java的基类Object。

toString()：将对象变成字符串表现形式。Array/Boolean/Date/Error/Function。

 

<script type="text/javascript">

  function show(){

     alert("show run");

  }

  alert(show);

  alert(show.toString());

</script>

两句话打印的相同。调用toString方法和不调用的结果相同。

 

valueof()：返回指定的原始值。和toString()方法差不太多。

Object使用时obj = new Object(value);

23.常见对象-String-基本功能

String对象可用处理和格式化文本字符串以及确定和定位字符串的子字符串。

表现形式有两种：

• var arr = new String(“abc”);
• var arr = “abc”;

out.js:

/**

 * 换行打印

 * @param param

 */

function println(param){

   document.write(param+"<br/>");

}

/**

 * 不换行打印

 * @param param

 */

function print(param){

   document.write(param);

}

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

<script type="text/javascript">

  var arr = "abcde";

  print("arr length:"+arr.length)

</script>

结果：

方法：

• bold方法在字符串两边加上<b>标签
• fontcolor方法字符串两边加上<font color="XX"></font>标签
• link方法字符串上加上超链接标签
• substr(start [,length]) 方法长度可选。
• substring(start,end) 方法包头不包尾

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>JS String对象</title>

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

<script type="text/javascript">

  var str = "abcdefg";

  println("str length:"+str.length);

  //bold在字符串两边加上<b>标签

  println("str bold:"+str.bold());

  //fontcolor字符串两边加上<font color="XX"></font>标签

  println("str fontcolor:"+str.fontcolor("red"));

  //link字符串上加上超链接标签

  println("str link:"+str.link("http://www.163.com"));

  //substr(start [,length])长度可选。

  println("str substr:"+str.substr(2,4));//cde

  //substring(start,end)包头不包尾

  println("str substring:"+str.substring(2,4));

</script>

</head>

<body>

</body>

</html>

结果：

24.常见对象-String-自定义功能

发现JS中的String对象方法有限，想要对字符串操作其他功能，比如去除字符串两端空格，就需要自己定义。

取出字符串两端空格的方法，通过指针截取子串头和尾（头必须小于为的索引）：

思路：定义两个变量，一个记录开始的位置，一个记录结束的位置，对开始的位置的字符进行判断，如果是空格就进行递增，直到不是空格为止；对于结束位置的字符也进行判断，如果是空格就进行递减，直到不是空格为止，必须保证开始位置<=结束位置。

//去除字符串两端的空格

  /* 定义两个变量，一个记录开始的位置，一个记录结束的位置;

  对开始的位置的字符进行判断，如果是空格就进行递增，直到不是空格为止;

  对于结束位置的字符也进行判断，如果是空格就进行递减，直到不是空格为止;

  必须保证开始位置<=结束位置。 */

  function trim(str){

     var start = 0;

     var end = str.length-1;

     while(start<=end && str.charAt(start)==" "){

        start++;

     }

     while(start<=end && str.charAt(end)==" "){

        end--;

     }

     return str.substring(start,end);

  }

  var str = "     sdf     ";

  alert("trim前的字符串：-"+str+"-");

  alert("trim后的字符串：-"+trim(str)+"-");

结果：

 

 

25.常见对象-String-原型属性prototype

自定义功能出现的问题：

已存在的方法，使用”abc”.bold()即可实现字体加粗；其实其使用的是<b>this</b>

既然trim方法时用来操作字符串的方法，可不可以像字符串已有方法一样，把我们自定义的方法定义到字符串对象中？

prototype属性：返回对象类型原型的引用。用法：对象名. prototype。

原型是什么？String类继承了原型类中的所有功能。

如上图，如果在原型中加了某些功能，那么String类也具有了该功能。可以给一个已有对象进行对象的扩展。

总结：想要把自定义的方法定义到字符串对象中，就可以使用一个字符串的原型属性来完成。原型即该对象的一个描述。该描述中如果添加了新功能，那么该对象都会具备这些新功能。可prototype就可以获取到这个原型对象。通过prototype就可以对对象的功能进行扩展。

需求：想要给String对象添加一个可以去除字符串两端空格的新功能。就可以使用原型属性来完成。给string的原型中添加一个功能。注意：给对象添加新功能直接使用“对象.新内容”即可。

//给String的原型对象中添加一个属性，名为len，值为199

  String.prototype.len = 199;

  println("haha len:"+"haha".len);

结果：

 

能添加属性，那么也能添加方法（行为）：

方式一：

function trim(str){

     var start = 0;

     var end = str.length-1;

     while(start<=end && str.charAt(start)==" "){

        start++;

     }

     while(start<=end && str.charAt(end)==" "){

        end--;

     }

     return str.substring(start,end);

}

String.prototype.trim = trim;

alert("prototype trim before:"+str);

  alert("prototype trim after:"+str.trim());

结果：

 

方式二：

String.prototype.mytrim= function(){

     var start = 0;

     var end = this.length-1;

     while(start<=end && this.charAt(start)==" "){

        start++;

     }

     while(start<=end && this.charAt(end)==" "){

        end--;

     }

     return this.substring(start,end);

  }

alert("prototype mytrim before:"+str);

alert("prototype mytrim after:"+str.mytrim());

结果：

将原型添加方法整理成一个js文件prototype.js再导入该js，使用时直接调用该方法即可：

/**

 * 在原型中添加新的功能prototype

 */

String.prototype.mytrim = function(){

     var start = 0;

     var end = this.length-1;

     while(start<=end && this.charAt(start)==" "){

        start++;

     }

     while(start<=end && this.charAt(end)==" "){

        end--;

     }

     return this.substring(start,end);

} 

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

alert("prototype mytrim before:"+str);

alert("prototype mytrim after:"+str.mytrim());

26.原型练习

练习1：给字符串添加一个新功能，将字符串变成一个字符数组

prototype.js:

/**

 * 字符串新功能：将一个字符串转成字符数组。返回一个数组

 */

String.prototype.toCharArray = function(){

   //定义一个数组

   var arr = [];

   //将每个字符取出来，然后放进数组里

   for (var x = 0; x < this.length; x++) {

      arr[x] = this.charAt(x);

   }

   return arr;

}

练习2：给字符串添加一个新功能，将字符串进行反转

/**

 * 字符串新功能：将一个字符串进行反转

 */

String.prototype.reverse = function(){

   var arr = this.toCharArray();

   //函数里定义函数是可以的，叫做函数的封装体。将数组位置置换功能进行封装，并定义到了反转功能内部

   function swap(arr,a,b){

      var temp = arr[a];

      arr[a] = arr[b];

      arr[b] = temp;

   }

   for (var x = 0,y = arr.length-1; x < y; x++,y--) {

      swap(arr,x,y);

   }

   //将数组转成字符串(数组本身是用逗号隔开的)

   return arr.join("");

}

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>prototype test</title>

</head>

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

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

<script type="text/javascript">

   var str = "abcdefg";

   println("str转成数组后："+str.toCharArray());

   println("str反转后："+str.reverse());

</script>

<body>

</body>

</html>

结果：

27.常见对象-Array-基本功能

• concat()方法：返回一个新数组，这个数组是有两个或多个数组组合而成。

var arr = ["aa","bb","cc","dd","ee"];

var arr2 = ["ff","gg","hh","ii","jj"];

println("arr:"+arr);

println("arr2:"+arr2);

//在arr数组上连接一个元素“mm”，再连接一个arr2数据

var newArr = arr.concat("mm",arr2);//将mm和arr2都作为新数组的元素

println("newArr:"+newArr);

结果：

• join()方法：返回字符串值，包含了连接到一起的数组的所有元素，元素由指定的分隔符隔开。默认使用逗号隔开。

println("newArr join:"+newArr.join("/"));

结果：

• pop():移除数组中的最后一个元素，并返回该元素

//移除数组中的最后一个元素，并返回该元素

println("--------------------");

println("原数组newArr:"+newArr);

println("pop处理的元素newArr pop:"+newArr.pop());

println("移除后的newArr:"+newArr);

结果：

。

• push():将新元素添加到数组中，并返回数组的新长度值。

push方法将以新元素出现的顺序添加这些元素，如果参数之一为数组，那么该数组将作为单个元素（成了多维数组）添加到该数组中。即，push如果添加的是数组的话，是以数组作为一个元素的方式添加进来；而concat是将所有元素添加进来。

//push

println("--------------------");

var arr3 = ["ll","mm","nn"];

println("原数组newArr:"+newArr);

println("push处理的元素newArr："+newArr.push("sdf"));

println("push添加的元素为数组时："+newArr.push(arr3));

println("push后的newArr:"+newArr);

结果：

• reverse()：反转
• shift()：移除数组中的第一个元素，并返回该元素

//shift移除数组中的第一个元素，并返回该元素

println("--------------------");

println("原数组newArr:"+newArr);

println("shift处理newArr:"+newArr.shift());

println("shift处理后的newArr:"+newArr);

结果：

• unshift将指定元素插入开始位置，并返回该数组

//unshift将指定元素插入开始位置，并返回该数组

println("--------------------");

println("原数组newArr:"+newArr);

println("unshift处理newArr:"+newArr.unshift("22"));

println("unshift处理后的newArr:"+newArr);

结果：

pop移除最后一个，unshift在开始位置添加，两者结合使用就可以实现堆栈或队列的数据结构。

• slice(start,[end])：返回一个数组的一段。end可选，包头不包尾，如果start为负，则将它作为length+start处理，如果end为负，将它作为length+end处理，如果end在start前，不复制任何元素到新数组。
• sort()：排序。返回一个已经进行排序的Array对象。

//sort

println("--------------------");

println("原数组newArr:"+newArr);

newArr.sort();

println("sort处理后的newArr:"+newArr);

 

• splice(start,deleteCount,[item1,item2….])：从一个数组中移除一个或多个元素，如有必要，在所移除元素的位置上插入新元素，返回所移除的元素。start表示移除元素开始位置，deleteCount表示移除元素个数，[item1,item2….]为必选项，表示增加的新元素。相当于元素的替换

//splice

println("--------------------");

println("原数组newArr:"+newArr);

var temp = newArr.splice(1,3,"11","33","78")

println("splice处理后的newArr:"+newArr);

结果：

28.常见对象-Array-练习-堆栈和队列结构

需求：用数组实现JS中的堆栈或者队列数据结构

pop移除最后一个，unshift在开始位置添加，两者结合使用就可以实现堆栈或队列的数据结构。

var arr = [];

   //一次添加是以当前顺序进行添加

   /* arr.unshift("aa","bb","cc");

   println(arr); *///aa,bb,cc

   //多次添加，先添加的在后面

    arr.unshift("aa");

    arr.unshift("bb");

    arr.unshift("cc");

println(arr); //cc,bb,aa

arr.unshift("aa");

    arr.unshift("bb");

    arr.unshift("cc");

    println(arr); //cc,bb,aa

    println(arr.pop());

    println(arr.pop());

    println(arr.pop());

结果：先进先出，队列

 

arr.unshift("aa");

    arr.unshift("bb");

    arr.unshift("cc");

    println(arr); //cc,bb,aa

    println(arr.shift());

    println(arr.shift());

println(arr.shift());

结果：先进后出堆栈

 

29.常见对象-Array-练习-自定义功能

Array对象的功能也是有限的。如何给数组对象Array添加新功能？

使用原型prototype属性实现。

需求：给数组对象添加新功能并使用到原型属性。求数组的最大值。

var array = ["asfaa","yubb","crtc","asdd","ege"];

    var maxVal = array.getMax();

    println("getMax:"+maxVal);

println("array toString:"+array.toString());

/**

 * 数组新功能：数组获取最大值方法

 */

Array.prototype.getMax = function(){

   var temp = 0;

   for (var x = 1; x < this.length; x++) {

      if(this[x]>this[temp]){

         temp = x;

      }

   }

   return this[temp];

}

/**

 * 数组新功能：数组的字符串表现形式.

 * 定义toString方法：相当于java中的复写（本身的toString方法时以逗号隔开）

 */

Array.prototype.toString = function(){

   return "["+this.join(", ")+"]";

}

结果：

30.常见对象-Date-基本方法

 

month：月份范围在0-11，表示的是1-12月份。

一般时间的现实要和服务器时间一致，所以一般时间是从服务端获取，不会使用前端获取的时间。

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>JS Date对象</title>

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

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

<script type="text/javascript">

   var date = new Date();

   println(date);//Tue Nov 6 17:16:15 UTC+0800 2018

   println(date.toLocaleDateString());//与本地系统语言有关。日期：2018年11月6日

   println(date.toLocaleString());//日期和时间：2018年11月6日 17:16:54

    //年月日分开获取

    var year = date.getFullYear();//getYear()已过时

    var month = date.getMonth()+1;//JS中的月份从0-11，表示1-12月

    var week = getWeek(date.getDay());//getDay()获取星期中的某一天

    var day = date.getDate();//getDate()获取月中的某一天；

    println(year+"/"+month+"/"+day+" "+week);

    //获取星期

   function getWeek(num){

       var weeks = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];

        return weeks[num];

    }

</script>

</head>

<body>

</body>

</html>

结果：

需求：获取一段时间运行的时间差。需要将时间换算成可以计算的时间数即毫秒值。

日期对象和毫秒值之间的转换：getTime()、setTime()

var date2 = new Date();

    var time = date2.getTime();//距离1970年的毫秒值时间差

    println("time:"+time);

    //将毫秒值转成时间对象：new Date(time)

    var date3 = new Date(time);

    println("date3毫秒值转成时间对象:"+date3);

    //将日期对象和字符串之间进行转换

    //parse()解析一个包含日期的字符串，并返回与日期1970年1月1日之间的毫秒数

    //将日期对象转为字符串toLocaleDateString、toLocaleString

    //将字符串转成日期对象。具备指定格式的日期字符串--》毫秒值--》日起对象

    var str_date = "9/28/17";//如果不是19XX年只要，写成四位年份即可

    var str_date1 = "9/28/2017";

    var time2 = Date.parse(str_date);

    var time3 = Date.parse(str_date1);

    var date4 = new Date(time2);

    var date5 = new Date(time3);

    println("date4字符串转成日期对象:"+date4);

println("date5字符串转成日期对象:"+date5);

结果：

31.JS中特有语句-with

对象调用方法、属性都要使用：对象.方法名。但是这样会有点麻烦，怎么处理？

为了简化对象调用内容的书写，可以使用JS中特有语句with来完成。

格式：with(对象){

         在该区域中可以直接使用指定的对象的内容，不需要写对象。

}

var year = date.getFullYear();//getYear()已过时

    var month = date.getMonth()+1;//JS中的月份从0-11，表示1-12月

    var week = getWeek(date.getDay());//getDay()获取星期中的某一天

    var day = date.getDate();//getDate()获取月中的某一天；

println(year+"/"+month+"/"+day+" "+week);

可以更改成：

with(date){

       var year = getFullYear();//getYear()已过时

        var month = getMonth()+1;//JS中的月份从0-11，表示1-12月

        var week = getWeek(getDay());//getDay()获取星期中的某一天

        var day = getDate();//getDate()获取月中的某一天；

    }

println(year+"---"+month+"---"+day+" "+week);

结果：

32.常见对象-Math-基本功能

该对象中的方法都是静态的，不需要new，直接Math调用即可。

• ceil():返回大于等于指定参数的最小整数
• floor():返回小于等于指定参数的最大整数
• round():四舍五入
• pow():次方

var num1 = Math.ceil(12.34);//13 返回大于等于指定参数的最小整数

  var num2 = Math.floor(12.34);//12 返回小于等于指定参数的最大整数

  var num3 = Math.round(12.34);//四舍五入

  var num4 = Math.pow(10,2);

  println("num1:"+num1);

  println("num2:"+num2);

  println("num3:"+num3);

println("num4:"+num4);

结果：

伪随机数：Math.random()

for (var x = 0; x < 10; x++) {

   var num = Math.random()*10+1;

   println("随机数num:"+num);

  }

结果：

10以内的整数随机数。使用小于这个随机数的最大整数即可；或者大于这个随机数的最小整数；使用全局方法parseInt()也可以：

for (var x = 0; x < 10; x++) {

   //var num = Math.floor(Math.random()*10+1);

   //var num = Math.ceil(Math.random()*10+1);

   var num = parseInt(Math.random()*10+1);

   println("随机数num:"+num);

}

结果：

全局方法，存在在Global对象中，JS一启动，这些方法就已经存在：

33.全局方法&Number对象

全局方法可以直接使用。

• parseInt():
• 非法值：NaN
• 可以通过isNaN()判断该值是否非法

如果数字在前，字符在后面，会将前面的数字进行转换，后面的字符进行舍弃；而如果字符在前，数字在后，会直接报非法。

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Global全局对象</title>

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

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

<script type="text/javascript">

  println(parseInt("123")+1);

  var val = parseInt("abc");

  println("val:"+val);//非法值

  //如果数字在前，字符在后面，会将前面的数字进行转换，后面的字符进行舍弃（所以转换之前要使用正则判断是否全部都是数字，是再转换）；而如果字符在前，数字在后，会直接报非法。

  println("数字在前，字符在后面："+parseInt("12abc"));

  println("字符在前，数字在后："+parseInt("abc23"));

</script>

</head>

<body>

</body>

</html>

结果：

Number对象：parseInt可以进行进制间的转化。

//将指定进制的字符串转成十进制

  var num  = parseInt("110",2);

  println("num 二进制转成十进制:"+num);

  var num  = parseInt("0x3c",16);

  println("num 十六进制转成十进制:"+num);

  //将十进制转成其他进制 使用Number对象

  var num3 = new Number(6);

  println("num3 十进制转成2进制:"+num3.toString(2));//将6转成2进制结果为110

  var num4 = 60;

println("num4 十进制转成16进制:"+num4.toString(16));//将60转成16进制结果为0x3c

结果：

Number对象和直接定义num值的区别：

Number对象代表数值数据类型和提供数值常数的对象。JS是基于对象，任何属性或方法底层都是对象。很少显示创建Number对象。

34.JS中特有语句-forin

格式：

for(变量in 对象){//用于对对象角标进行遍历的语句

}

//forin语句

  var arr = [23,32,45];

  for(i in arr){

     println("arr:"+arr[i]);

  }

  //遍历后，发现Number对象里没有什么东西，因此这些对象不能直接定义

  var numObj = new Number(4);

  for(x in numObj){

     println(x);

}

结果：

Number对象遍历不出任何东西

35.JS自定义对象

将一些功能封装在自定义的对象中，使用时使用自定义的对象即可。

如果想要自定义对象，应该先对对象进行描述。但是JS是基于对象不是面向对象，它不具备描述事物的能力。怎么做到按照面向对象的思想编写自定义对象？

就要先描述在JS中，可以用函数来模拟面向对象中的描述。

用JS来描述人：

第一种方式：

<script type="text/javascript">

//用JS来描述人

  function Person(){//想到与构造器。为什么大写？不大写也行，写什么都可以，只是为了用于区分

     println("Person run");

  }

  //通过描述进行对象的建立。new

  var p = new Person();

  //动态给p对象添加属性，直接使用p.属性名即可。

  p.name = "zhangsan";

  p.age = 29;

  //动态给p对象添加行为（方法）。若果定义的p对象的属性赋值为一个函数。即是给P对象添加一个方法

  p.show = function(){

     println("show run--"+this.name+":"+this.age);

  }

  p.show();

  //父类Object获取自定义的对象的属性

  var obj = new Object();

  obj.name = "god Object";

  obj.age = 30;

  println("obj:"+obj.name+":"+obj.age);

</script>

结果：

第二种方式：

function Person(name,age){

     //在Person对象上添加两个属性及其设置获取方式

     this.name = name;

     this.age = age;

     this.setName = function(name){

        this.name = name;

     }

     this.getName= function(){

        return this.name;

     }

  }

  var p = new Person("小芳",34);

  println("setName前："+p.name);//小芳

  p.setName("小明");

println("setName后："+p.getName());

结果：

第三种方式：直接使用{}大括号方式定义属性和值的键值对方式。键值对通过”:”连接，键与键之间用逗号隔开。

//第三种方式：通过键值对方式创建Person对象

  var pp = {

        "name":"小明",

        "age":23,

        "getName":function(){

           return this.name;

        }

  }

  println(pp.age+":"+pp.getName());

  println("通过元素的方式取值："+pp["age"]);

对象调用成员有两种方式：对象.属性；对象[“属性名”]。

println(pp.age+":"+pp.getName());

println("通过元素的方式取值："+pp["age"]);

 

forin遍历时，遍历自定义Person对象，遍历出来的都是对象的属性和方法：

for(x in pp){

     println(x);

}

结果：遍历出来的都是对象的属性和方法

如果要得到属性的值：

for(x in pp){

     println(x+":"+pp[x]);

}

结果：

使用键值对方式可以实现JS中的map集合：

//使用键值对方式可以实现JS中的map集合

  var map = {3:"小强",2:"旺财",9:"小明"}

  var val1 = map[3];

  println("val1:"+val1);

  function get(key){

     return map[key];

  }

  var val2 = get(2);

println("val2:"+val2);

结果：

 

对这种map集合是非有序编号的。

定义时名称需要规范，自定义的对象使用o开头，如oMap ;布尔型的使用b开头，如bMap

自定义的Person对象也具备原型prototype，也可以不断的往里面添加属性和方法。

//对于name="lisi" age=30这种我们需要对其进行封装，于是就封装成键值对的方式;为了方便使用就对其定义一个名字

  var myobj = {

     myname:"lisi",

     myage:30

  }

  println("myobj.myname:"+myobj.myname);

  var myobj = {

        "myname":"lisi",

        "myage":30

     }

     println("myobj.myname:"+myobj.myname);

以上两种定义键值对的方式都可以。

结果：

可以往键对应的值里放，函数，对象等等：

var myMap = {

     names:["lisi1","lisi2","lisi3"],nums:[34,13,65]

  }

  //获取值时使用角标获取

println("获取数组的值"+myMap.names[0])

结果：可以用于模拟java中的map集合。

36.JS自定义对象2

如果定义的键值对更加复杂：

var myMap = {

     names:["lisi1","lisi2","lisi3"],nums:[34,13,65]

  }

  //获取值时使用角标获取

  println("获取数组的值"+myMap.names[0])

  var myMap1 = {

     names:[{name1="lisi1"},{name2="lisi2"},"lisi3"],nums:[34,13,65]

  }

  //获取值时使用角标获取

  println("获取数组的值:"+myMap1.names[0].name1)