FreeCodeCamp_js算法和数据结构_基础数据结构

1、使用数组存储不同类型的数据

所有数组都有一个表示长度的属性，我们可以通过 Array.length 来访问它。数组能够存储复杂的对象类型数据。

let yourArray = ["string","number",3,true,false,{a:100,b:200},,['二维数组']]

2、使用方括号访问数组的元素

所有数据结构的基本特性是，它们不仅可以存储数据，还可以让我们按需访问存放在其中的数据。在数组中，内部的每个元素都有一个与之对应的索引（index）。 索引既是该元素在数组中的位置，也是我们访问该元素的引用。 需要注意的是，JavaScript 数组的索引是从 0 开始的（这种从 0 开始的规则叫做 zero-indexed），即数组的第一个元素是在数组中的第 0 个位置，而不是第 1 个位置。 要从数组中获取一个元素，我们可以在数组字面量后面加一个用方括号括起来的索引。不过习惯上，我们会通过表示数组的变量名来访问，而不是直接通过字面量。 这种从数组中读取元素的方式叫做方括号表示法（bracket notation）

//使用方括号访问指定的数组元素并改变它的值
let myArray = ["a", "b", "c", "d"];
myArray[1] = "e"
console.log(myArray);

3、使用 push() 和 unshift() 为数组添加元素

数组的长度与数组能包含的数据类型一样，都是不固定的。 数组可以包含任意数量的元素，可以不限次数地往数组中添加元素或者从中移除元素。 总之，数组是可变的（mutable）。 在本挑战中，我们要学习两种修改数组的方法：Array.push() 和 Array.unshift()。这两个方法都接收一个或多个元素作为参数，并会将参数中的元素添加到该数组中。 push() 方法会将元素插入到数组的末尾，而 unshift() 方法会将元素插入到数组的开头。push()和unshift()方法会返回数组的长度

//将 'I', 2, 'three' 插入到数组开头arr.unshift()
let arr = ['unshift','push']
arr.unshift('I',2,'three')
//将 7,'VIII',9 插入到数组结尾arr.push()
arr.push(7,'VIII',9)

4、使用 pop() 和 shift() 从数组中删除元素

push() 和 unshift() 都有一个与它们作用相反的函数：pop() 和 shift()。 与插入元素相反，pop() 会从数组的末尾移除一个元素，而 shift() 会从数组的开头移除一个元素。 pop() 和 shift() 与 push() 和 unshift() 的关键区别在于，用于删除元素的方法不接收参数，而且每次只能删除数组中的一个元素。pop()和shift()会返回被删除的元素

let arr = ['challenge', 'is', 'not', 'complete']
//pop()删除数组的最后一位元素
arr.pop()
//shift()删除数组的第一个元素
arr.shift()

5、使用 splice() 删除元素

splice() 可以让我们从数组中的任意位置连续删除任意数量的元素。splice() 最多可以接受 3 个参数，splice() 接收的前两个参数是整数，表示正在调用 的splice() 数组中的元素的索引或位置。 splice() 的第一个参数代表从数组中的哪个索引开始移除元素，而第二个参数表示要从数组中的这个位置开始删除多少个元素

const arr = [2, 4, 5, 1, 7, 5, 2, 1];
arr.splice(1,4)
console.log(arr);

6、使用 splice() 添加元素

splice() 方法最多可以接收 3 个参数， 第三个参数可以是一个或多个元素，这些元素会被添加到数组中。 这样，我们能够便捷地将数组中的一个或多个连续元素换成其他的元素。

//使用 splice() 来移除数组中的前两个元素，并在对应的位置上添加 'DarkSalmon' 和 'BlanchedAlmond'。
function htmlColorNames(arr) {
  // 只修改这一行下面的代码
  arr.splice(0,2,'DarkSalmon','BlanchedAlmond')
  // 只修改这一行上面的代码
  return arr;
}
console.log(htmlColorNames(['DarkGoldenRod', 'WhiteSmoke', 'LavenderBlush', 'PaleTurquoise', 'FireBrick']));

7、使用 slice() 复制数组元素通过

