002-ES6Class와 일반 구조 함수의 차이
function MathHandle(x, y) {
this.x = x
this.y = y
}
MathHandle.prototype.add = function () {
return this.x + this.y
}
var m = new MathHandle(1, 2)
typeof MathHandle // 'function'
MathHandle.prototype.constructor === MathHandle // true
m.__proto__ === MathHandle.prototype // true
ES6 class 다시 쓰기
class MathHandle {
constructor(x, y) {
this.x = x
this.y = y
}
add() {
return this.x + this.y
}
}
const m = new MathHandle(1, 2)
console.log(typeof MathHandle) // 'function'
console.log(MathHandle.prototype.constructor === MathHandle) // true
console.log(m.__proto__ === MathHandle.prototype) // true
위에서 알 수 있듯이 ES6의 class는 ES5 구조 함수의 문법 설탕일 뿐이다
ES5 단순 상속 구현
//
function Animal() {
this.eat = function () {
alert('Animal eat')
}
}
//
function Dog() {
this.bark = function () {
alert('Dog bark')
}
}
// ,
Dog.prototype = new Animal()
var hashiqi = new Dog()
hashiqi.bark()
hashiqi.eat()
ES6 상속 구현
class Animal {
constructor(name) {
this.name = name
}
eat() {
alert(this.name + ' eat')
}
}
class Dog extends Animal {
constructor(name) {
super(name) // !!!
this.name = name
}
say() {
alert(this.name + ' say')
}
}
const dog = new Dog(' ')
dog.say()// say
dog.eat()// eat
Class는 문법적으로 대상을 대상으로 하는 쓰기 방법에 더욱 부합된다. Class는 계승을 실현하고 더욱 읽기 쉽고 이해하기 쉬우며 자바 등 백엔드 언어의 사용 본질인지 문법 설탕인지 프로토타입을 사용한다.
2019-05-09
다음으로 전송:https://www.cnblogs.com/ccbest/p/10838988.html
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.