javascript工廠模式和構造方法

時間 2021-01-03

標籤 css html java jquery jsp ide 函數 this htm 欄目 JavaScript 简体版

原文原文鏈接

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'test3.jsp' starting page</title>
    
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script src="js/jquery-2.1.1.min.js"></script>
    <script>
        //工廠模型
        function CreatePerson(id,name,age){
            var obj={};
            obj.id=id;
            obj.name=name;
            obj.age=age;
            obj.sayName=function(){
                return this.name;
            }
            return obj;
        } 
        var p1=CreatePerson(1,'zhangsan',23);
        //alert(p1.id);
        //alert(p1.sayName());
        
        
        
        //第二種方式：構造函數式,函數的第一個字母大寫(類的模板)
        
        function Person(id,name,age){
            this.id=id;
            this.name=name;
            this.age=age;
            this.sayName=function(){
                return this.name;
            }
        }
        //構造一個對象，new關鍵字，傳遞參數，執行模板代碼，返回對象
        var p2=new Person(1,'王五',45);
        var p3=new Person(2,'趙六',23); 
        //alert(p2.sayName());
        //alert(p2===p3);         //類的概念，根據模板建立出不一樣的對象
        alert(p2.constructor==Person);        //true
        alert(p3.constructor==Person);        //true
        alert(p2 instanceof Person);         //true
        alert(p2 instanceof Object);         //true
        
        //建立對象的方式
        //1.當作構造函數去使用
        //var p2=new Person(1,'王五',45);
        //2.普通方法的函數調用
        Person(2,'zhangsan',34);       //在全局環境定義屬性並複製，直接定義window對象上
        //在一個對象的做用域中調用
        var o=new Object();
        Person.call(o,2,'zhangsan',34);        //把Person方法綁定到o對象上
        alert(o.name);
    </script>
  </head>
  
  <body>
    This is my JSP page. <br>
  </body>
</html>