Skip to content

Instantly share code, notes, and snippets.

blaja

Block or report user

Report or block blaja

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@blaja
blaja / .js
Created Aug 5, 2015
Get for..of loop on NodeList interface in Chrome
View .js
NodeList.prototype[Symbol.iterator] = Array.prototype[Symbol.iterator];
@blaja
blaja / .js
Created Aug 8, 2015
Inspecting internal [[class]] of objects in JS
View .js
// NOTE: this is specification dependent classification. It has nothing to do with formal class programming concept.
// The value of the [[Class]] internal property is defined by specification for every kind of built-in object.
// The value of the [[Class]] internal property of a host object may be any String value except one of:
// "Arguments", "Array", "Boolean", "Date", "Error", "Function", "JSON", "Math", "Number", "Object", "RegExp", and "String".
// The value of a [[Class]] internal property is used internally to distinguish different kinds of objects.
Object.prototype.toString.call({}); // "[object Object]"
Object.prototype.toString.call([]); // "[object Array]"
Object.prototype.toString.call(function(){}); // "[object Function]"
Object.prototype.toString.call(''); // "[object String]"
@blaja
blaja / .js
Created Aug 7, 2015
This is how to extend Host(DOM,BOM) objects. But best to not do it at all, use wrappers.
View .js
const $ = function(selector) { return document.querySelector(selector); }; // Returns first matched element or null
const $$ = function(selector) { return document.querySelectorAll(selector); }; // Returns NodeList of matched elements or empty NodeList []
// If you want to extend HTML DOM prototype do it this way or something like this.
// Check for property or method pre-existance. Obv if JS Engine already provides property or method, you don't want to override it with your own custom one.
// This works in IE9+ or can be done even in IE8+
// Adding a new method to all HTML elements via the HTMLElement prototype
if(!HTMLElement.prototype.remove) {
// defineProperty because of enumeration
View .js
document.getElementById('btn').addEventListener('click', function() {
"use strict";
const evens = Array.from(document.getElementsByClassName('even'));
for(let even of evens) {
even.classList.toggle('bold');
even.nextElementSibling.classList.toggle('italic');
}
});
View .js
(function () {
'use strict';
return this === undefined; // false
}.call(this));
(function(global){
'use strict';
@blaja
blaja / .js
Last active Aug 29, 2015
Simple way to exclude webkit prefixed props in Chrome using some ES6 features.
View .js
// Filter out CSS properties without webkit prefixes in Chrome console
// To find "hidden" properties of an object we need to use Object.getOwnPropertyNames.
Object.getOwnPropertyNames(document.body.style).filter(
property => !property.startsWith('webkit')
);
@blaja
blaja / .js
Created Aug 1, 2015
Fetch some JSON using Fetch API
View .js
const request = new Request('https://output.jsbin.com/pasixu.js', {
method: 'GET',
requestMode: 'cors',
});
fetch(request).then(function(response) {
return response.json();
}).then(function(body) {
console.log(body);
}).catch(function(){
@blaja
blaja / .js
Last active Aug 29, 2015
Not worth a look!
View .js
// Navigate to different location using different BOM && DOM API-s. Paralysis of choice :) Are there more ways ?
location = 'https://www.google.com/';
location.href = 'https://www.google.com/';
window.location = 'https://www.google.com/';
document.location = 'https://www.google.com/';
window.location.href = 'https://www.google.com/';
View .html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<style>
body {height: 100vh;display: flex;align-items: center;justify-content: center;}
/* Button component - works only in FF correctly ATM */
You can’t perform that action at this time.