• JS 内置一些对象: Date 对象 JSON 对象 包装对象 RegExp 对象:正则表达式 全局对象 和 Error 对象


    内置对象

      内置对象就是指一个语言自带的一些对象,供开发者使用,这些对象提供了一些常用的或是最基本而必要的功能。

      JS标准内置对象一般我们认为有12个。其中可以通过 new 关键字进行实例化对象的有9个,我们叫做构造器对象:

        Object、Boolean、String、Number、Function、Array、RegExp、Date、Error;

      还有剩下的3个对象:Math、JSON、全局对象。

    一、Date 对象

      ECMAScript 中的 Date 对象是在早期 Java 中的 java.util.Date 类基础上构建的。为此,Date 对象使用自 UTC(Coordinated Universal Time,国际协调时间)1979 年 1 月 1 日午夜(零时)开始经过的毫秒数来保存日期。

      

      创建 Date 对象

        要创建一个日期对象,使用new 操作符调用Date构造函数即可。如下所示:

    let dt = new Date();

        在调用Date 构造函数时,如果不传递参数,新创建的对象会自动获得当前本地系统日期和时间。

        在调用Date 构造函数同时传递日期参数,新创建的对象会获得参数对应的日期和时间。

    new Date("January 12,2006 22:19:35");
    new Date("January 12,2006");
    new Date(2006,0,12,22,19,35);
    new Date(2006,0,12);
    new Date(1137075575000);
    // 2006-01-12T14:19:35.000Z

    注:上面的各种创建形式都表示 2006 年 1 月 12 日这一天。

      获取日期的方法

      通过以下方法,可以获取具体的日期和时间:

    方法 说明
    getFullYear() 返回 Date 对象“年份”部分的实际数值
    getMonth() 返回 Date 对象“月份”部分的数值(0 ~ 11)
    getDay() 返回 Date 对象“星期”部分的数值(0 ~ 6)
    getDate() 返回 Date 对象“日期”部分的数值(1 ~ 31)
    getHours() 返回 Date 对象“小时”部分的数值(0 ~ 23)
    getMinutes() 返回 Date 对象“分钟”部分的数值(0 ~ 59)
    getSeconds() 返回 Date 对象“秒”部分的数值(0 ~ 59)
    getMilliSeconds() 返回 Date 对象“毫秒”部分的数值(0 ~ 999)
    getTime() 返回 Date 对象与 UTC 时间 1970 年 1 月 1 日午夜之间相差的毫秒数
    toLocaleDateString() 返回 Date 对象的完整日期 格式为(2006/1/12)
    toLocaleTimeString() 返回 Date 对象的完整日期 格式为(下午2:55:24)
    toLocaleString() 返回 Date 对象的完整日期 格式为(2006/1/12 下午2:55:24)
    let dt = new Date();
    console.log(dt.getFullYear()); // 2019

    设置日期的方法

      通过以下方法,可以设置具体的日期和时间:

    方法 说明
    setFullYear() 设置 Date 对象中的年份(四位数字)
    setMonth() 设置 Date 对象中月份(0 ~ 11)
    setDate() 设置 Date 对象中月的某一天 (1 ~ 31)
    setHours() 设置 Date 对象中的小时 (0 ~ 23)
    setMinutes() 设置 Date 对象中的分钟 (0 ~ 59)
    setSeconds() 设置 Date 对象中的秒钟 (0 ~ 59)
    setMilliSeconds() 设置 Date 对象中的毫秒 (0 ~ 999)
    setTime() 以毫秒设置 Date 对象
    let dt = new Date();
    dt.setFullYear(2000);
    console.log(dt.getFullYear()); // 2000

    二、JSON 对象

      JSON(JavaScript Object Notation),是道格拉斯·克罗克福特(Douglas Crockford)于 2001 年发明 的一种轻量级数据存储格式。易于阅读和编写,同时也易于解析和生成。 JSON 作为 JavaScript 的一个子集,同时 ActionScript、C、C#、ColdFusion、E、Java、 JavaScript、ML、ObjectiveCAML、Perl、PHP、Python、Rebol、Ruby、Lua 等一系列的语言都对 JSON 提供支持。JSON 在后来成为了一个完全独立于语言的文本格式,也成为数据交换的理想格式。

      XML

        在 JSON 出现之前,一般使用 XML 来传递数据。因为 XML 是一种纯文本格式,所以它适合在网络 上进行数据交换。

    <name>ZhangSan</name>
    <age>20</age>
    <gender>male</gender>

      XML 本身不算太复杂,但是,后来加上了 DTD、XSD、XPath、XSLT 等一大堆复杂的规范以后,使用起来就没那么友好,慢慢“没落”。

      JSON 语法

      JSON 作为 JavaScript 的一个子集,它所支持的数据类型也与 JavaScript 中数据类型基本一致:

        number:和 JavaScript 的 number 完全一致;

        boolean:和 JavaScript 的 boolean 完全一致;

        string:和 JavaScript 的 string 类似;

        null:和 JavaScript 的 null 完全一致;

        array:和 JavaScript 的数组表示方式 [] 完全一致;

        object:和 JavaScript 的对象表示方式 {} 类似;

      为了保证各种语言的统一解析,JSON 规定字符串必须用双引号  " ",对象的键也必须用双引号 " "。

    [
         {
             "name": "ZhangSan",
             "age": 20,
             "friends": ["HanMeiMei", "LiZiMing"],
             "isMarried": false,
             "spouse": null
         },
         {
             "name": "HanMeiMei",
             "age": 30,
             "friends": ["ZhangSan"],
             "isMarried": true,
             "spouse": "LiZiMing"
         }
    ]                

      

      JSON 与 JavaScript 对象

      JSON 中的 [] 与 JavaScript 中的数组对象、JSON 中的 {} 与 JavaScript 中的 JSON 式对象,他们并不是同一个东西。

      JSON 是 JavaScript 中对象的字符串表示方式,本质上是 string,而JavaScript 中的数组和 JSON 式对 象,本质上是 object。

      JSON 与 JavaScript 对象互相转换

        JSON 作为一种数据存储格式变得日益流行。从 ES5 开始,就开始出现全局的 JSON 对象,该对象提 供了两种方法,可以将 JSON 字符串和 JavaScript 对象进行相互转换。

          stringify()  JSON 对象的 stringify() 方法用于将 JavaScript 对象转换为 JSON 字符串

    let data = [{ name: 'HanMeiMei', age: 20 }];
    let JSONData = JSON.stringify(data);

          parse()  JSON 对象的 parse() ⽅法⽤于将 JSON 字符串转换为 JavaScript 对象

    let JSONData = '[{ "name": "HanMeiMei", "age": 20 }]';
    let data = JSON.parse(JSONData);

    Math 对象

      JavaScript 中提供了一个 Math 对象,用来使用一些数学公式和获取数学中的常用值。

      与直接编写的计算功能相比,Math 对象提供的计算功能执行起来要快得多。

      Math 对象的属性

        PI     返回圆周率(约等于3.14159)

      Math 对象的方法

    方法 说明
    abs(x) 返回数的绝对值
    ceil(x) 对数进行上舍入
    floor(x) 对数进行下舍入
    round(x) 对数进行四舍五入
    max(x,y...) 返回 x,y... 中的最高值
    min(x,y... 返回 x,y...中的最低值
    pow(x,y) 返回 x 的 y 次幂
    random() 返回 0 ~ 1 之间的随机数(0<=x<1)
    //随机数
    let num = Math.random(); // 0 <= num < 1
    let max = 100;
    // 0 <= num < max
    num = Math.random() * max;
    // 0 <= num <= max 整数
    num = Math.round(Math.random() * max);
    num = parseInt(Math.random() * (max + 1)); // 效率更⾼
    let min = 50;
    // min <= num <= max 整数
    num = Math.round(Math.random() * (max - min)) + min;

    实例:

      创建一个函数,接收两个参数,生成一个取值范围在两个参数之间的随机整数。

    function random(min, max) {
     if (!max) {
     return parseInt(Math.random() * (min + 1));
     }
     return parseInt(Math.random() * (max - min + 1)) + min;
    }

    基本类型包装对象

      对象是 JavaScript 语言最主要的数据类型,三种原始类型的值:数值、字符串、布尔值,在一定条件 下,也会自动转为对象,也就是原始类型的“包装对象”(wrapper)。

      所谓“包装对象”,是指与数值、字符串、布尔值分别相对应的 Number、String、Boolean 三个内置对象。

      这三个内置对象可以把原始类型的值转换成(包装成)对象;包装后的对象也能转换成 (解包装成)原始类型的值;这个过程在一定条件下可以自发的完成,

      这两个过程分别称为“自动装箱”和“自动拆箱”, 包装对象的设计目的:

        首先是使得“对象”这种类型可以覆盖 JavaScript 所有的值,整门语言有一个通用的数据模型,

        其次是使得原始类型的值也有办法使用自己的属性和方法。

      在 JavaScript 中,曾有一种说法叫做“一切皆对象”,包装对象就有点这个意思,想要让一切都用对象来表示。

    let str1 = "abc";// 基本数据类型
    let str2 = new String("abc");// 基本数据对应的包装对象
    console.log(typeof str1);// 打印结果:string
    console.log(typeof str2);// 打印结果:object
    console.log(str1+"def");// 打印结果:abcdef
    console.log(str2+"def");// 打印结果:abcdef (自动拆箱,参与基本数据类型运算)
    console.log(str1.length);// 打印结果:3 (自动装箱,使用包装对象的属性)

      valueOf() 和 toString()

      两种包装对象的方法:valueOf() 和 toString()。

        valueOf() 方法返回包装对象实例对应的原始类型的值:

    new Number(111).valueOf() // 结果:111
    new String('abc').valueOf() // 结果:"abc"
    new Boolean(false).valueOf() // 结果:false

        toString() 方法返回对应的字符串形式:

    new Number(111).toString() // 结果:"111"
    new String('abc').toString() // 结果:"abc"
    new Boolean(false).toString() // 结果:"false"

      String 对象

        定义字符串,除了最常用的通过引号定义一个字符串之外,还可以通过构造函数 String 来定义字符串。

        

    let str1 = 'hello';
    let str2 = new String('string');
    console.log( typeof str1 ); // string
    console.log( typeof str2 ); // object

    注:这两种方式创建出来的字符串除了数据类型不一样之外,由于自动装拆箱的机制,除了一些特别的情况 (比如全等),其它时候在使用上是完全一样的。

        字符串的属性  length:返回字符串的长度。

        

    let str = 'hello string';
    console.log( str.length );

    注意:只能获取,不能设置。

        字符串的方法

            查找字符:

          charAt(index)      返回在指定位置index(从 0 开始)的字符

          charCodeAt(index)     返回在指定位置index(从 0 开始)的字符的ascii编码

        

            查找位置:

          indexOf(str)        从左往右查找元素,返回匹配的第一个字符str的下标。没有返回-1

          lastIndexOf(str)       从右往左查找元素,返回匹配的第一个字符str的下标。没有返回-1

            字符串转数组:

          split(str)         把一个字符串按指定符号str分割成字符串数组

            去掉空格:

          trim()          去除字符串两边的空白

          注:也有去除某一边的。

            连接两个字符串:

          concat(str)        方法用于当前字符串和另一个字符串str,得到新字符串

        

            提取字符串:

          slice(start,end)        截取start到end(不包括)的字符串

          substr(start,length)     截取start开始的length⻓度的字符串

          subString(start,end)      截取start到end(不包括)的字符串、

            大小写转换:

          toLowerCase()      把字符串转换为小写

          toUpperCase()      把字符串转换为大写

    let str = " Abc&Def&Ghi&Jkl ".trim().toLowerCase().split("&").join("");
    console.log(str);// 打印结果:"abcdefghijkl"

    Number 对象

      定义数字,同 String。

    let n1 = 111;
    let n2 = new Number('111');
    console.log( typeof n1 ); // number
    console.log( typeof n2 ); // object

      

      数字的方法

      我们可以直接通过自动装箱来使用基本数据类型对应包装对象的属性和方法,如 "123".length ,但是数字类型由于“.”可以解析成小数点,

      所以在使用时为了避免歧义要使用两个点或者用“()”括起来, 如:9..toString() 或 (9).toString()。

        toFixed(num)       该数转为指定位数的小数,然后返回这个小数对应的字符串。参数num(0- 20)为小数位数

        toPrecision(num)      返回该数转为指定位数的有效数字,参数num(0-21)为有效数字的位数

        toExponential(num)     返回该数转为科学计数法形式,保留num(0-20)位小数 

        数字的方法,用的太少了。

    Boolean 对象

      定义布尔值,同 String。

      

    let n1 = true;
    let n2 = new Boolean(true);
    console.log( typeof n1 ); // boolean
    console.log( typeof n2 ); // object

    RegExp 对象

      RegExp 对象,即正则表达式(regular expression),描述了一种字符串匹配的模式/规则 (pattern)。可以用来实现验证、搜索、替换等对字符串的操作。

      正则的声明

        声明一个正则对象有两种方式:

          字面量

    let re = /pattern/modifiers;

          构造函数

    let re = new RegExp( pattern, modifiers );

      参数说明:

        pattern:模式。描述了一个表达式模式(规则)。

        modifiers:修饰符。描述了检索时是否全局检索、是否区分大小写等。

    let re = /a/; // 表示这个 re 的正则的规则就是“包含a”

      正则对象的方法

    方法 说明 返回值
    test() 在字符串中搜索指定的值 布尔值
    exec() 在字符串中搜索指定的值 对象,包含搜索值、搜索值位置、源字符串
    let re = /to/;
    let str = 'nice to meet you ~';
    console.log(re.test(str));
    // true
    console.log(re.exec(str));
    // [ 'to', index: 5, input: 'nice to meet you ~' ]

       常用规则

          字符组,用于匹配某一组字符中的任意一个字符。

    表达式 说明
    [] 匹配⽅括号中的任意一个字符
    [^] 匹配不在方括号中的任意一个字符
    [0-9] 匹配 0 ~ 9 之间的任意一个数字
    [a-z] 匹配 a ~ z 之间的任意一个小写字母
    [A-Z] 匹配 A ~ Z 之间的任意一个大写字母
    let re = /[abc]/;
    let str = 'nice to meet you';
    re.test(str); // true

            简记:

    表达式 说明
    w 匹配任意数字、字母、下划线字符。等同于 [0-9a-zA-Z_]
    W 匹配任意非数字、字母、下划线字符。等同于 [^0-9a-zA-Z_]
    d 匹配任意数字字符。等同于 [0-9]
    D 匹配任意非数字字符。等同于 [^0-9]
    s 匹配空白字符
    S 匹配任意非空白字符
    . 匹配除回车( ),换行( ),行分隔符(u2028)和段分隔符(u2029)以外的任意字符

    注:妥善的利用互补属性,可以得到一些巧妙的效果。如:[sS]、[wW]、[dD] 都可以表示任意字符。

            量词:用来匹配目标字符的出现个数。

    表达式 说明
    n{x} 匹配 x 个 n
    n{x,y} 匹配 x 到 y 个 n
    n{x,} 匹配 x 到多个 n
    n? 匹配 0 个到 1 个 n,等同于 n{0,1}
    n+ 匹配 1 个到多个 n,等同于 n{1,}
    n* 匹配 0 个到多个 n,等同于 n{0,
    // 匹配美式 color 和 英式 colour
    let re = /colou?r/;
    console.log(re.test('color')); // true
    console.log(re.test('colour')); // true

              特殊字符

    表达式 说明
    | 表示“或
    转义符
    () 对规则进行分组
    ^n 匹配任何以 n 开头的字符
    n$ 匹配任何以 n 结尾的字符

              修饰符

    表达式 说明
    i 匹配时不区分大小写
    g 全局匹配,即不会匹配到一个就停止
    m 多行匹配,即不会只匹配一行字符(需结合 ^ 或 $ 一起使用),其中多行表示通过" "换 行
    let re = /^b./m;
    let str = "aaaaa
    baaaaa
    aaaaa";
    console.log(re.test(str));

      支持正则的 String 对象的方法

    方法 描述
    search() 用于搜索字符串中指定的子字符串,或是与正则表达式相匹配的子字符串。
    match() 用于搜索字符串中指定的子字符串,或是与正则表达式相匹配的子字符串。
    replace() 用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
    split() 用于在字符串中通过指定字符分割字符串成数组,或通过指定正则表达式匹配的子串来分割。
    let str = 'Mr Blue has a blue house and a blue car';
    console.log(str.search('blue'));// 打印结果:14
    console.log(str.search(/blue/gi));// 打印结果:3
    console.log(str.match('blue'));// 打印结果:["blue", index: 14, input: "Mr Blue has a blue house and a blue car", groups: undefined]
    console.log(str.match(/blue/gi));// 打印结果:["Blue", "blue", "blue"]
    console.log(str.replace('blue', 'red'));// 打印结果:"Mr Blue has a red house and a blue car"
    console.log(str.replace(/blue/gi, 'red'));// 打印结果:"Mr red has a red house and a red car"
    
    str ="1k2h3h123v123hv123";
    str.replace(/d/,"");//打印结果 "k2h3h123v123hv123"
    str.replace(/d/g,"");//打印结果 "khhvhv"
    
    str.split(/d/);//打印结果 ["", "k", "h", "h", "", "", "v", "", "", "hv", "", "", ""]
    str.split(/d/).join("");//打印结果 "khhvhv"


     

    其它对象

      全局对象

        对于任何 JavaScript 程序,当程序开始运行时,JavaScript 解释器都会初始化一个全局对象。

        全局对象,它预定义了全局的属性、函数、对象、构造函数以便你开发使用。

        比如说:

            全局的属性: undefined、Infinity 和 NaN

            全局的对象: Math、JSON 和 Number

            全局的函数: isNaN()、isFinite()、parseInt() 和 eval() 等

            全局的构造器对象: Date()、RegExp()、String()、Object() 和 Array() 等

    注:不同的环境中,全局对象是不同的。

      Error对象

        error,指程序中的非正常运行状态,在其他编程语言中称为“异常”或“错误”。

        解释器会为每个错误情形创建并抛出一个 Error 对象,其中包含错误的描述信息。

        ECMAScript 定义了六种类型的错误。除此之外,还可以使用 Error 构造方法创建自定义的 Error 对象, 并使用 throw 语句抛出该对象。

        也可以使用 try-catch-finally 语句处理异常。

            六种错误:

                  ReferenceError :找不到对象时

                  TypeError :错误的使用了类型或对象的法国法时

                  RangeError :使用内置对象的方法时,参数超范围

                  SyntaxError :语法写错了

                  EvalError :错误的使用了 Eval

                  URIError : URI 错误

    throw new Error("我错了!");//通过throw关键字抛出⾃定义错误
    
    
    try {
     say("Welcome!");
    }catch(err) {//如果发⽣错误,捕获错误对象,存放在变量err中
     console.log(err.name + ":" + err.message);//打印错误对象的信息
    }

          

  • 相关阅读:
    echars柱状图修改每条柱的颜色
    vue打开到新页面,并传递参数
    彻底了解websocket原理
    bind和on的区别
    Vue如何更新子组件
    Vue父子组件生命过程
    使用css3实现动画来开启GPU加速
    前端技术体系
    Vue中的~(静态资源处理)
    垂直居中的办法小结
  • 原文地址:https://www.cnblogs.com/jiayouba/p/11954015.html
Copyright © 2020-2023  润新知