Все о прототипе JavaScript .. Эволюция ключевых слов new, this и class в JavaScript….
JavaScript - это язык, основанный на прототипах. Еще один способ JavaScript - это функциональный язык программирования, а функция сама по себе является объектом. Я пытаюсь прояснить то, что в JavaScript практически невозможно мыслить без объекта. Концепция прототипа связана с объектом JavaScript. После Object, прототип - это самая важная вещь, которую нужно знать в JavaScript, если вы хотите испытывать к нему любовь.
Давай займемся программированием. О прототипе узнаем позже ».
const person={
name:"Rayhan",
age:10,
height: 5
}
const student = Object.create(person);
console.log(student) //{}
console.log(student.name) //Rayhan
Что мы наделали ? 😦 Очень просто. Мы создали объект под названием «человек». Затем мы создали другой объект с именем «student» методом «Object.create ()» с помощью объекта «person». Итак, мы можем сказать, что «студент» - это дочерний объект «человека». Затем мы сделали «console.log (student.name)» и получили результат, который является свойством объекта «person»! 😮😮. Как? 🤔 Мы создали объект под названием student, в котором не определяли никаких свойств. Итак, «студент» должен быть пустым объектом. Тогда как мы можем получить от него собственность? 🤔 Ответ таков: это стало возможным благодаря прототипу. Я имею в виду, что доступ к собственности родителей у ребенка был возможен по прототипу. Это простая концепция прототипа.
Давайте посмотрим еще несколько примеров:
const methodOfProgrammer={
coding(){
console.log("I am coding")},
debugging(){
console.log("I am Debugging problem")},
sleep(){
console.log("Problem is solved. Sleeping")},
}
function Programmer(name,programmingLanguage){
let programmer = Object.create(methodOfProgrammer);
programmer.name=name;
programmer.age=age;
return programmer;
}
const kabir = Programmer("Kabir","JavaScript");
kabir.coding() // I am coding
«Прототип - это свойство функции, указывающей на объект».
В этом случае мы использовали внешний объект для методов в функции «программист». Теперь мы хотим использовать методы из функции «программист», а не из внешних источников. Для этого воспользуемся свойством prototype функции программиста. Давай сделаем это:
function Programmer(name,programmingLanguage){
let programmer = Object.create(programmer.prototype);
programmer.name=name;
programmer.age=age;
return programmer;
}
Programmer.prototype={
coding(){
console.log("I am coding")},
debugging(){
console.log("I am Debugging problem")},
sleep(){
console.log("Problem is solved. Sleeping")},
}
const kabir = Programmer("Kabir","JavaScript");
const sabbir = Programmer("Sabbir","python");
kabir.coding(); // I am coding
Бум! Ву! это работает😀!
Что это означает? Это означает, что «Программист» - это функция, которая имеет свойство, называемое прототипом, которое указывает на объект, и с помощью прототипа дочерний элемент может получить доступ к свойству своего родителя. Это наследование родительского свойства его дочернему элементу в JavaScript стало возможным благодаря концепции прототипа, но в других языках эта работа выполняется «классом». По этой причине JavaScript отличается от других языков.
Это конец того, что есть прототип. Теперь мы подробнее рассмотрим прототип.
На данный момент мы узнали следующее:
- «Программист» - это функция-конструктор, потому что с ее помощью мы создали объекты. Поскольку он построил объект, по этой причине он является конструктором. В JavaScript все функции являются конструкторами. По соглашению имя функции-конструктора должно быть указано с заглавной буквы.
- Как мы можем добавить метод в прототип функции-конструктора.
- Как мы можем взять свойство родительского элемента в дочернем с помощью метода Object.create ()
Что мы наконец сделали? Мы разделили общие методы функции конструктора за прототипом в экземплярах такой функции конструктора, как «kabir», «sabbir».
Давайте упростим мое «новое» ключевое слово:
function Programmer(name,programmingLanguage){
let programmer = Object.create(programmer.prototype);
programmer.name=name;
programmer.age=age;
return programmer;
}
Programmer.prototype={
coding(){
console.log("I am coding")},
debugging(){
console.log("I am Debugging problem")},
sleep(){
console.log("Problem is solved. Sleeping")},
}
const kabir = Programmer("Kabir","JavaScript");
const sabbir = Programmer("Sabbir","python");
kabir.coding(); // I am coding
--------------------------------------------------------------------
function Programmer(name,programmingLanguage){
this.name=name;
this.age=age;
}
Programmer.prototype={
coding(){
console.log("I am coding")},
debugging(){
console.log("I am Debugging problem")},
sleep(){
console.log("Problem is solved. Sleeping")},
}
const kabir = new Programmer("Kabir","JavaScript");
const sabbir = new Programmer("Sabbir","python");
kabir.coding(); // I am coding
Вы заметили что-нибудь другое во втором примере ?? 🤔🤔
Обратите внимание, что мы пропустили две строки из функции конструктора Programmer.
Когда мы используем новое ключевое слово, JavaScript сам создает объект this с помощью
let this = Object.create (programmer.prototype);
вместо
let programmer = Object.create (programmer.prototype);
И Return
вернет это;
вместо
return programmer;
Разве это не облегчило тебе жизнь? ...
Теперь давайте узнаем ключевое слово «class», которое было введено в 2016 году ES6. Если мы используем ключевое слово «class», то мы можем опустить часть «Programmer.prototype», также имеющую ту же функциональность. Давай сделаем это:
function Programmer(name,programmingLanguage){
this.name=name;
this.age=age;
}
Programmer.prototype={
coding(){
console.log("I am coding")},
debugging(){
console.log("I am Debugging problem")},
sleep(){
console.log("Problem is solved. Sleeping")},
}
const kabir = new Programmer("Kabir","JavaScript");
const sabbir = new Programmer("Sabbir","python");
kabir.coding(); // I am coding
--------------------------------------------------------------------
class Programmer{
constructor(name,age){
this.name=name;
this.age=age;
}
coding(){
console.log("I am coding")
}
debugging(){
console.log("I am Debugging problem")
}
sleep(){
console.log("Problem is solved. Sleeping")
}
}
const kabir = new Programmer("Kabir","JavaScript");
const sabbir = new Programmer("Sabbir","python");
kabir.coding(); // I am coding
Ву! Теперь завершили большое путешествие. От прототипа к классу. На сегодня все о прототипе.
Ой! Ждать. Вы когда-нибудь думали, что «Массив» также является функцией (не путайте. Функция также является объектом в JavaScript 😀), у которой есть свойство, называемое прототипом, в котором определены методы push, pop, filter, map и т. Д., И массив, который мы определить в повседневной жизни не что иное, как дочерний элемент функции «Массив»? По этой причине мы можем использовать методы push, pop, map в нашем массиве определения повседневной жизни. Смущенный? 🤔 Не могли бы вы открыть редактор кода и сделать «console.log (Array.prototype)»? Дайте мне знать, что вы видите ……
Спасибо………
