JavaScript - 封装

首页 / JavaScript入门教程 / JavaScript - 封装

JavaScript封装是将数据(即变量)与作用于该数据的函数绑定在一起的过程。它使无涯教程能够控制数据并进行验证。在JavaScript中实现封装:-

  • 使用var关键字将数据成员设为私有。
  • 使用setter方法设置数据并使用getter方法获取数据。

封装可以使用以下属性来处理对象:

读/写    -  在这里,使用setter方法写入数据,而getter方法读取数据。

只读      -  在这种情况下,仅使用getter方法。

仅写      -  在这种情况下,仅使用setter方法。

JavaScript封装范例

看一个简单的封装示例,其中包含两个带有setter和getter方法的数据成员。

<script>
class Student
  {
    constructor()
    {
       var name;
       var marks;
    }
        getName()
        {
          return this.name;
        }
      setName(name)
      {
        this.name=name;
      }
      
      getMarks()
      {
        return this.marks;
      }
    setMarks(marks)
    {
      this.marks=marks;
    }

    }
    var stud=new Student();
     stud.setName("John");
     stud.setMarks(80);
     document.writeln(stud.getName()+" "+stud.getMarks());
</script>

输出:

John 80

示例1

在此示例中,验证学生的分数。

链接:https://www.learnfk.comhttps://www.learnfk.com/javascript/javascript-oops-encapsulation.html

来源:LearnFk无涯教程网

<script>
class Student{
    constructor()
    {
       var name;
       var marks;
    }
    getName()
    {
          return this.name;
    }
    setName(name)
    {
        this.name=name;
     }
      
    getMarks()
    {
        return this.marks;
    }
    setMarks(marks)
    {
        if(marks<0||marks>100)
        {
          alert("Invalid Marks");
        }
      else
        {
          this.marks=marks;
        }
    }
    }
    var stud=new Student();
     stud.setName("John");
     stud.setMarks(110);//alert() invokes
     document.writeln(stud.getName()+" "+stud.getMarks());
</script>

输出:

John undefined

示例2

在这里,无涯教程执行基于原型的封装。

<script>
function Student(name,marks)
{
  var s_name=name;
  var s_marks=marks;
  Object.defineProperty(this,"name",{
    get:function()
    {
      return s_name;
    },
  set:function(s_name)
  {
    this.s_name=s_name;
  }
  
});
 
    Object.defineProperty(this,"marks",{
    get:function()
    {
      return s_marks;
    },
  set:function(s_marks)
  {
    this.s_marks=s_marks;
  }
  
});
  
}
  var stud=new Student("John",80);
  document.writeln(stud.name+" "+stud.marks);
</script>

输出:

John 80

这一章《JavaScript - 封装》你学到了什么?在下面做个笔记吧!做站不易,你的分享是对我们最大的支持,感谢!😊

好记忆不如烂笔头。留下你的足迹吧 :)

猜你喜欢

人工智能基础课 -〔王天一〕

从0开始学架构 -〔李运华〕

Go语言核心36讲 -〔郝林〕

高楼的性能工程实战课 -〔高楼〕

无法从 React 表格​​行中的按钮触发 Modal

JavaScript递归函数返回奇怪的值

克隆 node 中的 innerText 不同

使用js过滤重复记录并使用附加条件推送到数组中

如何在javascript中将时区偏移量设为±hh:mm?

try 执行 XQuery 语句时出现错误

视频教程

JavaScript - 29-boolean以及undefined和null 更多视频教程 »