美文网首页
javascript遍历

javascript遍历

作者: 文刀和三皮 | 来源:发表于2017-04-26 17:56 被阅读0次

    ## 对象遍历

    // Object对象属性

    Object.prototype.userProp = 'userProp';

    Object.prototype.getUserProp = function(){

    return Object.prototype.userProp;

    }

    // 对象字面量

    var obj = {

    name: 'huanci',

    age: 21,

    [Symbol('symbol 属性')]: 'symbolProp',

    unEnumerable: '我是一个不可枚举属性',

    skills: ['html', 'css', 'js'],

    getSkills: function(){

    return this.skills;

    }

    };

    // 设置unEnumerable属性为不可枚举

    Object.defineProperty(obj, 'unEnumerable', {

    enumerable: false

    })

    ### for...in

    遍历对象自身和继承的可枚举属性,不包含Symbol类型的属性

    自身属性,继承属性, 可枚举, 无Symbol

    for(let key in obj){

    console.log(key);

    console.log(obj.key) //this is wrong way to get prop

    console.log(obj[key])

    }

    注意:不要使用for...in来遍历数组,因为数组也是对象

    ### Object.keys(obj)

    返回一个数组,自身属性,无继承,可枚举,无Symbol

    Object.keys(obj) // ['name','age', 'skills','getSkills']

    ### Object.getOwnPropertyNames(obj)

    返回一个数组,自身属性,无Symbol,无继承, 有不可枚举属性

    Object.getOwnPropertyNames(obj) //['name','age','skill','getSkills','unEnumerable']

    ### Object.getOwnPropertySymbols(obj)

    专门取Symbol类型属性

    Object.getOwnPropertySymbols(obj)

    ### Reflect.ownKeys(obj)

    返回一个数组,自身属性,symbol , 不可枚举属性 ,无继承属性

    Reflect.ownKeys(obj)

    遍历顺序:

    1.遍历所有属性名为数值的属性, 按照数字顺序

    2.遍历所有属性名为字符串的属性,按照生成时间

    3.遍历所有属性名为Symbol值得属性,按照生成时间

    ### 如何判断某个属性是不是对象自身属性

    1. in 不够严谨,判断这个属性在不在这个对象的原型链上

    2. hasOwnProperty()  这个方法只会检测某个对象上的属性,而不是原型链上的属性 (如果用object.create创建的对象,并不可以。所以改用Object.prototype.hasOwnProperty.call(obj,'name'))

    ## 数组遍历

    数组也是一种对象,所以对象的所有遍历方法均可以,数组还有其他的方法

    ### for ,while

    ### for...of(es6)

    数组Array内置了一些方法

    ### Array.prototype.forEach(callback(currentValue,index,array){})

    对数组的每个元素执行一次回调

    ### Array.prototype.map(callback(currentValue,index,array){})

    返回一个新数组,每个元素都是回调函数返回的值

    ### Array.prototype.every(callback[,thisArg])

    测试数组的每一个元素是否通过了回调函数的测试,如果都通过return true,否则 return false

    ### Array.prototype.find(callback[,thisArg])

    返回第一个通过测试的元素

    ### Array.prototype.filter(callback[,thisArg])

    返回原数组中通过测试的元素

    ### Array.prototype.findIndex(callback[,thisArg])

    返回通过测试元素的索引

    ### Array.prototype.some(callback[,thisArg])

    类似find 不返回数组元素,只返回一个布尔值,只要找到一个通过的就返回true

    ### Array.prototype.reduce(callback[,initialValue])

    对每个元素执行回调函数,最后返回最后一次调用回调时候返回的值

    [1,2,2,34,55,3].reduce(function(accumulator, currentValue, currentIndex, array){

    })

    ### Array.prototype.reduceRright(callback[,initialValue])

    这些方法均可以来对字符串进行操作,并且可以用箭头函数来简化回调。用这些更加简便的方法来简化我们的代码

    相关文章

      网友评论

          本文标题:javascript遍历

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