JS-数组、函数、类与对象

JS进阶

数组

数组可以存放任意类型的元素

let arr = ['小胖',12,true,28.9];
console.log(arr, arr.length);

• 删
  不会改变数组的长度, 使用undefined赋值
  delete arr[4];

• 多维数组

var arr = [1, 2, ['xiaopang', '小胖']];
console.log(arr[2][1]);

函数

// 函数声明
function 函数名(x, y) {
    //函数体代码
    return z;
}
// 调用函数
函数名(x, y);
 
// 函数表达式
var myFunction = function(a, b) {
  return a + b;
};
 
console.log(myFunction(1, 2)); // 输出: 3

类与对象

1. 类的定义

class Person {
 
}
 
var p = new Person();
console.log(typeof p); // object

2. 构造函数
   constructor()方法用于传递参数, 返回实例对象.
   通过new命令生成对象时自动调用, 若没有, 会自动创建

class Person {
	constructor(uname, age) {
		this.uname = uname;
		this.age = age;
	}
}
 
var stu = new Student('xiaoming', 20);

3. 类的方法

class Person {
	constructor(uname, age) {
		this.uname = uname;
		this.age = age;
	}
	p_sing() {
		console.log('唱')
	}
}
 
var kun = new Person('kunkun', 20);
kun.p_sing();

创建对象

1. class关键字（ES6）

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  
  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
}
 
let person = new Person('Alice', 30);

2. 对象字面量（Object Literal）

// 创建一个简单的对象
let person = {
  firstName: 'John',
  lastName: 'Doe',
  age: 30,
  sayHello: function() {            // sayHello() {
    console.log(`Hello, my name is ${this.firstName} ${this.lastName}`);
  }
};
 
// 使用对象的方法
person.sayHello(); // 输出: Hello, my name is John Doe

3. new关键字和构造函数

// 定义一个构造函数
function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.displayInfo = function() {
    console.log(`${this.year}${this.make} ${this.model}`);
  };
}
 
// 使用构造函数创建对象
let myCar = new Car('Toyota', 'Corolla', 2020);
 
// 调用对象的方法
myCar.displayInfo(); // 输出: 2020 Toyota Corolla

4. Object.create()方法

// 定义一个原型对象
let animalProto = {
  makeSound: function() {
    console.log(`${this.name} makes a sound.`);
  }
};
 
// 使用Object.create()创建对象
let myAnimal = Object.create(animalProto);
myAnimal.name = 'Dog';
 
// 调用对象的方法
myAnimal.makeSound(); // 输出: Dog makes a sound.

5. 工厂函数

function createPerson(name, age) {
  return {
    name: name,
    age: age,
    sayHello: function() {
      console.log(`Hello, my name is ${this.name}`);
    }
  };
}
 
let person = createPerson('Alice', 30);
 

6. 原型模式

function Person(name, age) {
  this.name = name;
  this.age = age;
}
 
Person.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}`);
};
 
let person = new Person('Alice', 30);
 

7. 模块模式

let person = (function() {
  let name = 'Alice';
  let age = 30;
 
  return {
    getName: function() {
      return name;
    },
    getAge: function() {
      return age;
    }
  };
})();
 

8. Object.assign()方法

let parent = {
  sayHello: function() {
    console.log('Hello');
  }
};
 
let child = Object.assign({}, parent, { name: 'Alice' });
 

内置对象

• Math对象

方法名	功能
Math.floor()	向下取整
Math.max()/Math.min()	求最大和最小值
Math.random()	获取范围在[0,1)内的随机值

• Date对象

方法名	功能
getFullYear()	获取年份
getMonth()	获取月份(0~11)
getDate()	获取日期(1~31)
getDay()	获取星期(0~6)
getHours()	获取小时
getMinutes()	获取分钟
getSeconds()	获取秒

• 字符串对象

方法名	功能
chatAt()	返回在指定位置的字符
charCodeAt()	返回在指定位置字符的unicode编码(ASCII编码)
concat()	连接字符串
indexOf()	从字符串的开头向后搜索字符串
lastIndexOf()	从字符串的末尾向前搜索字符串
match()	找到一个或多个正则表达式的匹配
replace()	替换与正则表达式匹配的字串
search()	检索与正则表达式相匹配的值
slice()	提取字符串的片段，并在新的字符串中返回被提取的部分
split()	把字符串分割成字符串数组
substr()	从起始索引号提取字符串中指定数目的字符
substring()	截取字符串中两个指定的索引号之间的字符
toLowerCase()	将字符串转换为小写
toUpperCase()	将字符串转换为大写
toString()	返回字符串本身
valueOf()	返回某个对象的原始值
trim()	删除前置及后缀的所有空格

• 数组对象

方法名	功能	返回值	是否改变原数组
push()	在末尾添加元素	新数组的长度	Y
unshift()	在开头添加元素	新数组的长度	Y
pop()	删除最后一个元素	删除的元素的值	Y
shift()	移除第一项	删除的元素的值	Y
reverse()	反转数组中的元素	反转后数组	Y
sort()	以字母顺序(字符串Unicode码点)对数组进行排序	新数组	Y
splice()	在指定位置删除指定个数元素再增加任意个数元素	返回删除的数据所组成的数组	Y
fill()	用给定值填充一个数组	新数组	Y
concat()	通过合并（连接）现有数组来创建一个新数组	合并之后的数组	N
join()	用特定的字符,将数组拼接形成字符串 (默认",")	拼接后的字符串	N
slice()	裁切指定位置的数组	被裁切的元素形成的数组	N
toString()	将数组转换为字符串	字符串	N
valueOf()	查询数组原始值	数组的原始值	N
indexOf()	查询某个元素在数组中第一次出现的位置	存在该元素,返回下标,不存在 返回 -1	N
lastIndexOf()	反向查询数组某个元素在数组中第一次出现的位置	存在该元素,返回下标,不存在 返回 -1	N
forEach()	(迭代) 遍历数组,每次循环中执行传入的回调函数	无/(undefined)	N
map()	(迭代) 遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组	有/自定义	N
filter()	(迭代) 遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中	满足条件的元素组成的新数组	N
every()	(迭代) 判断数组中所有的元素是否满足某个条件	全都满足返回true 只要有一个不满足 返回false	N
some()	(迭代) 判断数组中是否存在,满足某个条件的元素	只要有一个元素满足条件就返回true,都不满足返回false	N
reduce()	(归并)遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中	最终操作的结果	N
reduceRight()	(归并)用法同reduce,只不过是从右向左	同reduce	N
includes()	判断一个数组是否包含一个指定的值.	是返回 true，否则false	N
Array.from()	接收伪数组,返回对应的真数组	对应的真数组	N
find()	遍历数组,执行回调函数,回调函数执行一个条件,返回满足条件的第一个元素,不存在返回undefined	满足条件第一个元素/否则返回undefined	N
findIndex()	遍历数组,执行回调函数,回调函数接受一个条件,返回满足条件的第一个元素下标,不存在返回-1	满足条件第一个元素下标,不存在=>-1	N
flat()	用于将嵌套的数组“拉平”，变成一维的数组。	返回一个新数组	N
flatMap()	flat()和map()的组合版 , 先通过map()返回一个新数组,再将数组拉平( 只能拉平一次 )	返回新数组	N

• JSON对象

方法名	功能	返回值
JSON.parse(str)	将JSON字符串转换成JS对象	JS对象
JSON.stringify(obj, null, 2)	将 JS 对象转换为 JSON 字符串	JSON字符串