【JavaScript】学习理解prototype原型时的一些代码片段

感谢传播知识的小天使，帮助我很好的理解了原型：

http://www.cnblogs.com/yjf512/archive/2011/06/03/2071914.html

http://www.cnblogs.com/thonrt/p/5900510.html

记录一下过程中敲的代码片（包含一点点继承）：

"use strict";
/*
/----------001----------/
function People(name)
{
  this.name=name;
  //对象方法
  this.Introduce=function(){
    console.log("My name is "+this.name);
  }
}
//类方法
People.Run=function(){
  console.log("I can run");
}
//原型方法
People.prototype.IntroduceChinese=function(){
  console.log("我的名字是"+this.name);
}
//测试
var p1=new People("Windking");
p1.Introduce();
console.log(p1.name);
People.Run();
p1.IntroduceChinese();



/----------002----------/
function baseClass(){
  this.showMsg = function(){
      console.log("baseClass::showMsg");   
  }
  this.baseShowMsg = function(){
    console.log("extendClass::showMsg");
  }
}
baseClass.showMsg = function(){
  console.log("baseClass::showMsg static");
}
function extendClass()
{
  this.showMsg =function (){
      console.log("extendClass::showMsg");
  }
}
extendClass.showMsg = function(){
  console.log("extendClass::showMsg static")
}


extendClass.prototype = new baseClass();
var instance = new extendClass();
instance.showMsg(); //extendClass::showMsg
instance.baseShowMsg(); //extendClass::showMsg
baseClass.showMsg.call(instance); //baseClass::showMsg static
var baseinstance = new baseClass(); 
baseinstance.showMsg.call(instance);  //baseClass::showMsg


/----------003----------/
function UrlSearch() {
  var name,value;
  var str="http://baidu.com?sessionId=e2bef1107be42c7320c13b15550c8c60&bodyId=11640&productId=2017092101"
  var num=str.indexOf("?")
  str=str.substr(num+1); 
  var arr=str.split("&"); //各个参数放到数组里
  for(var i=0;i < arr.length;i++){
    num=arr[i].indexOf("=");
    if(num>0){
      name=arr[i].substring(0,num);
      value=arr[i].substr(num+1);
      this[name]=value;
    }
  }
}
var Request=new UrlSearch(); 
console.log(Request)


/----------004----------/
function shape(){
  this.type="shape";
  this.getType=function(){
    return("triangle")
  }
}
shape.prototype.getPerimeter = function(){
  var length = this.length;
  var width = this.width;
  var height = this.height;
  return length+width+height;
}
Triangle.prototype = new shape();
Triangle.prototype.constructor = Triangle;
function Triangle(a,b,c){
  this.length = a;
  this.width = b;
  this.height = c;
};

var t = new Triangle(1,2,3);
console.log(t.constructor === Triangle);
console.log(shape.isPrototypeOf(t));
console.log(t.getPerimeter());
console.log(t.getType());
console.log(t);


/----------005----------/
var Person = function(name){  
   this.name = name ;  
};  
var p = new Person("reamd");  

console.log('01 ', Person.__proto__ === Function.prototype);  //true 
console.log('02 ', Object.__proto__ === Function.prototype); // true 
console.log('03 ', Function.__proto__ === Function.prototype); //true
console.log('04 ', typeof p.__proto__);    //objcect  
console.log('05 ', typeof Object.__proto__)//function
console.log('06 ', p.__proto__.__proto__ === Object.prototype); //true 
console.log('07 ', Function.prototype.__proto__ === Object.prototype); //true  
console.log('08 ', Object.prototype.__proto__); //null  
console.log('09 ', p.__proto__ === Person.prototype)//true
console.log('10 ',p.constructor)//function(name)
console.log('11 ',Person.constructor) //Functiion()
console.log('12 ',Function.constructor)//Functiion()
console.log('13 ',Object.constructor) //Functiion()
console.log('14 ',p.__proto__.constructor)//function(name)
console.log('15 ',Person.prototype.constructor) //function(name)
console.log('16 ',Function.prototype.constructor) //Function()
console.log('17 ',Object.prototype.constructor) //Object()


/----------006----------/
class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}

class Square extends Polygon {
  constructor(sideLength) {
    super(sideLength, sideLength);
  }
  get area() {
    return this.height * this.width;
  }
  set sideLength(newLength) {
    this.height = newLength;
    this.width = newLength;
  }
}

var square = new Square(2);
console.log(square.area);
square.sideLength = 8;
console.log(square.area);


/----------007----------/
class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    static distance(a, b) {
        const dx = a.x - b.x;
        const dy = a.y - b.y;
        return Math.hypot(dx, dy);
    }
    calcArea() {
        return this.x * this.y;
    }
}

const p1 = new Point(5, 5);
const p2 = new Point(10, 10);
console.log(Point.distance(p1, p2));
//console.log(p1.distance(p1, p2)); //报错，调用静态方法不需要实例化
console.log(p1.calcArea());
console.log(Point.distance({x:1,y:2}, {x:2,y:3}));


/----------008----------/
function Person(name,age){
  this.name = name;    
  this.age = age;
}
Person.prototype.sayHello = function(){   
  console.log(this.name +" say hello");
}
var boy = new Person("bella",23);    
boy.sayHello(); // bella say hello
var girl = new Person("girl",22);    
girl.sayHello(); // bella say hello
console.log(girl.sayHello === boy.sayHello);