面向对象-(计数器,矩形)

本文介绍了一个使用JavaScript实现的图形渲染方法,通过构造函数和原型链定义了一个矩形元素,并详细展示了如何设置其样式和位置,将其添加到指定的DOM元素中。此外,还提供了一个计算器类实例,采用链式调用方式执行数学运算,简化了操作流程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

// html
<div id="main"></div>

// js

function Rect (options) {
  this._init(options)
}
Rect.prototype = {
  // 属性
  _init: function (options) {
    // 父标签
    this.parentId = options.parentId
    // 位置
    this.left = options.left || 100
    this.top = options.top || 100
    // 自身的属性
    this.width = options.width || 100
    this.height = options.height || 50
    this.bgColor = options.bgColor || '#000'
    this.borderRadius = options.borderRadius || 0
    this.border = options.border || 'none'
  },

  // 行为
  render: function () {
    // 1.获取父标签
    var parentEle = document.getElementById(this.parentId)
    // 2.创建 矩形标签
    var ele = document.createElement('div')
    parentEle.appendChild(ele)

    ele.style.position = 'absolute'
    ele.style.left = this.left + 'px'
    ele.style.top = this.top + 'px'

    ele.style.width = this.width + 'px'
    ele.style.height = this.height + 'px'

    ele.style.backgroundColor = this.bgColor
    ele.style.border = this.border
    ele.style.borderRadius = this.borderRadius + 'px'
  }
}

var rect = new Rect({
  parentId: 'main',
  width: 500,
  height: 300,
  bgColor: 'pink'
})
// console.log(rect)
rect.render()

 计时器 (函数链式调动)

var Caculator = {
        result: 0,
        jia: function (num) {
            this.result += num;
            return this;
        },
        jian: function (num) {
            this.result -= num;
            return this;
        },
        cheng: function (num) {
            this.result *= num;
            return this;
        },
        chu: function (num) {
            this.result /= num;
            return this;
        },
        log: function () {
            console.log(this.result);
            return this;
        },
        clean: function () {
            this.result = 0;
            return this;
        }
    };
    // (6 + 6) * 2 / 3
    Caculator.jia(6).jia(6).cheng(2).chu(3).log();
    Caculator.clean().jia(2).log();

 

转载于:https://www.cnblogs.com/musi03/p/10361951.html

内容概要:本文探讨了在MATLAB/SimuLink环境中进行三相STATCOM(静态同步补偿器)无功补偿的技术方法及其仿真过程。首先介绍了STATCOM作为无功功率补偿装置的工作原理,即通过调节交流电压的幅值和相位来实现对无功功率的有效管理。接着详细描述了在MATLAB/SimuLink平台下构建三相STATCOM仿真模型的具体步骤,包括创建新模型、添加电源和负载、搭建主电路、加入控制模块以及完成整个电路的连接。然后阐述了如何通过对STATCOM输出电压和电流的精确调控达到无功补偿的目的,并展示了具体的仿真结果分析方法,如读取仿真数据、提取关键参数、绘制无功功率变化曲线等。最后指出,这种技术可以显著提升电力系统的稳定性与电能质量,展望了STATCOM在未来的发展潜力。 适合人群:电气工程专业学生、从事电力系统相关工作的技术人员、希望深入了解无功补偿技术的研究人员。 使用场景及目标:适用于想要掌握MATLAB/SimuLink软件操作技能的人群,特别是那些专注于电力电子领域的从业者;旨在帮助他们学会建立复杂的电力系统仿真模型,以便更好地理解STATCOM的工作机制,进而优化实际项目中的无功补偿方案。 其他说明:文中提供的实例代码可以帮助读者直观地了解如何从零开始构建一个完整的三相STATCOM仿真环境,并通过图形化的方式展示无功补偿的效果,便于进一步的学习与研究。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值