数组,对象的方法

121 阅读6分钟

对象的方法

Object.values(obj) 得到对象的属性值

Object.key(obj) 得到对象的属性名

Object.assign(obj1,obj2,...) 合并两个(或多个对象),让obj2及以后的对象替换obj1中的内容,返回obj1。与obj1属性名相同的取最后面的对象的属性值,obj1没有的属性名/值会直接添加进去。 obj2 ,obj3 不变

const fun = (obj,obj2,obj3) => {
    const values=Object.values(obj);
    const keys=Object.keys(obj)
    const newObj=Object.assign(obj,obj2,obj3)
    console.log({keys,values,newObj,obj,obj2,obj3})
  }
fun({name:'lily',age:18},{name:'Lucy',age:20},{name:'Jack',age:100,sex:'male'})
keys:['name''age']
values:['lily'18]
newObj: {name: 'Jack', age: 100, sex: 'male'}
obj: {name: 'Jack', age: 100, sex: 'male'}
obj2: {name: 'Lucy', age: 20}
obj3: {name: 'Jack', age: 100, sex: 'male'}

Object.assign可以用来克隆对象,Object.assign是浅拷贝

 const fun = (obj) => {
    const copy=Object.assign({},obj)
    copy.name='Jenny'
    copy.a.b=5
    console.log({copy,obj})
  }
   fun({name:'Jack',age:100,sex:'male',a:{b:3}})
  copy:{a:{b:5},name:'Jenny',age:100,sex:'male'}
  obj:{a:{b:5},name:'Jenny',age:100,sex:'male'}
  

对象中的扩展运算符(…)  用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中
和Object.assign()作用一样,都用于合并对象,并且也是浅拷贝

 const fun = (obj) => {
    const copy={...obj}
    copy.name='Jenny'
    copy.a.b=5
    console.log({copy,obj})
  } 
 fun({name:'Jack',age:100,sex:'male',a:{b:3}})
 copy:{a:{b:5},name:'Jenny',age:100,sex:'male'}
 obj:{a:{b:5},name:'Jenny',age:100,sex:'male'} 

Object.hasOwnProperty() 返回一个布尔值,用来检测对象自身属性中是否具有指定的属性 和in运算符不同,该方法会忽略掉那些从原型链上继承到的属性

数组的方法

push(a,b,c...) 数组末尾添加元素 返回新数组长度 改变原数组

unshift(a,b,c...) 数组头部添加元素。返回数组长度 改变原数组

pop() 删除数组最后一项 无参数 返回删除的项 改变原数组

shift()删除数组中第一项 无参数 返回删除的项。改变原数组

slice()

按照条件查找出曲中的部分内容 返回一个新数组 不改变原数组 array.slice(n, m),从索引n开始查找到m处(不包含m)

array.slice(n) 第二个参数省略,则一直查找到末尾

array.slice(-n,-m) slice支持负参数,从最后一项开始算起,-1为最后一项,-2为倒数第二项

array.slice(0)原样输出内容,可以实现数组克隆

splice()对数组进行增删改查

第一个参数:index 位置 第二个参数:删除的个数。 第三个参数:要插入的内容 多项用逗号隔开

返回值,删除元素组成的数组。

改变原数组

const arr=[1,2,3,4,5]
const arr2=arr.splice(1,1,'lily')
console.log(arr2, arr)  //[2]  [1,'lily',3,4,5]
const arr3=arr.splice(1,2,'lulu')
console.log(arr3,arr) //['lily',3] [1,'lulu',4,5]
const arr4=arr.splice(1,1,2,3)
console.log(arr4,arr) //['lulu'] [1,2,3,4,5]


join()

join(',') 用指定的分隔符将数组每一项拼接为字符串 参数为自己要指定的分隔符,如果省略,则使用逗号作为分隔符。 返回拼接后的字符串。不改变原数组

`let ary = [1,2,3];`

`console.log(ary.join('、'));//1、2、3`

join(',')与split('')是一组功能相反的方法。split(',') 将字符串分割成字符串数组。应用:input框填入多个值以逗号分开。存值与回显。

concat(arr1,arr2,item1,item2,arr3....) 合并两个或多个数组 参数可以是具体的值也可以是数组 可以是任意多个。返回合并的新数组 不改变原数组

 let newarr=arr.concat(1,2,3,[4,5,6])
 console.log(newarr)

IndexOf(item,start) 检测当前值在数组中第一次出现的位置 参数start为开始检索的位置 返回第一次查到的索引 未找到返回-1 不改变原数组

