zoukankan      html  css  js  c++  java
  • es6

    ES6 Object.keys() 获取对象的所有键名

    Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,
    数组中属性名的排列顺序和使用 for…in 循环遍历该对象时返回的顺序一致 。

    // 1.0 传入对象,返回属性名,keys()是对键名的遍历
    var obj = {
        a:"小白",
        b:"小黑",
        c:"大黄"
    };
    console.log(Object.keys(obj)) // => ["a", "b", "c"] 返回所有属性名
    Object.keys(obj).map((key)=>{
        console.log(key,obj[key]); //key=>属性名  obj[key]=>属性值
    });
    
    // 2.0 传入字符串,返回索引
    var str = 'ab1234';
    console.log(Object.keys(str)); // [0,1,2,3,4,5]
    
    // 3.0 传入数组 返回索引
    var arr = ["a", "b", "c"];
    console.log(Object.keys(arr)); // ["0", "1", "2"]
    
    // 扩展
    1、Object.values(),values()是对键值的遍历
    Object.values方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的 键值。
    console.log(Object.values(obj)); // ["小白", "小黑", "大黄"]
    
    2、Object.entries(),entries()是对键值对的遍历
    Object.entries方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的 键值对数组。
    console.log(Object.entries(obj)); 
    //得到以下数据
    [
        ["a", "小白"],
        ["b", "小黑"],
        ["c", "大黄"]
    ]

    1.字符串扩展

    2.数值扩展

    Math.trunc(i) : 直接去除小数部分

    Number.parseInt将字符串转为数值,不包括小数点以及非数字字符,必须数字开头

    3:数组扩展

    1. Array.from(v) : 将伪数组对象或可遍历对象转换为真数组

    2. Array.of(v1, v2, v3) : 将一系列值转换成数组 3. Array.prototype.find(function(value, index, arr){return true}) : 找出第一个满足条件返回true的元素 4. Array.prototype.findIndex(function(value, index, arr){return true}) : 找出第一个满足条件返回true的元素下标

    Array.includes()函数的用法

    ES6提供了Array.includes()函数判断是否包含某一元素,除了不能定位外,解决了indexOf的上述的两个问题。它直接返回true或者false表示是否包含元素,对NaN一样能有有效。

    includes()函数的第二个参数表示判断的起始位置

    4:对象扩展

    Object.assign(target, source1, source2..)将源对象的属性复制到目标对象上(浅拷贝)

    拷贝:

    1、常用的拷贝技术 1). arr.concat(): 数组浅拷贝 2). arr.slice(): 数组浅拷贝 3). JSON.parse(JSON.stringify(arr/obj)): 数组或对象深拷贝, 但不能处理函数数据

    浅拷贝基本类型是个赋值操作,对于对象类型,浅拷贝拷贝的是对象的应用地址值,就是个指针,其中一个对象进行改变会影响另一个,深拷贝实现独立,拷贝到一个新的堆内存中,逐层拷贝

    深度拷贝封装

    function checkType(obj){

      return Object.prototype.toString.call(obj).slice(8,-1)

    }

    function deepClone(obj) {

        let type=checkType(obj)

        let newObj=null

        if(type==='Object'){

            newObj={}

        }else if(type===Array){

            newObj=[]

        }else{

            return obj

        }

        for(let i in obj){

            let value=obj[i]

            let type=checkType(value)

            if(type==='Object'||'Array'){

                newObj[i]=deepClone(value)

            }else{

                newObj[i]=value

            }

        }

        return newObj

    }

    var arr=[2,3,{name:'jack',sex:{i:'4'}}]

    var arr2=deepClone(arr)

    console.log(arr2);

    for(let value of target){}循环遍历 遍历数组、字符串,伪数组,set,map

    5:set/map容器(构造函数,new调用)

    1. Set容器 : 无序不可重复的多个value的集合体

    * Set() *Set(array) * add(value)   添加元素(实例上的方法  * delete(value)  删除元素 * has(value)   判断是否包含指定元素 * clear()      清空所有元素  * size 2. Map容器 : 无序的 key不重复的多个key-value的集合体 * Map() * Map(array) * set(key, value)//添加  * get(key)

    * delete(key) * has(key) * clear()

    * size

    map和object去区别

    Object的键只能是字符串,Map的键可以是任意类型的值(包括对象),所以Map是一种更完善的Hash结构实现。

    6.Reflect

    • 反射,什么是反射机制?
    • Reflect简介
    • 为什么要用Reflect?
    • Reflect API
      • .apply()
      • .construct()
      • .defineProperty()
      • .deleteProperty()
      • .get()
      • .getOwnPropertyDescriptor()
      • .getPrototypeOf()
      • .has()
      • .isExtensible() —— 是否可扩展
      • .ownKeys() —— 判断对象自身属性
      • .preventExtensions() —— 是否可扩展
      • .set() —— 写数据
      • .setPrototypeOf()
        • Reflect 是一个内置的对象,它提供拦截 JavaScript 操作的方法,这些方法与处理器对象的方法相同。Reflect不是一个函数对象,因此它是不可构造的。

        • 与大多数全局对象不同,Reflect没有构造函数。你不能将其与一个new运算符一起使用,或者将Reflect对象作为一个函数来调用。Reflect的所有属性和方法都是静态的( 就像Math对象 )

  • 相关阅读:
    大型高性能ASP.NET系统架构设计
    读写锁ReaderWriterLockSlim
    日常生活英语单词大全
    unity3d读取plist或xml文件
    WIN7开无线
    asp.net 2.0中新增的web.config的默认namespace功能 (转)
    面向对象的一些基本概念
    大话设计模式之策略模式
    大话设计模式之简单的工厂模式
    iOS UI 之UILable
  • 原文地址:https://www.cnblogs.com/baixiaoxiao/p/13048593.html
Copyright © 2011-2022 走看看