jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

up

Browse source
This commit is contained in:
Ilya Kantor 2016-11-14 23:41:18 +03:00
parent f99574f53b
commit b0976b5253
153 changed files with 590 additions and 533 deletions
Download patch file Download diff file Expand all files Collapse all files

32
1-js/9-object-inheritance/10-class-inheritance/3-clock-class/clock.js Normal file
View file

@ -0,0 +1,32 @@
function Clock(options) {
this._template = options.template;
}
Clock.prototype._render = function render() {
var date = new Date();
var hours = date.getHours();
if (hours < 10) hours = '0' + hours;
var min = date.getMinutes();
if (min < 10) min = '0' + min;
var sec = date.getSeconds();
if (sec < 10) sec = '0' + sec;
var output = this._template.replace('h', hours).replace('m', min).replace('s', sec);
console.log(output);
};
Clock.prototype.stop = function() {
clearInterval(this._timer);
};
Clock.prototype.start = function() {
this._render();
var self = this;
this._timer = setInterval(function() {
self._render();
}, 1000);
};

4
1-js/9-object-inheritance/10-class-inheritance/3-clock-class/solution.md Normal file
View file

@ -0,0 +1,4 @@
[js src="clock.js"]

32
1-js/9-object-inheritance/10-class-inheritance/3-clock-class/solution.view/clock.js Normal file
View file

@ -0,0 +1,32 @@
function Clock(options) {
this._template = options.template;
}
Clock.prototype._render = function render() {
var date = new Date();
var hours = date.getHours();
if (hours < 10) hours = '0' + hours;
var min = date.getMinutes();
if (min < 10) min = '0' + min;
var sec = date.getSeconds();
if (sec < 10) sec = '0' + sec;
var output = this._template.replace('h', hours).replace('m', min).replace('s', sec);
console.log(output);
};
Clock.prototype.stop = function() {
clearInterval(this._timer);
};
Clock.prototype.start = function() {
this._render();
var self = this;
this._timer = setInterval(function() {
self._render();
}, 1000);
};

21
1-js/9-object-inheritance/10-class-inheritance/3-clock-class/solution.view/index.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Часики в консоли</title>
<meta charset="utf-8">
</head>
<body>
<script src="clock.js"></script>
<script>
var clock = new Clock({
template: 'h:m:s'
});
clock.start();
</script>
</body>
</html>

32
1-js/9-object-inheritance/10-class-inheritance/3-clock-class/source.view/clock.js Normal file
View file

@ -0,0 +1,32 @@
function Clock(options) {
var template = options.template;
var timer;
function render() {
var date = new Date();
var hours = date.getHours();
if (hours < 10) hours = '0' + hours;
var min = date.getMinutes();
if (min < 10) min = '0' + min;
var sec = date.getSeconds();
if (sec < 10) sec = '0' + sec;
var output = template.replace('h', hours).replace('m', min).replace('s', sec);
console.log(output);
}
this.stop = function() {
clearInterval(timer);
};
this.start = function() {
render();
timer = setInterval(render, 1000);
}
}

21
1-js/9-object-inheritance/10-class-inheritance/3-clock-class/source.view/index.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Часики в консоли</title>
<meta charset="utf-8">
</head>
<body>
<script src="clock.js"></script>
<script>
var clock = new Clock({
template: 'h:m:s'
});
clock.start();
</script>
</body>
</html>

11
1-js/9-object-inheritance/10-class-inheritance/3-clock-class/task.md Normal file
View file

@ -0,0 +1,11 @@
importance: 5
---
# Класс "часы"
Есть реализация часиков, оформленная в виде одной функции-конструктора. У неё есть приватные свойства `timer`, `template` и метод `render`.
Задача: переписать часы на прототипах. Приватные свойства и методы сделать защищёнными.
P.S. Часики тикают в браузерной консоли (надо открыть её, чтобы увидеть).