javascript 对象的创建

最新推荐文章于 2024-09-21 11:34:18 发布

大林在努力

最新推荐文章于 2024-09-21 11:34:18 发布

阅读量609

点赞数

分类专栏： javascript 文章标签： javascript 对象

本文链接：https://blog.csdn.net/hun_ying/article/details/15026477

版权

javascript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

【1】使用Object创建对象： var obj = new Object()
运用例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Object 应用</title>
<script type="text/javascript">
    var obj = new Object();
   
    obj.name = "linjianfeng";
    obj.favour = "music";
    obj.introduction = function(arg0){
        document.write(arg0);
    }
</script>
</head>
<body>
第一种object应用方法：<br><br>
<script type="text/javascript">
obj.introduction("lin_jianfeng");
</script>
</body>
</html>

【2】使用function创建对象模板
运用例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>学生信息处理--1</title>
<script type="text/javascript">
    function Student(name, age, pro)
    {
        this.name = name;
        this.age = age;
        this.pro = pro;
        this.showmessage = function()
        {
            alert("Welcome, "+name);
        }
    }
    function s()
    {
        var name = document.getElementById("name").value;
        var age = document.getElementById("age").value;
        var pro = document.getElementById("pro").value;
       
        var student = new Student(name, age, pro);
        student.showmessage();
    }
</script>
</head>
<body>
    <form>
        <label>姓名：</label>
        <input type="text" id="name" />
        <br/>
        <label>年龄：</label>
        <input type="text" id="age" />
        <br/>
        <label>专业：</label>
        <input type="text" id="pro" />
        <br/>
        <input type="submit" value="确定" onClick="s()" />
    </form>
</body>
</html>

【3】使用function构造函数和原型模式的结合形式（使用普遍的对象创建方式）
运用例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>学生信息处理--2</title>
<script type="text/javascript">
    function Student(name, age, pro)
    {
        this.name = name;
        this.age = age;
        this.pro = pro;
    }
    Student.prototype={
            constructor:Student,
            showmessage:function(name)
            {
                alert("Welcome, "+name);
            }
    }
   
    function s()
    {
        var name = document.getElementById("name").value;
        var age = document.getElementById("age").value;
        var pro = document.getElementById("pro").value;
       
        var s = new Student(name, age, pro);
        s.showmessage(name);
    }
</script>
</head>
<body>
    <form>
        <label>姓名：</label>
        <input type="text" id="name" >
        <br/>
        <label>年龄：</label>
        <input type="text" id="age" >
        <br/>
        <label>专业：</label>
        <input type="text" id="pro" >
        <br/>
        <input type="submit" value="确定" onClick="s()" >
    </form>
</body>
</html>

【*】使用 .js 文件：

用例： <script src="../js/s_object.js" type="text/javascript"></script>