Published
Edited
Apr 13, 2019
Insert cell
Insert cell
Insert cell
{
function Animal(name) { //konstruktor
this.type = "animal";
this.name = name;
}

Animal.prototype.eat = function() { //dodajemy rzeczy do prototypu
return "I eat food";
}
const animal = new Animal('Puszek');
return animal; // console.log(animal.eat());
}
Insert cell
Insert cell
{
class Animal {
constructor(name) {
this.name = name;
this.type = "animal";
}
}
const animal = new Animal('Puszek');
return animal;
}
Insert cell
Insert cell
{
const Animal = class {
constructor(name) {
this.name = name;
this.type = "animal";
}
}
}
Insert cell
Insert cell
Insert cell
{
class Animal {
// zawsze strict mode - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode
constructor(name) {
this.name = name;
this.type = "animal";
}

eat(co) {
return this.name + " jem " + co;
}

sleep() {
return this.name + " śpię";
}
}
const animal = new Animal('Puszek');
return [animal, animal.eat('zupe'), animal.sleep()];
}
Insert cell
Insert cell
{
let p = new Prostokat(); // ReferenceError

class Prostokat {}
}
Insert cell
{
let p = new Prostokat();

function Prostokat() {}
return p;
}
Insert cell
Insert cell
Insert cell
{
function Animal(name) { //konstruktor
this.type = "animal";
this.name = name;
}

Animal.prototype.eat = function() { //dodajemy rzeczy do prototypu
return "I eat food";
}
function Bird(name) {
Animal.call(this, name);
this.type = "bird";
}

//tworzymy obiekt prototypu na bazie prototypu Animal
Bird.prototype = Object.create(Animal.prototype);

//poprawiamy konstruktor, bo powyższa funkcja nam go przestawiła na Animal
Bird.constructor = Bird;

Bird.prototype.eat = function() {
//pobieramy kod tamtej funkcji
const text = Animal.prototype.eat.call(this);

//i go rozszerzamy
return text + " - exactly seed!";
}

Bird.prototype.fly = function() {
return "I can fly";
}

const obBird = new Bird("ptak");
return [obBird, obBird.eat(), obBird.fly()];
}
Insert cell
Insert cell
{
class Animal {
constructor(name) {
this.name = name;
this.type = "animal";
console.log(this.name, this.type);
}

eat() {
return this.name + " jem";
}

sleep() {
return this.name + " śpię";
}
}
class Bird extends Animal {
constructor(name) {
super(name);
this.type = "bird";
}

eat() {
const text = super.eat();
return text + " - exactly seed!";
}

fly() {
return "I can fly";
}
}
const bird = new Bird('Janusz');
return [bird, bird.eat(), bird.sleep(), bird.fly()];
}
Insert cell
Insert cell
{
class Shape {
constructor(x, y) {
this.x = x;
this.y = y;
}
area() { }
}

class Rectangle extends Shape {
constructor(x, y, side) {
super(x, y);
this.side = side;
}
}
return new Rectangle(10, 20, 20)
}
Insert cell
{
class Shape {
constructor(x, y) { }
area() { }
}
class Rectangle extends Shape {
constructor(x, y, side) {
this.side = side;
super(x, y); //błąd - super musi zawsze przed pierwszym odwołaniem się do this
}
}
const rect = new Rectangle(10, 20, 20);
}
Insert cell
Insert cell
{
class Shape {
constructor(x, y) {
this.x = x;
this.y = y;
}
area() { }
}

class Triangle extends Shape {
//nie potrzebujemy rozszerzać konstruktora, więc go nie piszemy
area() {
return this.x * this.y
}
}
const triangle = new Triangle(10, 20);
return [triangle, triangle.area()];
}
Insert cell
Insert cell
Insert cell
{
class Punkt {
constructor(x, y) {
this.x = x;
this.y = y;
}
state = {
loading: true,
articles: [],
showAddWeightWidget: false
};

static odleglosc(a, b) {
const dx = a.x - b.x;
const dy = a.y - b.y;

return Math.sqrt(dx*dx + dy*dy); //Zwraca pierwiastek kwadratowy danej liczby
}
odleglosc2(b) {
const dx = this.x - b.x;
const dy = this.y - b.y;

return Math.sqrt(dx*dx + dy*dy); //Zwraca pierwiastek kwadratowy danej liczby
}
}

const p1 = new Punkt(5, 5);
const p2 = new Punkt(10, 10);
//return Punkt.odleglosc({x: 1, y: 1}, {x:2, y:2});
return [p1, p2, Punkt.odleglosc(p1, p2), p1.odleglosc2(p2)]
}
Insert cell
Insert cell
Insert cell
{
class Brick {
constructor (x, y, width, height, type) {
this.x = x
this.y = y
this.width = width
this.height = height
this.type = type
this.graphic = 'default.png'
this.live = 10
}
print() {
return [this.x, this.y, this.width, this.height, this.type, this.graphic, this.live]
}
init () {
return "Dodano na plansze";
}
}
class BrickBlue extends Brick {
constructor(x, y, width, height, type) {
super(x, y, width, height, type);
this.live = 100;
this.graphic = 'blue.png'
}
}
class BrickRed extends Brick {
constructor(x, y, width, height, type) {
super(x, y, width, height, type);
this.live = 10;
this.graphic = 'red.png'
}
}
class BrickGreen extends Brick {
constructor(x, y, width, height, type) {
super(x, y, width, height, type);
this.live = 20;
this.graphic = 'green.png'
}
}
class BrickAnim extends Brick {
constructor(x, y, width, height, type, speed) {
super(x, y, width, height, type);
this.graphic = 'anim.png'
this.speed = speed
}
moveHorizontal() {
return `poruszam się poziomo z szybkością ${this.speed}`;
}
}
const green = new BrickGreen(1,1, 100, 100, 'brick')
const red = new BrickRed(2,2, 100, 100, 'brick')
const blue = new BrickBlue(3,3, 100, 100, 'brick')
const animBrick = new BrickAnim(100,100, 100, 100, 'anim', 300);
return [
[green.init(), red.init(), blue.init()],
[green.print(), red.print(), blue.print()],
animBrick, animBrick.moveHorizontal()
]
}
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more