一、对象创建引发构造函数产生
1.1 创建对象三种方式:
- 利用对象字面量创建对象
const obj = {
name: '佩奇'
}
注:对象字面量的由来:即它是直接由字面形式(由源代码直接)创建出来的对象,而不是通过构造函数或者方法间接构成的,所以就叫做对象字面量。
- 利用 new Object 创建对象
// 两种添加属性的方式
// const obj = new Object()
// obj.uname = '哈哈哈哈'
// console.log(obj);
const obj = new Object({
uname: '哈哈哈哈' })
console.log(obj);
注:当使用Object时,实际上是调用了js内置的一个构造函数并且通过new关键字来创建一个新的对象。
3. 利用构造函数创建对象 往下看。。。。。
1.2 构造函数
构造函数定义:就是一个函数,用来创建快速多个类似的对象,将多个对象的公共属性封装在一个函数里
注意:创建对象的时候首字母大写;使用函数创建对象通过new关键字操作符。
//创建一个猪猪 构造函数
function Pig (uname, age) {
this.unmae = uname
this.age = age
}
// 通过new关键字调用函数
// 实例化构造函数
// console.log(new Pig('佩奇', 6))
const p = new Pig('佩奇', 6)
console.log(p);
另外:同new Object()、 new Date() 一样都是实例化构造函数,js内置了Date、Object构造函数,然后通过new关键字实现实例化函数,最后实现实例化对象
const date = new Date('2021-3-4')
console.log(date);
function Goods (name, price, count) {
this.nam = name
this.price = price
this.count = count
}
const mi = new Goods('小米', 1999, 20)
console.log(mi)
const hw = new Goods('华为', 1999, 50)
console.log(hw)
总结:
1.new关键字调用函数的行为被称为实例化
2.构造函数无return,构造函数自动返回构建的新的对象。
什么时候需要return?就是函数比起输出结果,将返回结果给其他程序,然后程序使用这个结果做其他事情更重要的时候。这个具体见小编的 js——函数篇。
3.实例化构造函数时没有参数时可以省略 ()
实例化执行过程
①构造函数先调用,加上new,立刻创建一个空对象 ②this指向空对象
③执行构造函数代码,利用this,添加属性.(具体是通过形参传入实参, this指向新对象,新对象添加一个name属性
这样实参通过形参就传入到了对象中 生成了对象属性 对象也有了 属性也有了 ,构造函数就会自动返回一个新的对象 返回的新对象 由new Pig接收。)
④.返回新对象
1.3 实例成员 静态成员
实例成员
通过构造函数创建的对象称为实例对象;
实例对象中的属性和方法称为实例成员 (实例属性 实例方法)
下面举一个不含有参数的利用构造函数创建实例对象:
function Pig () {
this.name = '佩奇'
this.sayHi = function () {
console.log('你好')
}
}
const p = new Pig()
console.log(p.name)
p.sayHi()
注:
- 实例对象的属性和方法即为实例成员
- 为构造函数传入参数,动态创建结构相同但值不同的对象
- 构造函数创建的实例对象彼此独立互不影响
静态成员
构造函数的属性和方法被称为静态成员 静态成员只能构造函数访问。
function Person () {
// 省略实例成员
}
// 静态属性
Person.eyes = 2
Person.arms = 2
// 静态方法
Person.walk = function () {
console.log('人嗯呢')
console.log(this.eyes)
}
new Person()
console.log(Person.eyes)
console.log(Person.arms)
// 死记硬背:遇到方法一定要想到需要调用 并且不用打印调用 方法里面有结果的输出
// console.log(Person.walk);//错误
Person.walk()
说明:
- 构造函数的属性和方法被称为静态成员
- 一般公共特征的属性或方法静态成员设置为静态成员
- 静态成员方法中的 this 指向构造函数本身
二、内置构造函数
一切皆对象
我发现因为构造函数的存在,所以都可以new出来一个实例对象
主要的数据类型有6种:
基本数据类型:字符串、数值、布尔、undefined、null
引用数据类型:对象、数组等。
字符串.Length
// const str = 'pink'
// // 有属性
// console.log(str.length)
// const num = 12
// // 有方法
// console.log(num.toFixed(2));
// js底层完成 把简单数据类型包装成了引用数据类型
// const str = new String('pink')
为什么任何数据都有属性和方法?
原理:其实在js的底层 将字符串类似转化为了对象,也就存在了属性和方法
基本包装类型就是基本数据类型包装成了复杂数据类型
实字符串、数值、布尔、等基本类型也都有专门的构造函数,这些我们称为包装类型。
JS中几乎所有的数据都可以基于构成函数创建
包装类型
String,Number,Boolean 等基本数据类型
2.1 Object
Object 是内置的构造函数,用于创建普通对象。
使用 Object 创建对象
const aa = new Object({
uname: '哈哈', age: 18 })
console.log(aa);
三个常用静态方法(静态方法就是只有构造函数可以调用的,在这里是只有Object可以调用的)
const o = {
uanme: 'pink', age: 18 }
// 1.Object.keys 静态方法获取对象中所有属性(键) 返回数组
console.log(Object.keys(o))
// 2.Object.values 静态方法获取对象中所有属性值 返回数组
console.log(Object.values(o))
// 3.Object. assign 静态方法常用于对象拷贝 经常使用的场景给对象添加属性
const oo = {
}
Object.assign(oo, o)
console.log(oo)
// 通过Object给对象添加属性
Object.assign(o, {
gender: '女' })
console.log(o)
console.log(Object.keys(o));
2.2 Array
Array 是内置的构造函数,用于创建数组
const arr = new Array(3, 5)
console.log(arr);
创建数组建议使用字面量创建,不用 Array构造函数创建
数组常见实例方法:
数组中的reduce方法:
这里不知道大家会不会有个问题,为什么function函数没有被调用呢,就能够返回值,这是因为数组中的reduce方法是js内置函数自定义的方法,不需要我们返回,由内部操作,我们只需要知道function被当做参数传入的时候是回调函数,最后返回的结果用一个变量来接收即可。
// 数组reduce方法 两个参数 回调函数 初始值
// arr.reduce(function (上一次值,当前值) { }, 初始值)
const arr = [1, 5, 7]
// 1.没有初始值
const total = arr.reduce(function (prev, current)