Similar to Prototype.js learning_prototype

As a successful open source framework for JavaScript, Prototype.js encapsulates many useful functions. Although the official document does not provide any, a search on Google revealed a lot of related documents. However, I still encountered it in the process of learning to use it. I have come up with some questions. I hope familiar friends can give me more advice. I pay attention to these points when learning prototype.js. At the same time, I also talk about the learning results and problems encountered for each point. ^_^
1. Creation of classes
prototype.js has been encapsulated, this is very simple.

var Person=Class.create();

This creates a Person class, which must provide the implementation of the initialize method:

Person.prototype={
              initialize:function(){
                                                                                                                                                                                          , can be customized as parameterized.
You can see that after defining a class in this way, it is clearly different from JavaScript's original method of defining a class through function. In this case, we can use Class.create to define the class. Use function to define functions directly.
Classes usually also involve the definition of static members (static in nature) and instance members (which need to be instantiated before they can be called).
This is also very easy in JavaScript:
Static members:

var Person={
name:'person',
getName:function(){return 'person' }
        };
The Person.getName above can be called directly, but the eat method needs to be called through var person=new Person();person.eat();.
2. Class inheritance
Class inheritance is actually supported by JavaScript itself, but prototype provides another method.
According to the implementation supported by javascript:

var Student=Class.create();
Student.prototype=new Person();

In this way, Student inheritance to Person.
This can be achieved when using prototype:

var Student=Class.create();
Object.extend(Student.prototype,Person.prototype);
Subclasses need to When adding methods, you can use
Student.prototype.study=function(){};
or
Object.extend(Student.prototype,{
study:function(){}
} );

3. Event mechanism (monitoring and observation of class method execution)
I have encountered some doubts about the event mechanism. As an event mechanism, it mainly needs to provide the definition of events, the monitoring of events and Observation of events.
In JavaScript, events need to start with on, that is, as events, they need to be named like onclick:
Add an external event to the above Student, such as:

Student.prototype. study=function(){
This.onstudy();
}
Student.prototype.onstudy=function(){};
This onstudy is implemented by the corresponding instance, for example The example uses this method:
function studyThis(){
alert("study this");
}
var student=new Student();
student.onstudy=studyThis() ;
We usually want to monitor and observe events. Based on the bindAsEventListener and Observe provided by prototype, we tried this:
study.onstudy=watchStudy.bindAsEventListener(this);
function watchStudy(event){
alert("watch study");
}

According to the event mechanism, when executing study, you should be able to see two prompts: study this and watch study, but after the final execution, only I can see watch study prompts, why is this? According to the concept of listener, the original method should not be overwritten. However, I looked at the source code of prototype.js and found that the original method will indeed be overwritten according to the above writing method.
Observe tried this:
Event.observe(study,'study',watchStudy,false);
According to the observation mechanism, you should see two prompts when executing study, but After the final execution, this line had no effect at all.
Why is this?