includes( item) 判断数组中是否包含某个特定的值 返回布尔值 不改变原数组

sort()对数组的元素进行排序 (默认是从小到大来排序 并且根据字符串来排序) 参数 :可选(函数)规定排序规则 默认排序顺序为字母升序。返回排序后的新数组。改变原数组。sort在不传递参数情况下,按编码顺序排序

let arr=[2,9,99,88,22,3]
 let newarr=arr.sort(function(a,b){
      return a-b //从小到大
     // return b-a 从大到小
    })
    console.log(newarr) 

reverse() 把数组倒过来排序 无参数 但会倒序后的新数组 会改变原数组

find() 遍历数组 数组中的每个元素都调用一次函数执行,返回第一个符合条件的那一项, 之后的值不会再调用执行函数。找不到返回undefined。不会改变原数组

遍历对象的方法

for in for in 是最基础的遍历对象的方式,他还会得到对象原型链上的属性

//创建一个对象并制定其原型,bar为对象原型链上的属性
  const obj=Object.create({
    bar:'bar'
  })
  obj.foo='foo'
  for(let key in obj){
  // 可以使用对象的 hasOwnProperty() 方法过滤掉原型链上的属性
  //  if(obj.hasOwnProperty(key)){
      console.log(obj[key])
  //  } 
  }
  
 Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的_proto_
 
 const obj1=Object.create(obj);
  obj1.c=0;  //c是obj1的属性不是obj的
 obj1.a=780; //a也是属性上的

 console.log(obj1)
 a:780
 c:0
 prototype : _proto_:{a:123 b:456}
 创建一个新对象obj1 使用obj来提供新创建的对象的_proto_
 
  
 

Object.keys()

Object.keys() 是 ES5 新增的一个对象方法,该方法返回对象自身属性名组成的数组,它会自动过滤掉原型链上的属性,然后可以通过数组的 forEach() 方法来遍历 另外还有Object.values() 和Object.entries()

for in 循环和Object.keys()都不会返回对象的不可枚举属性。如果需要遍历不可枚举的属性,要用Object.getOwnPropertyNames()方法

Object.getOwnPropertyNames()

该方法返回对象自身属性名组成的数组,包括不可枚举的属性,也可以通过数组的forEach方法来遍历

  const obj=Object.create({
    bar:'bar'
  },{
    baz:{
      value:'baz',
      enumerable:false
    }
  })
  obj.foo='foo'
  Object.getOwnPropertyNames(obj).forEach(item=>console.log(item))//baz foo

Object.getOwnPropertySymbols

返回对象自身的symbol属性组成的数组,不包括字符串属性

 const obj={
  a:123,
  b:456
 }
 console.log(Object.getOwnPropertySymbols(obj))//【】
 给对象添加一个不可枚举的 Symbol 属性
 Object.defineProperties(obj,{[Symbol('baz')]:{value:'baz',enumerable:false}})
 给对象添加一个可枚举的 Symbol 属性
 obj[Symbol('foo')]='foo'
 Object.getOwnPropertySymbols(obj).forEach(item=>console.log(item))// Symbol baz, Symbol foo

Reflect.ownKeys()该方法返回对象自身所有属性名组成的数组,包括不可枚举的属性和Symbol属性

const obj = {
    a: 123,
    b: 456
  }
  Object.defineProperties(obj, { [Symbol('baz')]: { value: 'baz', enumerable: false } })
  obj[Symbol('foo')] = 'foo'
  Reflect.ownKeys(obj).forEach(item => console.log(item))
  //a b Symbol baz, Symbol foo

Map

let m=new Map();
 m.set(1,'1');
 m.set(2,'2')
 m.set(3,'3')
 m.forEach(item=>console.log(item))

字符串的方法

split() 用于把一个字符串分割成字符串数组。

var str="How are you doing today?";
var n=str.split('');
//第一个参数是空串,第二个参数不传递默认是整个字符串,就会把每个字符全部分割并用逗号隔开
result:H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?
var str="How are you doing today?"; 
var n=str.split(' '); result:How,are,you,doing,today? 
//第一个参数是空格,第二个参数不传递默认是整个字符串,意味着把字符串str按空格进行拆分
var str="How are you doing today?";
var n=str.split(' '3); 
//第一个参数是空格,第二个参数是个number 3,意味着把字符串按空格分割为长度为3的数组,剩余的截断舍弃 
result:How,are,you