html、css、js入门-12-js基础3:JavaScript 内置对象1

本文深入讲解JavaScript中的对象概念,包括内置、自定义、浏览器及HTMLDOM对象,详细介绍了字符串、数组、数学、数字、正则表达式及日期对象的创建、属性与方法,通过实例演示了对象在实际应用中的强大功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >


什么是 JavaScript 对象


    .  JavaScript 是一种基于对象语言

    .  对象是 JavaScript中最重要的元素
 
    .  JavaScript 包含多种对象

             --  内置对象
             --  自定义对象
             --  浏览器对象
             --  HTML DOM对象
             --  ActiveX对象

 

 


使用对象

    .   对象由属性和方法封装而成
    .   属性的引用

        -- 使用点(.)运算符
        -- 通过下标的方式引用

 
    .  对象的方法的引用
        --  ObjectName.methods();

 

 

常用内置对象:

    .  简单数据对象
         -- String、Number、Boolean

    .  组合对象
         -- Array、Math、Date

    .  高级对象
         -- Function、RegExp

 

 


String  对象

  . 创建字符串对象

        var str1="hello world";
        var str2=new String("hello world");


  . String 对象的属性:length

        alert(str1.length);

 

 

 

大小写转换方法

     .  方法
            x.tolowerCase()
            x.toUpperCase()

    例如:
       
        var str1="AbcdEfgh";

        var str2=str1.toLowerCase();
        alert(str2);//结果为"abcdefgh"


        var str3=str1.toUpperCase();
        alert(str3);//结果为"ABCDEFGH"

 

 


获取指定字符

  . 方法

        x.charAt(index):返回字符
        x.charCodeAt(index):返回字符的Unicode编码


  .  使用注解

        index:字符位置


            var str1="JavaScript网页教程";
   
            var str2=str1.charAt(12);
            alert(str2);//结果为"教"

            var str3=str1.charCodeAt(12);
            alert(str3);//结果为25945

 

 

查询指定字符串


  .  方法

          x.indexOf(findstr,index)
          x.lastIndexOf(findstr)

   

  .  使用注解

          findstr:查找的字符串
          index: 开始查找的位置索引
          index 省略则代表从0开始找
          放回 findstr 在 x 中 出现的首字符位置索引
          如果没有找到,则返回 -1
          lastIndexof 代表从后面找起


     
       var str1="JavaScript网页教程";

       var str2=str1.indexOf("a");
       alert(str2);  //结果为1
 
       var str3=str1.lastIndexOf("a");
       alert(str3);  //结果为3

 

 

 

获取子字符串
      
  .  方法:   x.substring(start,end)

  .  使用注释

         start:开始位置
         end:结束位置加1


      
       var str1="abcdefgh";

       var str2=str1.substring(2,4);

       alert(str2);//结果为"cd"

 

 

 

替换子字符串

   .  方法: x.replace(findstr,tostr)

   .  使用注解

         findstr:要找的子字符串
         tostr: 替换为的字符串
         返回替换后的字符串

 
       var str1="abcde";

       var str2=str1.replace("cd","aaa");

       alert(str2);//结果为 "abaaae"         

 

 

拆分子字符串

     . 方法:  x.split(bystr)

     . 使用注解

            bystr:分割用的字符串
            返回分割后的字符串数组

 
       var str1="一,二,三,四,五,六,日";

       
       var strArray=str1.split(",");

       alert(strArray[1]);//结果为"二"

        

 

项目案例:

      字符查询与过滤

       1.查询录入字符串中的指定字符串的数量
       2.过滤录入字符串中的指定字符

 

 


String 对象与正则表达式

  . 方法

       x.replace(regexp)
       x.match(regexp)
       x.search(regexp)


  . 使用注解

       regexp  代表正则表达式或字符串
       replace 返回替换后的结果
       match   返回匹配字符串的数组
       search  返回匹配字符串的首字符位置索引

 


String 对象的正则表达式

      var str1="abc123def";

      var str2=str1.replace(/\d/gi,"*");
      alert(str2);//abc***def

      var array = str1.match(/\d/g);
      alert(array.toString());//1,2,3

      var index = str1.search(/\d/);
      alert(index);//3

 

 

字符查询与过滤(使用正则表达式)


1. 使用正则表达式查询录入字符串中的指定字符串的数量;

2. 使用正则表达式过滤录入字符串中的指定字符

 

 


Array 对象

   . 创建数组对象

     var cnweek = new Array(7);
     var books = new Array();

   . 初始化数组对象

     var test = new Array(100,"a",true);
     var test1=[100,200,300];

     var cnweek = new Array(7);
     cnweek[0]="星期日";

 
   . 获取数元素的个数:length 属性

 


创建二维数组


  .  通过指定数组中的元素为数组的方式可以创建二维甚至多维数组

 
      var cnweek=new Array(7);

      for(var i=0;i<=6;i++){
         cnweek[i]=new Array(2);
      }

      cnweek[0][0]="星期日";
      cnweek[0][1]="Sunday";
      cnweek[1][0]="星期一";
      cnweek[1][1]="Monday";
      ...
      cnweek[6][0]="星期六";
      cnweek[6][1]="Saturday";
      


    星期日    Sunday
    星期一    Monday
    星期二    Tuesday
    星期三    Wensday
    星期四    Thursday
    星期五    Friday
    星期六    Saturday

 

 


