JavaScript基本语法(四)

时间:2021-09-12 19:53:23

一、     JavaScript 函数

1、函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。我们可以将一些常用的代码封装成函数,待用到的时候就能直接调用使用。利用函数可以使代码的组织结构更清晰。

函数语法:

函数就是包裹在花括号中的代码块,前面使用了关键词 function,function 后的是函数名,由用户自己定义。最好是能表达函数功能的词。

function functionname()
{
执行代码
}

:JavaScript 对大小写敏感。关键词 function 必须是小写的,并且必须以与函数名称相同的大小写来调用函数。当调用该函数时,会执行函数内的代码。可以在某事件发生时直接调用函数(比如当用户点击按钮时),并且可由 JavaScript 在任何位置进行调用。

2、带参数的函数:

在调用函数时,可以向其传递值,这些值被称为参数。这些参数可以在函数中使用。可以发送任意多的参数,由逗号 (,) 分隔:

myFunction(argument1,argument2)

当声明函数时,请把参数作为变量来声明:

function myFunction(var1,var2)
{
代码
}

变量和参数必须以一致的顺序出现。第一个变量就是第一个被传递的参数的给定的值,以此类推。例子如下:

function sum (a,b){  //声明函数

              var sum=a+b;

              alert(sum;)

           }

           sum(2,3);  //调用函数sum,2的值传进a,3的值传进b,输出结果为5

3、带返回值的函数

有时,我们会希望函数将值返回调用它的地方。

通过使用 return 语句就可以实现。

在使用 return 语句时,函数会停止执行,并返回指定的值。

语法

function myFunction()
{
var x=5;
return x;
}

上面的函数会返回值 5。

注: 整个 JavaScript 并不会停止执行,仅仅是函数。JavaScript 将继续执行代码,从调用函数的地方。

若仅仅希望退出函数时,也可以使用return语句,返回值是可选的。

语法

function myFunction()
{
var x=5;
return x;
}

上面的函数会返回值 5。

注意: 整个 JavaScript 并不会停止执行,仅仅是函数。JavaScript 将继续执行代码,从调用函数的地方。在JavaScript中,不一定要指定返回值。

二、变量的作用域

变量既可以是全局,也可以是局部的。

1、全局变量:可以在脚本中的任何位置被引用,一旦你在某个脚本里声明了全局变量,你就可以在这个脚本的任何位置(包括函数内部)引用它,全局变量的作用域是整个脚本;

在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。

2、局部变量:只存在于对它做出声明的函数内部,在函数的外部无法相用它,局部变量的作用域,仅限于函数内部;

在 JavaScript 函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它。(该变量的作用域是局部的)。

var global = "global";  //全局变量

function test(){  //函数

  var local="local"; //局部变量

  global2="global2"; //全局变量

}

注:在函数 外 用 var 声明的变量或者定义在函数当中,但是没有用var声明的是全局变量。定义在函数当中,用var声明的是局部变量

、   JavaScript 内部函数

在javascript中有一些功能是很常用的,它们以全局函数的形式提供给用户,这些函数称为内部函数。下面列出几个说明:

1、eval() 接受一个字符串类型的参数,将这个字符串作为代码在上下文环境中执行,并返回执行的结果;例子如下:

var i = 1;

  eval(“i = i + 1”);

  eval(“alert(i);”);

  执行结果为:弹出警告框,值为2.

2、parseInt 和 parseFloat 将字符串转换为数字

parseInt定义:

parseInt() 函数可解析一个字符串,并返回一个整数。

当参数 radix 的值为 0,或没有设置该参数时,parseInt() 会根据 string 来判断数字的基数。

当忽略参数 radix , JavaScript 默认数字的基数如下:

  • 如果 string 以 "0x" 开头,parseInt() 会把 string 的其余部分解析为十六进制的整数。
  • 如果 string 以 0 开头,那么 ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进制或十六进制的数字。
  • 如果 string 以 1 ~ 9 的数字开头,parseInt() 将把它解析为十进制的整数。

语法:

parseInt(string, radix);

参数

描述

string

必需。要被解析的字符串。

radix

可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。

注:

只有字符串中的第一个数字会被返回。

开头和结尾的空格是允许的。

如果字符串的第一个字符不能被转换为数字,那么 parseFloat() 会返回 NaN。

在字符串以"0"为开始时旧的浏览器默认使用八进制基数。ECMAScript 5,默认的是十进制的基数。

例:

document.write(parseInt("10") + "<br>");
document.write(parseInt("10.33") + "<br>");

document.write(parseInt("0x10")+ "<br>");

输出:

10
10

16

parseFloat定义:

parseFloat()函数可解析一个字符串,并返回一个浮点数。

该函数指定字符串中的首个字符是否是数字。如果是,则对字符串进行解析,直到到达数字的末端为止,然后以数字返回该数字,而不是作为字符串。

注:

字符串中只返回第一个数字。

开头和结尾的空格是允许的。

如果字符串的第一个字符不能被转换为数字,那么parseFloat() 会返回 NaN。

3、escape 和 unescape    进行URL编码和解码

例:

    var url = “http://www.baidu.com/s?name=小米”;

    url = escape(url);//编码

    alert(url);

    alert(unescape(url)); //解码

utf-8 编码:多国语言编码

GB2312/GBK:中文简体

四、    对象

JavaScript 中的所有事物都是对象:字符串(String)、数字(Number)、数组(Array)、日期(Date),等等。

在 JavaScript 中,对象是拥有属性和方法的数据。

1、日期对象Date。日期对象用于处理日期和时间。

可以通过 new 关键词来定义 Date 对象。

Date对象的方法:

myDate.getFullYear();    //获取完整的年份(4位,1970-????)

