美文网首页
javascript 的七种基本数据类型

javascript 的七种基本数据类型

作者: 奔跑的兔子_ | 来源:发表于2018-08-31 14:44 被阅读0次

    六种基本数据类型

    • undefined
    • null
    • string
    • boolean
    • number
    • symbol(ES6)

    一种引用类型

    • Object

    string

    string的属性篇...

    1. length属性
    • 获取字符串的长度。当然需要注意的是js中的中文每个汉字也只代表一个字符,这里可能跟其他语言有些不一样。
    var str = 'abc';
    console.log(str.length);
    
    1. prototype属性
    • 给对象添加属性或方法,并且添加的方法或属性在所有的实例上共享。因此也常用来扩展js内置对象,如下面的代码给字符串添加了一个去除两边空格的方法:
    String.prototype.trim = function(){
        return this.replace(/^\s*|\s*$/g, '');
    }
    

    string的方法篇

    1. 获取类方法
    • (1) charAt()

    stringObject.charAt(index)

    charAt()方法可用来获取指定位置的字符串,index为字符串索引值,从0开始到string.leng - 1,若不在这个范围将返回一个空字符串。如:

    var str = 'abcde';
    console.log(str.charAt(2));        //返回c
    console.log(str.charAt(8));        //返回空字符串
    
    • (2) charCodeAt()

    stringObject.charCodeAt(index)

    charCodeAt()方法可返回指定位置的字符的Unicode编码。charCodeAt()方法与charAt()方法类似,都需要传入一个索引值作为参数,区别是前者返回指定位置的字符的编码,而后者返回的是字符子串。

    var str = 'abcde';
    console.log(str.charCodeAt(0));   //返回97
    
    • (3) fromCharCode()

    String.fromCharCode(numX,numX,…,numX)

    fromCharCode()可接受一个或多个Unicode值,然后返回一个字符串。另外该方法是String 的静态方法,字符串中的每个字符都由单独的数字Unicode编码指定。

    String.fromCharCode(97, 98, 99, 100, 101) ;
     //返回abcde
    
    1. 查找类方法
    • (1) indexOf()

    stringObject.indexOf(searchvalue,fromindex)

    indexOf()用来检索指定的字符串值在字符串中首次出现的位置。它可以接收两个参数,searchvalue表示要查找的子字符串,fromindex表示查找的开始位置,省略的话则从开始位置进行检索。

    var str = 'abcdeabcde';
    console.log(str.indexOf('a'));    // 返回0
    console.log(str.indexOf('a', 3));    // 返回5
    console.log(str.indexOf('bc'));    // 返回1
    
    • (2) lastIndexOf()方法

    stringObject.lastIndexOf(searchvalue,fromindex)

    lastIndexOf()语法与indexOf()类似,它返回的是一个指定的子字符串值最后出现的位置,其检索顺序是从后向前。

    var str = 'abcdeabcde';
    console.log(str.lastIndexOf('a'));    // 返回5
    console.log(str.lastIndexOf('a', 3));    // 返回0 从第索引3的位置往前检索
    console.log(str.lastIndexOf('bc'));    // 返回6
    
    • (3) search()方法

    stringObject.search(substr)
    stringObject.search(regexp)

    search()方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。它会返回第一个匹配的子字符串的起始位置,如果没有匹配的,则返回-1。

    var str = 'abcDEF';
    console.log(str.search('c'));    //返回2
    console.log(str.search('d'));    //返回-1
    console.log(str.search(/d/i));    //返回3
    
    • (4) match(substr) / match(regexp) 单参数 + 返回匹配的数组 + 可正则

    Object

    对象可以通过执行new操作符后跟要创建的对象类型的名称来创建。

    var obj = new Object();//对象
    var arr = new Array();//数组格式
    var jsonaaa = {'1':'a','222':'b'}//json格式
    

    symbol(ES6)

    六种基本数据类型还不够?为什么要引入 Symbel?

    es5的对象属性名是字符串,容易造成属性名的冲突,如果有一种机制,保证每个属性的名字都是独一无二的,就可以从根本上防止属性名的冲突。

    Symbel怎么生成?

    symbol值通过Symbol函数生成,生成的Symbol是一个类似于字符串的原始类型的值。

    const sym = Symbol(param);
    // param 可以为字符串或者对象
    

    知识点:

    1. 使用new命令会报错,这是因为生成的 Symbol是一个原始类型的值,不是对象,不能添加属性。
    2. 如果传入的参数为对象,会调用toString方法,再转为字符串;
    3. Symbol函数的参数只是表示对当前 Symbol 值的描述,因此传入的参数相同,Symbol的返回值也是不相等的。
    4. Symbol的值不能与其他的值进行运算,Symbol可以显式的转为字符串、布尔值,但不能转为数值。

    Symbel值作为对象属性名时,怎样使用?

    let mySymbol = Symbol();
    
    // 第一种写法
    let a = {};
    a[mySymbol] = 'Hello!';
    
    // 第二种写法
    let a = {
      [mySymbol]: 'Hello!'
    };
    
    // 第三种写法
    let a = {};
    Object.defineProperty(a, mySymbol, { value: 'Hello!' });
    
    // 以上写法都得到同样结果
    a[mySymbol] // "Hello!"
    

    注意:
    Symbol每一个值都是不相等的,意味着可以作为标识符,用于对象的属性名,能保证不会出现同名的属性,注意作为属性名时不能使用点运算符。

    const mySymbol = Symbol();
    const a = {};
    
    a.mySymbol = 'Hello!';
    a[mySymbol] // undefined
    a['mySymbol'] // "Hello!"
    // a的属性名实际上是一个字符串而不是Symbol的值。
    

    属性值的遍历

    JSON.stringify是在序列化过程中会自动转换成对应的原始值;
    Object.getOwnPropertySymbols方法返回一个数组,成员是当前对象的所有用作属性名的 Symbol 值;
    Object.getOwnPropertyNames(obj)一个对象,其自身的可枚举和不可枚举属性的名称被返回。
    keys 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用[for...in]循环遍历该对象时返回的顺序一致 。
    Reflect.ownKeys方法可以返回所有类型的键名,包括常规键名和 Symbol 键名。

    obj
    // {ccc: "aaa", Symbol(a): "hello", Symbol(b): "world"};
    JSON.stringify(obj)
    // "{"ccc":"aaa"}"
    Object.getOwnPropertyNames(obj)
    // ["ccc"]
    Object.keys(obj)
    // ["ccc"]
    Object.getOwnPropertySymbols(obj);
    // (2) [Symbol(a), Symbol(b)]
    Reflect.ownKeys(obj)
    // (3) ["ccc", Symbol(a), Symbol(b)]
    

    如果我希望使用同一个Symbol值?

    let s1 = Symbol.for('foo');
    let s2 = Symbol.for('foo');
    
    s1 === s2 // true
    

    Symbol.for()Symbol()这两种写法,都会生成新的 Symbol。它们的区别是,前者会被登记在全局环境中供搜索,后者不会。

    let s1 = Symbol.for("foo");
    Symbol.keyFor(s1) // "foo"
    
    let s2 = Symbol("foo");
    Symbol.keyFor(s2) // undefined
    

    Symbol.keyFor方法返回一个已登记的 Symbol 类型值的key。
    注意:

    1. 需要注意的是,Symbol.for为 Symbol 值登记的名字,是全局环境的,可以在不同的 iframe 或 service worker 中取到同一个值。

    内置的 Symbol 值?

    Symbol.hasInstance

    对象的Symbol.hasInstance属性,指向一个内部方法。当其他对象使用 instanceof运算符,判断是否为该对象的实例时,会调用这个方法。比如, foo instanceof Foo在语言内部,实际调用的是Foo[Symbol.hasInstance](foo)

    class MyClass {
      [Symbol.hasInstance](foo) {
        return foo instanceof Array;
      }
    }
    

    Symbol.isConcatSpreadable

    对象的Symbol.isConcatSpreadable属性等于一个布尔值,表示该对象用于Array.prototype.concat()时,是否可以展开。
    下面代码说明,Symbol.isConcatSpreadable默认等于 undefined,可以展开。
    Symbol.isConcatSpreadable = true || undefined => 展开
    Symbol.isConcatSpreadable = false => 不展开

    let arr1 = ['c', 'd'];
    ['a', 'b'].concat(arr1, 'e') // ['a', 'b', 'c', 'd', 'e']
    arr1[Symbol.isConcatSpreadable] // undefined
    
    let arr2 = ['c', 'd'];
    arr2[Symbol.isConcatSpreadable] = false;
    ['a', 'b'].concat(arr2, 'e') // ['a', 'b', ['c','d'], 'e']
    

    类似数组的对象正好相反,默认不展开。它的Symbol.isConcatSpreadable属性设为true,才可以展开。

    let obj = {length: 2, 0: 'c', 1: 'd'};
    ['a', 'b'].concat(obj, 'e') // ['a', 'b', obj, 'e']
    
    obj[Symbol.isConcatSpreadable] = true;
    ['a', 'b'].concat(obj, 'e') // ['a', 'b', 'c', 'd', 'e']
    

    Symbol.species

    对象的Symbol.species属性,指向一个构造函数。创建衍生对象时,会使用该属性。

    var
    

    数组方法
    字符串方法
    引用:https://segmentfault.com/a/1190000006172772

    image.png

    相关文章

      网友评论

          本文标题:javascript 的七种基本数据类型

          本文链接:https://www.haomeiwen.com/subject/jjiswftx.html