数组转换为字符串

    .  方法
          x.join(bystr)
          x.toString()


    .   使用注解

       -- 返回连接后的字符串
       -- bystr: 作为连接数组中元素的字符串
       -- x.toString():由逗号(,)连接
 

       var arr1=[1,2,3,4];
       alert(arr1.toString());//1,2,3,4
       alert(arr1.join("-"));//1-2-3-4

 

 

连接数组

   .  方法:  x.concat(value,...)

   .   使用注解

        --  Value 作为数组元素连接到数组的末尾
        --  返回连接后的数组
        --  concat 方法并不改变x自身的值

      var a=[1,2,3];
      var b=a.concat(4,5);
      alert(a.toString());//1,2,3
      alert(a.toString());//1,2,3,4,5

 

 

获取子数组

    .    方法:   x.silce(start,end)

    .    使用注解

            start:开始位置索引
            end: 结束位置加1,省略则相当于从start位置截取以后所有数组元素

      var arr1=['a','b','c','d','e','f','g','h'];
 
      var arr2=arr1.slice(2,4);

      alert(arr2.toString());//c,d

   
      var arr3 = arr1.slice(4);

      alert(arr3.toString());//e,f,g,h    

 


数组反转

    .   x.reverse()

              反向数组
              改变数组 x 中数值的顺序

        var arr1=[32,12,111,444];

        arr1.reverse();
        alert(arr1.toString());//444,111,12,32

 

 

 

数组排序

   x.sort(sortfunc):数组排序
 
        sortFunction:可选项,用来确定元素顺序的函数的名称


     function sortfunc(a,b){
       return a-b;

     }


      var arr1=[32,12,111,444];

      arr1.sort();
      alert(arr1.toString());//111,12,32,444

   
      arr1.sort(sortFunc);
      alert(arr1.toString());//12,32,111,444

 

 

项目案例:

    数组的倒转与排序

   1. 创建并初始化数组
   2. 倒转数组
   3. 按字符对数组排序
   4. 按数值对数组排序

 

 


Math 对象

 . Math 对象用于执行数学任务

      -- 没有构造函数 Math()

      -- 无需创建,直接把 Math 作为对象使用就可以调用其所有属性和方法

      -- 如:Math.PI 、 Math.round(3.56)

 

 

Math 对象的常用属性

   .  常用属性:都是数学常数

          Math.E(自然数)
          Math.PI(圆周率)
          Math.LN2(ln2)
          Math.LN10(ln10)等

 


Math 对象的常用方法

     .  三角函数
        Math.sin(x)、Math.acos(x)、Math.tan(x) 等

 
     .  反三角函数
        Math.asin(x)、Math.acos(x)等

     .  计算函数
        Math.sqrt(x)、Math.log(x)、Math.exp(x)等

 
     .  数值比较函数
        Math.abs(x)、Math.max(x,y,...)、
        Math.random()、Math.log(x)、Math.exp(x)等

 

     .  数值比较函数
        Math.abs(x) 、 Math.max(x,y,...)、
        Math.random()、Math.round(x)等;

 

Number 对象

     Number 对象时原始数值的包装对象
     创建  Number 对象
   
     var myNum= new Number(value);
     或者

     var myNum= Number(value);

 

Number 对象的常用方法

   toString : 数值转换为字符串
   toFixed: 数值转换为字符串,并保留小声点后一定位数

        -- 如果必要,该数字会被舍入,也可以用0补足

       var data = 23.56789;
       alert(data.toFixed(2));//23.57

       data =23.5;
       alert(data.taFixed(2));//23.50          

 


项目案例:

    资产折旧计算器
        1.计算资产折旧值
        2.计算结果保留小数点后两位

 

 

 

RegExp 对象概述

  .   RegExp 对象表示正则表达式,它是对字符串执行模式匹配的强大工具

  .   创建正则表达式对象

         var reExp=/pattern/flags;
 
         var reExp=new RegExp("pattern",["flags"]);


      例如:
        
         var reg1 = /^\d{3,6}$/;

         var reg2 = new RegExp("^\d{3,6}$");

 


RegExp 对象的常用方法

 
        RegExpObject.test(string)

       -- 如果字符串 string 中含有与RegExpObject 匹配的文本,则返回true,否则返回 false

        var name="aaaa";
        var reg = new RegExp("^[a-zA-Z0-9]{3,6}$");

        var isRight = reg.test(name);

        if(!isRight){
           alert("录入错误!");
        }

 


项目案例:


         输入验证

         验证文本框中的录入

 

 

Date 对象

    .  Date 对象用于处理日期和时间

    .  创建 Date对象

         var now = new Date();
         var mowd2 = new Date("2013/3/2011:12");


    


Date 对象的常用方法


    .  读取日期的相关信息

          getDate()、getDay()、getYear()等

    .  修改日期

          setDate()、setMonth()、setHours()等

    .  转换为字符串

          toString
          toLocaleTimeString()
          toLocaleDateString()

 


项目案例:

计算查询时段:计算订单的查询时段

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

慕容屠苏

你的鼓励是我最大的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值