myDate.getMonth();       //获取当前月份(0-11,0代表1月)

myDate.getDate();        //获取当前日(1-31)

myDate.getDay();         //获取当前星期X(0-6,0代表星期天)

myDate.getTime();        //获取当前时间(从1970.1.1开始的毫秒数)

myDate.getHours();       //获取当前小时数(0-23)

myDate.getMinutes();     //获取当前分钟数(0-59)

myDate.getSeconds();     //获取当前秒数(0-59)

myDate.getMilliseconds();    //获取当前毫秒数(0-999)

myDate.toLocaleDateString();     //获取当前日期

var mytime=myDate.toLocaleTimeString();     //获取当前时间

myDate.toLocaleString();        //获取日期与时间  

如下例子:

var myDate=new Date();//创建一个Date对象myDate

var   year=myDate.getFullYear();//调用getFullYear()方法获取年份

var   month=myDate.getMonth();//获取获取当前月份(0-11,0代表1月)

var   day=myDate.getDate();//获取当前日(1-31)

var   hours=myDate.getHours();();  //获取当前小时数(0-23)

var   min=myDate.getMinutes();//获取当前分钟数(0-59)

var week=myDate.getDay(); //获取当前星期X(0-6,0代表星期天)

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

alert("现在是:"+year+"年"+month+"月"+day+"日"+hours+":"+min+weekday[week]);

2.Math 对象

Math 对象用来处理复杂的数学运算。

Math对象是javascript的一个全局对象,不需要用new 创建

Math.abs(-2);           该方法可返回一个数的绝对值。

Math.round(5.5);      该方法可把一个数字舍入为最接近的整数。

Math.random();      该方法可返回介于 0(包含) ~ 1(不包含) 之间的一个随机数。

Math.ceil(1.4);         ceil()   方法返回大于等于x的最小整数。(取大整)结果为2

Math.floor(1.6);       floor() 方法返回小于等于x的最大整数。(取小整)结果为1

Math.pow(4,3);        pow() 方法返回 x 的 y 次幂。  (4的3次方)

例:

var a = Math.abs(-2); 

documrent.write(a);

输出结果为:2

3.Array 数组对象

(1)、定义数组的 3种方式

   var week = new Array();

   var week = new Array(‘星期一’ , ‘星期二, ‘星期三’);

   var week = (‘星期一’ , ‘星期二, ‘星期三’);

常用方法:

获取数组的长度 .length:

        alert(week.length);  

获取数组下标所对应的值:

        alert(week[0]);

(2)、数组元素的添加:

A、push() 添加到数组结尾,返回数组新长度。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");

输出结果:Banana,Orange,Apple,Mango,Kiwi

B、unshift()添加到数组开始,数组中的元素自动后移,返回数组新长度。

例:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon","Pineapple");

输出结果:Lemon,Pineapple,Banana,Orange,Apple,Mango

C、splice()将一个或多个新元素插入到数组的指定位置,插入位置的元素自动后移,返回""。

语法:array.splice(index,howmany,item1,.....,itemX)

参数

描述

index

必需。规定从何处添加/删除元素。
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。

howmany

必需。规定应该删除多少元素。必须是数字,但可以是 "0"。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。

item1, ., itemX

可选。要添加到数组的新元素

例:

 var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi");

输出结果:

Banana,Orange,Lemon,Kiwi,Apple,Mango

(3)、数组元素的删除

var del = ["aa",23,345,56,34,"bb"];

var del_last = del.pop();        //移除最后一个元素并返回该元素值

var del_first = del.shift();      //移除最前一个元素并返回该元素值,数组中元素自动前移

var del_arr = del.splice(0,2); //删除从指定位置deletePos开始的指定数量deleteCount的元素,数组形式返回所移除的元素

document.write(del_arr);

(4)、srting对象

    String 对象用来处理文本。 

事实上任何一个字符串常量都是一个String对象,可以将其直接作为对象来使用。 

获得字符串长度: 

    1.length属性 

    var str = “hello”;

    var str2 = “你好”;

    alert(str.length);      //输出 5

    alert(str2.length);     //输出 2

提取字符串:

    1.charAt()方法 

    var str = "HELLO WORLD"; 

    var n = str.charAt(2); //返回指定位置的字符。 

    2.substr()方法

    var str = ‘hello’;

    alert(str.substr(0,2);//传入起始位数,截取的长度,返回的是’he’

    3. substring()方法

    alert(str.substring(0,3))//传入开始的位置,结束的位置 <3,返回的是’hel’

查找替换字符串:

    1. indexOf()和lastIndex()方法

    var str="Hello world, welcome to the universe.";

    alert(str.indexOf(“welcome”);//可返回某个指定的字符串值在字符串中首次出现的位置。

    alert(str.lastIndexOf(‘e’));  //查找字符最后一次出现的位置

    2. replace()方法

    var str="Visit Microsoft!"; 

    var n=str.replace("Microsoft","W3CSchool");//用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

    3. search()方法

    var str="Visit W3CSchool!";

 var n=str.search(“W3CSchool”);//查找指定的字符串或与正则表达式相匹配的子字符串 

拼接字符:

    1.concat

    var str1 = "Hello ";

    var str2 = "world!";

    var n = str1.concat(str2); //concat() 方法用于连接两个或多个字符串。

    2.字符串拼接符

       var str1 = str1 + str2; //+号判断左右两边,如果有一边是字符串,则该+号为拼接作用 

其他方法:

    1.toLowerCase() 方法

    var str="Hello World!”;

    document.write(str.toLowerCase());//用于把字符串转换为小写

    2.toUpperCase() 方法

    var str="Hello world!";

    document.write(str.toUpperCase());//用于把字符串转换为大写。