js，在类里写个getPrice函数怎么变成赋值的了

问题遇到的现象和发生背景
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
</head>
<body>
    <script type="text/javascript">
        
        Product =function(name,price){
            this.name=name;
            this.price=price;

            this.getPrice =function(){
                return this.price;
            }
        }

        var apple=new Product('苹果',5);
        var p=apple.getPrice;
        alert(p)//

        //给类动态的扩展getName()函数
        Product.prototype.getName =function(){
            return this.name
        }

        var name=apple.getName;
        alert(name)
    </script>
</body>
</html>

img

img

问题相关代码，请勿粘贴截图
运行结果及报错内容
我的解答思路和尝试过的方法
我想要达到的结果

你好，不知道是否希望的是输出名字和价格，而非函数？是的话，参考下图

img

img