Which common array and object methods

• Object.defineProperty()

  • Appear… All of them are data hijacking

  • Vue uses Object.defineProperty data hijacking to implement two-way data binding

  • A data jacked object cannot change the value of the original object directly. It can only change the value of the original object through the set function

Object.defineProperty(_this, kesy, {
    value: xxx
    // get: Gets the value of the extended attribute, and calls the get method when it gets the attribute
    get(){
    	return xxx
	}
	// set: listen for extended attributes and will be called whenever they are modified
	set(newValue){
        // _this.username = newValue Do not modify the current attribute value in the set method
        data[item] = newValue
    }
})
Copy the code

object

Object.defineProperty()

• role

  This method directly defines a new property on the specified object or modifies an existing property of the object. Properties added or modified by this method cannot be modified by default

• grammar

  Object.defineProperty(obj, key, descriptor)

• parameter

  • Obj The object that defines attributes

  • Key Specifies the name of the property to be defined or modified

  • Descriptor Defines or modifies the description of a property

    • Descriptor Parameter Description

      {
      	configurable: true // This property can be changed or removed by default false
      	enumerable: ture // This property can be enumerated by default false
      	value: Number | Object | functionThe corresponding value of this property is defaultundifned
      	get: () = >{
      		return undifned // This function is called when the property is accessed, displaying the value of return
      	}
      	set: setValue= > {
      		// This function is called when the key is changed, taking an argument (that is, the new value assigned)}}Copy the code

• The return value

  The defined object

Object.keys()

• role

  Returns all the keys of an object as an array

• grammar

  Object.keys(obj)

• parameter

  Obj to return the object with the enumeration key

• The return value

  An array of strings representing all the enumerable properties of a given object

An array of

const players = [
    { name: 'kobe Bryant.num: 24 },
    { name: 'James'.num: 23 },
    { name: 'Paul'.num: 3 },
    { name: 'less wei'.num: 0 },
    { name: 'Durant'.num: 35}]Copy the code

Array traversal method

forEach

• role

  • Iterate over the items of the number group

• grammar

  players.forEach((item,index,arr) = > {
      console.log(item,index)
  })
  // {name: "id ", num: 24} 0
  // {name: "James ", num: 23} 1
  // {name: "Paul ", num: 3} 2
  Num: 0} 3
  // {name: "durant ", num: 35} 4
  
  Copy the code

• parameter

  • Item Indicates the item currently traversed
  • Index Indicates the index of the item currently traversed
  • Arr array itself

• The return value

  • null

map()

• Function: Array mapping

• grammar

  let result = players.map( (item,index,arr) = > {
  	return `${item.name}-----${item.num}`})console.log(result)
  / / [Bryant -- -- -- -- -- "24", "-- -- -- -- -- James 23", "Paul -- -- -- -- -- 3", "wei less -- -- -- -- -- 0", "durant -- -- -- -- -- 35"]
  Copy the code

• parameter

  • Item Indicates the item currently traversed
  • Index Indicates the index of the item currently traversed
  • Arr array object

• The return value

  • Returns the mapped array, which does not alter the original array

every()

• Function: Checks whether all elements of an array pass a condition

• grammar

  let result = players.every((item,index,arr) = > {
  	return item.num > 2
  })
  console.log(result)
  // false
  let result1 = players.every((item,index,arr) = > {
  	return item.num >= 0
  })
  console.log(result1)
  // true 
  Copy the code

• parameter

  • Item Indicates the item currently traversed
  • Index Indicates the index of the item currently traversed
  • Arr array object

• The return value

  • Test results of true | | false

some()

• Function: Roughly the same as every(), some() checks that at least one element in the array passes the test.

• grammar

  const result = players.some((item,index,arr) = > {
  	return item.name === 'kobe Bryant 
  })
  console.log(result) 
  // true
  Copy the code

• parameter

  • Item Indicates the item currently traversed
  • Index Indicates the index of the item currently traversed
  • Arr array object

• The return value

  • The test results, true | | false

reduce()

• Effect: Returns a summary of execution results as a single value
• parameter
  • The callback function executed by callback
    • Total cumulative value
    • Item Indicates the item currently traversed
    • Index Indicates the index of the item currently traversed
    • Arr array object
  • InitTotal Initial Value An array of objects of any value type can be switched according to the application scenario……
• grammar

let result = players.reduce((total,item,index) = > {
	return total + item.num
},0)
console.log(result)
/ / 85
Copy the code

findIndex()

• Function: Find the element subscript that meets the requirement
• parameter
  • Item Indicates the item currently traversed
  • Index Indicates the index of the item currently traversed
  • Arr array object
• grammar

let result = players.findIndex((item,index,arr) = > {
    return item.name === 'kobe Bryant
})
console.log(result)
/ / 0
Copy the code

• Return value: Returns the index of the first element that meets the criteria. Returns -1 if not found

find()

• Function: Find elements that match the requirements
• parameter
  • Item Indicates the item currently traversed
  • Index Indicates the index of the item currently traversed
  • Arr array object
• grammar

let result = players.find((item,index,arr) = > {
    return item.name === 'kobe Bryant
})
console.log(result)
// {name: "id ", num: 24}
Copy the code

• Return value: Returns the first element that matches the condition. Return undefined not found

Array manipulation element methods

Define a default array

let array = [1.2.3.4]
Copy the code

splice()

• role

  The splice() method can delete or replace array elements, changing the original array

• grammar

  array.splice(0.1.'New added value 1'.'New value 2')
  console.log(array)
  // [" new added value 1", "new added value 2", 2, 3, 4]
  Copy the code

• parameter

  • Satrt specifies the starting value of the modification (counting from 0) or the last digit of the array if it is negative
  • DeleteCount Optional parameter Number of elements to be deleted including start
  • Item1, item2,… Optional argument The element to be added

• The return value

  An array of deleted elements. If an element is deleted, an array containing only one element is returned. No delete returns an empty array

fill()

• role

  Fill () fills the array, changing the original array

• grammar

  array.fill('Filled number 11'.0.2)
  console.log(array) // [' fill number 11', 'fill number 11', 3, 4]
  Copy the code

• parameter

  • FillValue: indicates the filling value
  • SatrtIndex Optional parameter Specifies the index to start filling. The default value is 0
  • EndIndex optional parameter endIndex (excluding the index) the default value is -1

• The return value

  Returns the populated array

includes()

• role

  Includes () queries whether an element exists in the array

• grammar

  let result = array.includes(2.0)
  console.log(result) // true
  Copy the code

• parameter

  • FindValue Specifies the element of the query
  • StartIndex Optional The search starts from the startIndex index

• The return value

  Returns true if found, false if not found

join()

• role

  Returns a string that separates array elements by the specified characters

• grammar

  let result = array.join('|')
  console.log(result) / / '1 | 2 | 3 | 4'
  Copy the code

• parameter

  • STR optionally specifies a delimiter. If not, it is separated by a comma

• The return value

  • A string converted from all elements to delimiters

splice()

• role
• grammar
• parameter
• The return value