夜光带你走进JavaScript（四十九）擅长的领域

GeniusTeam-夜光

于 2019-11-14 08:48:07 发布

阅读量136

点赞数

分类专栏： Genius-JavaScript

本文链接：https://blog.csdn.net/weixin_41987706/article/details/102623746

版权

Genius-JavaScript 专栏收录该内容

59 篇文章 2 订阅

订阅专栏

夜光序言：

和你分手，不需要甚么理由和借口，只是已经对你没有感觉了

正文：

使用对象构造器

举个例子~~

使用函数来构造对象：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>夜光</title>
</head>
<body>

<script>
    function person(firstname,lastname,age,eyecolor){
        this.firstname=firstname;
        this.lastname=lastname;
        this.age=age;
        this.eyecolor=eyecolor;
    }
    myFather=new person("001","000",1111,"blue");
    document.write(myFather.firstname + " is " + myFather.age + " years old.");
</script>

</body>
</html>

把方法添加到 JavaScript 对象

方法只不过是附加在对象上的函数。

在构造器函数内部定义对象的方法：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>夜光</title>
</head>
<body>
<script>
    function person(firstname,lastname,age,eyecolor){
        this.firstname=firstname;
        this.lastname=lastname;
        this.age=age;
        this.eyecolor=eyecolor;
        this.changeName=changeName;
        function changeName(name){
            this.lastname=name;
        }
    }
    myMother=new person("001","000",1111,"green");
    myMother.changeName("Genius Team");
    document.write(myMother.lastname);
</script>

</body>
</html>

JavaScript 类

JavaScript 是面向对象的语言，但 JavaScript 不使用类。

在 JavaScript 中，不会创建类，也不会通过类来创建对象（就像在其他面向对象的语言中那样）。

JavaScript 基于 prototype，而不是基于类的。

JavaScript for...in 循环

JavaScript for...in 语句循环遍历对象的属性。

语法

for (variable in object)
{
    执行的代码……
}

嗯唔：for...in 循环中的代码块将针对每个属性执行一次。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>夜光</title>
</head>
<body>

<p>嗯唔：点击下面的按钮，循环遍历对象 "person" 的属性</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
    function myFunction(){
        var x;
        var txt="";
        var person={fname:"Genius",lname:"Team",age:1111};
        for (x in person){
            txt=txt + person[x];
        }
        document.getElementById("demo").innerHTML=txt;
    }
</script>

</body>
</html>