slice() 不会修改数组，而是会复制，或者说*提取（extract）*给定数量的元素到一个新数组。 slice() 只接收 2 个输入参数：第一个是开始提取元素的位置（索引），第二个是提取元素的结束位置（索引）。 提取的元素中不包括第二个参数所对应的元素。

//利用 slice() 从输入的数组中提取信息，最终返回一个包含元素 warm 和 sunny 的新数组。
function forecast(arr) {
  return arr.slice(2,4);
}
console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms']));

8、使用展开运算符复制数组

ES6 中又引入了一个简洁且可读性强的语法：展开运算符（spread operator），它能让我们方便地复制数组中的所有元素。 展开语法写出来是这样："…" 。我们可以用展开运算符来复制数组：

let thisArray = [true, true, undefined, false, null];
let thatArray = [...thisArray];

//返回一个二维数组
function copyMachine(arr, num) {
  let newArr = [];
  while (num >= 1) {
    console.log(newArr.push([...arr]))
    num--;
  }
  return newArr;
}
console.log(copyMachine([true, false, true], 2));

9、使用展开运算符合并数组

展开语法（spread）的另一个重要用途是合并数组，或者将某个数组的所有元素插入到另一个数组的任意位置。 我们也可以使用 ES5 的语法连接两个数组，但只能让它们首尾相接。 而展开语法可以让这样的操作变得极其简单：

let thisArray = ['sage', 'rosemary', 'parsley', 'thyme'];
let thatArray = ['basil', 'cilantro', ...thisArray, 'coriander'];

//在指定位置合并数组
function spreadOut() {
  let fragment = ['to', 'code'];
  let sentence = ['learning',...fragment,'is','fun']; // 修改这一行
  return sentence;
}
console.log(spreadOut());

10、使用 indexOf() 检查元素是否存在

JavaScript 为我们提供了内置方法 indexOf()。 这个方法让我们可以方便地检查某个元素是否存在于数组中。 indexOf() 方法接受一个元素作为输入参数，并返回该元素在数组中的位置（索引）；若该元素不存在于数组中则返回 -1。

function quickCheck(arr, elem) {
  return arr.indexOf(elem) != -1 ? true : false
}
console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms'));

11、使用 for 循环遍历数组中的全部元素

使用数组时，我们经常需要遍历数组的所有元素来找出我们需要的一个或多个元素，抑或是对数组执行一些特定的操作。 JavaScript 为我们提供了几个内置的方法，它们以不同的方式遍历数组，以便我们可以用于不同的场景（如 every()、forEach()、map() 等等）。 然而，最简单的 for 循环不仅能实现上述这些方法的功能，而且相比之下也会更加灵活。

//遍历二维数组返回不包含elem的数组
function filteredArray(arr, elem) {
  let newArr = [];
  for(let i=0;i<arr.length;i++){
    if(arr[i].indexOf(elem) == -1){
      newArr.push(arr[i])
    }
  }
  console.log(newArr)
  return newArr;
}
console.log(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3));

12、创建复杂的多维数组

let myNestedArray = [
  // 只修改这一行下面的代码
  '第一层',
    ['第二层',['deep',['deeper',['deepest']]]]
  // 只修改这一行上面的代码
];

13、将键值对添加到对象中

对象（object）本质上是键值对（key-value pair）的集合。 或者说，一系列被映射到唯一标识符的数据就是对象；习惯上，唯一标识符叫做属性（property）或者键（key）；数据叫做值（value）。

//利用三种不同的方法向对象添加属性
let foods = {
  apples: 25,
  oranges: 32,
  plums: 28
};
foods.bananas = 13
foods['grapes'] = 35
const strawB = 'strawberries'
foods[strawB] = 27
console.log(foods);

14、修改嵌套在对象中的对象

在对象中，我们也可以嵌套任意层数的对象，对象的属性值可以是 JavaScript 支持的任意类型，包括数组和其他对象

let userActivity = {
  id: 23894201352,
  date: 'January 1, 2017',
  data: {
    totalUsers: 51,
    online: 42
  }
};
// 只修改这一行下面的代码
userActivity.data.online = 45
// 只修改这一行上面的代码
console.log(userActivity);

