• JavaScript基本语法(四)


    一、     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());//用于把字符串转换为大写。

     

     

  • 相关阅读:
    [Javascript] Broadcaster + Operator + Listener pattern -- 9. Create modify, filter, map operators
    [Javascript] Broadcaster + Operator + Listener pattern -- 8. Pass a Done Symbol when an Async Function is Done
    [Javascript] Broadcaster + Operator + Listener pattern -- 7. Create a broadcaster forOf
    [Javascript] Broadcaster + Operator + Listener pattern -- 6. Create a Buffer to Pair Values Together with Zip
    [Functional Programming] Match Function Requirements with Lodash Partial and Flip
    [Javascript] Broadcaster + Operator + Listener pattern -- 5. Merge (Example)
    [React] Performance: Split state update and component render with Hoc
    [React] Optimize context value
    [React] useAsync
    Nodejs.sublime-build 在sublime3中的配置
  • 原文地址:https://www.cnblogs.com/46ly/p/5848892.html
Copyright © 2020-2023  润新知