Javascript语言的面向对象特征很弱,其他面向对象语言在创建类时只要使用关键字static即可指定类为静态类,Javascript没有提供static这样的关键字,要让Javascript也具有“静态”特性只有靠一些“奇技淫巧”了。
代码中列举了两种静态方法/属性的实现方式,一种是静态类的静态方法和属性,另一种是非静态类的静态方法和属性,代码说明都写在每行的代码注释里,这里就不重复了。
/****************************************
方法一
类、方法、属性都为静态类型
不能创建实例
*****************************************/
var Time = {
today: ‘2009-3-8′,
weather: ‘rain’,
show: function() {
alert(‘Today is ‘ + this.today);
}
};
静态对象可直接使用,无需创建实例
alert(‘It is ‘ + Time.weather + ‘ today.’);
Time.show();
//下面的代码会出错,因为静态类不能创建实例
//var t = new Time();
//t.show();
/****************************************
* 方法二
普通对象,同时拥有静态和非静态属性、方法
可以用实例化
注意:
1.静态方法/属性使用类名访问
2.非静态方法/属性使用实例名访问
*****************************************/
function Person(name) {
//非静态属性
this.name = name;
//非静态方法
this.show = function() {
alert(‘My name is ‘ + this.name + ‘.’);
}
}
//添加静态属性,人都是一张嘴
Person.mouth = 1;
//添加静态方法,哇哇大哭
Person.cry = function() {
alert(‘Wa wa wa …’);
};
//使用prototype关键字添加非静态属性,每个人的牙可能不一样多
Person.prototype.teeth = 32;
//非静态方法必须通过类的实例来访问
var me = new Person(‘Zhangsan’);
//使用非静态方法、属性
me.show();
alert(‘I have ‘ + me.teeth + ‘ teeth.’);
//使用静态方法、属性
Person.cry();
alert(‘I have ‘ + Person.mouth + ‘ mouth.’);
分享到:
相关推荐
- **CSS布局**: 使用了DIV+CSS布局方式,实现了丰富的CSS排版效果,如盒子的嵌套、浮动、边距(`margin`)、边框(`border`)、背景(`background`)等属性的应用。 - **响应式设计**: 页面在不同的设备上保持一致性和良好...
- 在主内容区使用`<div>`标签划分不同的内容区块,并通过CSS的`float`属性或`flexbox`布局实现多列布局。 - 应用JavaScript实现轮播图功能,例如使用`setInterval()`函数定时切换图片。 #### 2. **页面布局** - 每...
不过,要注意的是,虽然静态网页对于初学者来说是很好的起点,但若要实现动态交互和数据库连接,还需要学习JavaScript和其他后端技术,如PHP或Python。总的来说,"Html+css静态网页制作"是踏入网页开发领域的重要...
### JavaScript 实现动态导入 JS 与 CSS 等静态资源文件的方法 在现代 Web 开发中,动态地加载脚本和样式表是非常常见的需求。这不仅有助于提高网站性能(例如,按需加载资源),还能增强用户体验(例如,在特定...
这种技术在不需要JavaScript或其他服务器端编程的情况下,能够实现XML数据的简单展示和样式控制,特别适用于静态网站或对动态交互需求不高的场景。通过灵活调整XSL样式表,可以实现丰富的数据显示效果。
遵循WCAG(Web Content Accessibility Guidelines)指南,使用`<aria>`属性,确保键盘导航,以及为视觉障碍用户提供适当的提示。 10. **SEO优化**:优化导航条的结构和文本,使搜索引擎更容易理解网站的架构。使用...
确保下拉菜单对键盘用户友好,可以使用`tabindex`属性和`keydown`事件来实现键盘导航。同时,添加`aria`属性以提高无障碍性: ```html <li tabindex="0">菜单1 <ul> <li>子菜单1</li> <li>子菜单2</li> </ul> ...
Ajax 基本对象是指在异步 JavaScript 和 XML(AJAX)技术中使用的基本对象,该对象提供了一些属性和方法来处理 XML 的 DOM 元素和遍历 XML 的 DOM 元素。下面是 Ajax 基本对象的属性和方法的详细介绍: 属性 Ajax ...
基本的表格结构由`<table>`、`<tr>`(行)、`<th>`(表头单元格)和`<td>`(数据单元格)组成。例如: ```html <table> <tr> <th>姓名</th> <th>年龄</th> <th>城市</th> </tr> <tr> <td>张三</td> <td>25...
1. **控制播放/暂停**:通过修改HTML中的音频元素(`<audio>`)的`play()`和`pause()`方法来实现音乐的播放和暂停。 2. **音量控制**:通过设置音频元素的`volume`属性,可以调整音量大小。 3. **进度条显示与拖动**...
在JavaScript中,静态方法与非静态方法是面向对象编程中的两个基本概念,它们在类的定义和实例化过程中扮演着重要角色。理解这两者之间的区别对于编写高效、可维护的代码至关重要。 ### 静态方法 #### 定义 静态...
面向对象编程中的静态方法和静态属性是其中的关键概念,它们提供了访问和使用类(函数)本身而非其实例的途径。静态方法和属性通常用于实现与特定实例无关的功能,比如工具函数或者配置属性。 在JavaScript里,函数...
2. **getImageData 方法**: 该方法可以从 `<canvas>` 元素中获取指定矩形区域的像素数据,返回一个 ImageData 对象,该对象包含着矩形区域内所有像素的颜色信息。 3. **粒子动画实现**: 通过对图像的像素数据进行...
本篇文章将深入探讨如何使用JavaScript来实现这样一个多级静态树。 首先,我们需要定义一个树节点的数据结构。每个节点通常包含其自身的值、子节点数组以及可能的其他属性,例如索引、层级等。以下是一个简单的树...
在本文中,我们将深入探讨如何使用jQuery库,特别是jQuery TableSorter.js插件,来实现表格内容的静态排序,从而提升用户体验和数据管理效率。TableSorter.js是jQuery的一个强大扩展,它允许用户通过简单的点击表头...
这不仅涉及HTML表单标签的使用(如`<form>`、`<input>`等),还需要理解如何通过CSS和JavaScript对表单进行验证和处理。 7. **二级、三级页面的创建**:为了实现网站的多页面结构,需要创建并连接多个HTML页面。这...
1. **用户名输入框**:使用`<input>`标签,类型设为`text`,并添加`placeholder`属性来提示用户输入内容,例如: ```html <label for="username">用户名:</label> <input type="text" id="username" name=...
总之,“纯JavaScript静态树型”是一种利用原生JavaScript实现树形结构的方案,具有良好的兼容性和扩展性,适合需要展现层级关系的应用场景。通过对代码的分析,我们可以更好地理解其实现机制和设计思路。
JavaScript代码可以放置在`<body>`或`<head>`标签内,或者外部引用`.js`文件,以提高代码组织和重用性。 例如,以下是最基础的JavaScript输出示例,使用`document.write`函数在网页上显示文本: ```html <html> ...
在静态留言板中,HTML将用于创建表单元素,如`<form>`、`<input>`(用于用户输入留言)、`<textarea>`(用于输入多行文本,如留言内容)和`<button>`(提交按钮)等。这些元素的属性可以与JavaScript关联,以便于...