15、使用方括号访问属性名称

可以在一对方括号中用一个变量作为属性名来访问属性的值。

let foods = {
  apples: 25,
  oranges: 32,
  plums: 28,
  bananas: 13,
  grapes: 35,
  strawberries: 27
};
function checkInventory(scannedItem) {
  // 只修改这一行下面的代码
  return foods[scannedItem]
  // 只修改这一行上面的代码
}
console.log(checkInventory("apples"));

16、使用 delete 关键字删除对象属性通过

使用 delete 可以移除对象中指定的属性

let foods = {
  apples: 25,
  oranges: 32,
  plums: 28,
  bananas: 13,
  grapes: 35,
  strawberries: 27
};
// 只修改这一行下面的代码
delete foods.oranges
delete foods.plums 
delete foods.strawberries 
// 只修改这一行上面的代码
console.log(foods);

17、检查对象是否具有某个属性

如果我们想知道一个对象中是否包含某个属性呢？ JavaScript 为我们提供了两种不同的方式来实现这个功能： 一个是通过 hasOwnProperty() 方法，另一个是使用 in 关键字。 假如我们有一个 users 对象，为检查它是否含有 Alan 属性，可以这样写：

users.hasOwnProperty('Alan');
'Alan' in users;

let users = {
  Alan: {
    age: 27,
    online: true
  },
  Jeff: {
    age: 32,
    online: true
  },
  Sarah: {
    age: 48,
    online: true
  },
  Ryan: {
    age: 19,
    online: true
  }
};
function isEveryoneHere(userObj) {
  // 只修改这一行下面的代码
  //第一种利用hasOwnProperty()方法
  let isTrue =userObj.hasOwnProperty('Alan') && userObj.hasOwnProperty('Jeff') && userObj.hasOwnProperty('Sarah')&& userObj.hasOwnProperty('Ryan')  
  console.log(isTrue)
  if(isTrue){
    return true
  }else{
      return false
  }
  //第二种利用in关键字
  return ('Alan' in userObj && 'Jeff' in userObj && 'Sarah' in userObj && 'Ryan' in userObj)? true :false
  // 只修改这一行上面的代码
}
console.log(isEveryoneHere(users));

18、使用 for…in 语句遍历对象

如果我们想要遍历对象中的所有属性， 只需要使用 JavaScript 中的 for…in 语句即可

function countOnline(usersObj) {
  // 只修改这一行下面的代码
  let newArr = []
  for(let user in usersObj){
    if(usersObj[user].online){
      newArr.push(usersObj[user])
    }
  }
  return newArr.length
  // 只修改这一行上面的代码
}

19、使用 Object.keys() 生成由对象的所有属性组成的数组

我们可以给 Object.keys() 方法传入一个对象作为参数，来生成包含对象所有键的数组。 这会返回一个由对象中所有属性（字符串）组成的数组。 需要注意的是，数组中元素的顺序是不确定的。

let users = {
  Alan: {
    age: 27,
    online: false
  },
  Jeff: {
    age: 32,
    online: true
  },
  Sarah: {
    age: 48,
    online: false
  },
  Ryan: {
    age: 19,
    online: true
  }
};

function getArrayOfUsers(obj) {
  // 只修改这一行下面的代码
return Object.keys(obj)
  // 只修改这一行上面的代码
}

console.log(getArrayOfUsers(users));

20、修改存储在对象中的数组

let user = {
  name: 'Kenneth',
  age: 28,
  data: {
    username: 'kennethCodesAllDay',
    joinDate: 'March 26, 2016',
    organization: 'freeCodeCamp',
    friends: [
      'Sam',
      'Kira',
      'Tomo'
    ],
    location: {
      city: 'San Francisco',
      state: 'CA',
      country: 'USA'
    }
  }
};

function addFriend(userObj, friend) {
  // 只修改这一行下面的代码
  userObj.data.friends.push(friend)
  console.log(userObj.data.friends)
   return userObj.data.friends
  // 只修改这一行上面的代码
}
console.log(addFriend(user, 'Pete'));