面试官:谈谈你对构造函数,原型的理解。我:面试造火箭,工作拧螺丝。

2021-02-24 11:34:04 浏览数 (1)

面试官:谈谈你对构造函数,原型的理解。我:面试造火箭,工作拧螺丝。

我们今天分步走,先把构造函数,以及所谓的原型先走通了,再来进行别的内容的讲解原型链。

我们平常都知道构造函数是什么,但是就是只是浅层的认识,知道怎么写,但是至于原型我们几乎是很陌生的。

构造函数

什么是构造函数呢?所谓构造,在 js 就是可以使用 new 操作的函数,其实与普通函数没有什么区别,只是我们约定构造函数的首字母必须大写,来区别构造函数与其他函数。

我们还是举个简单的例子来看看:

代码语言:javascript复制
function Person() {
  this.name = "Ken"
  this.hobby = "公众号-人生代码"
}
var person = new Person()
console.log(person.name, person.hobby)

constructor

是只构造函数创建实例对象时,此属性会指向该构造函数本身:

代码语言:javascript复制
function Person() {
  this.name = "Ken"
  this.hobby = "公众号-人生代码"
}
var person = new Person()
person.constructor === Person // true

可以看到实例对象的constructor指向了它的构造函数,而它和原型的关系我们在之后会链接到一起。

哪些基本数据类型或者函数有 constructor

代码语言:javascript复制
// 字符串
console.log('str'.constructor) // ƒ String() { [native code] }
console.log('str'.constructor === String) // true

// 数组
console.log([1,2,3].constructor) // ƒ Array() { [native code] }
console.log([1,2,3].constructor === Array) // true

// 数字
var num = 1
console.log(num.constructor) // ƒ Number() { [native code] }
console.log(num.constructor === Number) // true

// Date
console.log(new Date().constructor) // ƒ Date() { [native code] }
// 注意!!!不要混淆哦
console.log(new Date().getTime().constructor) // ƒ Number() { [native code] }

// Boolean
console.log(true.constructor) // ƒ Boolean() { [native code] }
console.log(true.constructor === Boolean) // true

// 自定义函数
function show(){
 console.log('yuguang');
};
console.log(show.constructor) // ƒ Function() { [native code] }

// 自定义构造函数,无返回值
function Person(){
 this.name = name;
};
var p = new Person()
console.log(p.constructor) // ƒ Person()

// 有返回值
function Person(){
 this.name = name;
 return {
  name: 'yuguang'
 }
};
var p1 = Person()
console.log(p1.constructor) // ƒ Object() { [native code] }

模拟实现一个 new

对象是 new 出来的,那到底发生了什么?

0 人点赞