teleren/devto huggingface dataset:
JavaScript Objects - Internal Representation
Tags: javascript, javascriptobhect
Published: 2020-04-14 14:15:21

An object in JavaScript is like a class in object-orientated languages.
Objects represent things, like cars for example.
The object is the car.Cars can have properties like color, the amount of cylinders in the vehicle, whether it’s automatic or manual, etc.
Cars can also accelerate, brake, etc. Generally we can represent this functionality as a ‘method’ of the object. Objects also have properties known as ‘prototypes’.
datatypes are classified as Primitives and Composites. Primitives are the string, Boolean and number.

{} // this is an empty object
var myObj = {a: 1, b: 2} // myObj is assigned an object
// this object has 2 keys (a and b) and 2 values (1 and 2)
 
// we can get a value from an object by referencing the key
 
myObj['a'] // this is called bracket notation and returns 1
myObj.b    // this is called dot notation and returns 2 here

Any valid JavaScript value may be associated with a key in a JavaScript object. A value attached to an object is referred to as a “property”. A property that is a function is referred to as a “method”.

Object constructor: In JavaScript, there is a special constructor function known as Object() is used to create and initialize an object. The return value of the Object() constructor is assigned to a variable. The variable contains a reference to the new object. We need an object constructor to create an object “type” that can be used multiple times without redefining the object every time.

function GFG(A, B, C) {
    this.g = A;
    this.f = B;
    this.gg = C;
}

object.property         // person.height
object["property"]      // person["height"]
object[expression]      // x = "height"; person[x]

Java accept the numerical indexes and It can be represented as the key and values and this can be used as a constructor. We can represent in array of values in a object
var a={}
var b={[],[]}
we can represent and evaluate the values in particular if we use objects
If It is an array of objects.It has lenght of an array and we can increase the value of array of objects.

and Index of an array starts with 0 and empty value is undefined

In array of objects there are empty slots if we index above the predefined length of an array

var objname =new Object();

with help of new keyword we can create an array and represent an array

In this same way we can represent json object too
In this way we can represent an object in different ways as constructor, arrays, object.
Do you love working at a startup?
Tags: discuss, watercooler, business, culture
Published: 2020-04-14 14:08:18

---
title: Do you love working at a startup?
published: true
description: For some the startup life is all they want to do, others prefer to work at large enterprise companies! Which do you prefer and why?
tags: discuss, watercooler, business, culture
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/g126nl5lytw7tx6km61h.jpg
---
_cover image by [Vajrapani666](https://commons.wikimedia.org/w/index.php?curid=23271295)_
For some the startup life is all they want to do, others prefer to work at large enterprise companies! Which do you prefer and why?
Unit Testing static classes and methods in Java
Tags: beginners, webdev, twiliohackathon, testing
Published: 2020-04-14 13:55:52

---
title: Unit Testing static classes and methods in Java
published: true
description: How to Unit Test static classes and methods
tags: beginners, webdev, #twiliohackathon, testing
---
Hello, I wanted to share a situation I found a couple of days ago, whilst working for my project for Twilio April Hackathon. I was working on the server-side project and creating endpoints for my product roadmap. What I insist on is testing my code, especially the logic. It's a habit I am actively trying to make.

Let's take this service method that validates a phone number using Twilio API. 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/hgd4nn5723yfncklwo0o.png)

We invoke 'fetch' method on com.twilio.rest.lookups.v1.PhoneNumber to receive an instance of PhoneNumberFetcher.class which will later get all the information on the provided phone number if it exists. Great!
Now, how do we test this? We cannot. We cannot mock static classes. So, we need a way to 'inject' our Twilio API call into our logic and test our code as is without worrying about the response from the external API. 

Check the wrapper below:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ea631fmsd7blbfsz7f2z.png)

Now, we can update our service method:
*Create getter and setter for TwilioSmsApiWrapper class
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/e3h0yiakueimv5k6yyku.png)

Now we can happily create a unit test for our service method:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/u20uu1i5cpq4zcow7eqr.png)

That's it. Now you have decoupled you ThirdParty Logic from your service and you can unit test your logic without relying on real API calls.
Happy coding.
About Ruby Hash#> (Proper Superset)
Tags: ruby, hash, documentation
Published: 2020-04-14 13:51:18

---
title: About Ruby Hash#> (Proper Superset)
published: true
description: 
tags: ruby, hash, documentation
---

Get more information and more examples at my AboutRuby project:
* [AboutRuby project](https://github.com/BurdetteLamar/AboutRuby/blob/master/core/Hash/api/markdown.md#-proper-superset)

Here's the write-up over at the Ruby project:
* [Ruby project](https://ruby-doc.org/core-2.7.0/Hash.html#method-i-3E)

My main page is [here](https://github.com/BurdetteLamar/AboutRuby#about-ruby).

TL;DR

I've been working on enhancements to the documentation for the Ruby project.  Getting these enhancements posted to the Ruby project has been very slow.  They're not actually meeting resistance;  I know because my many PRs for enhancing class ENV were accepted (though not rapidly).  It's just that everyone is busy.

Anyhow, I'm stashing all this stuff on in my own project, called AboutRuby.  The piecemeal migration from there to the Ruby project is not going to be completed in my lifetime (I'm 77 years old).

So:  I'm going to blow my own horn here on DEV, to encourage you to use the enhanced documentation.
Mitos Horror Berfantasi Tanpa Batas !
Tags: mitoshorror, ceritaseram, mitosunik, creepypasta
Published: 2020-04-14 13:50:52

<a href='http://www.Mitoshorror.xyz' rel=''dofollow'> Mitos Horror<Mitos Horror</a>

Blogger ini Membagikan Cerita dari seluruh belahan dunia terutama Indonesia, Disajikan secara ringkas dan Singkat beserta dengan gambar untuk menemani imajinasi kalian secara hangat. Yang dibagi menjadi 2 kategori yaitu

Cerita

<a href='http://www.mitoshorror.xyz/search/label/Cerita%20Misteri' rel=''dofollow'> Cerita Misteri<Cerita Misteri</a>

Berisikan cerita-cerita seram yang akan membuat bulu kuduk kalian berdiri !

<a href='http://www.mitoshorror.xyz/search/label/Cerita%20Mistis' rel=''dofollow'> Cerita Mistis<Cerita Mistis</a>

Tak lekang oleh jaman, cerita mistis dari semua daerah dibelahan dunia ada disini !

<a href='http://www.mitoshorror.xyz/search/label/Cerita%20Riddle' rel=''dofollow'> Cerita Riddle<Cerita RIddle</a>

Cerita2 membingungkan yang akan membuat kalian berpikir dan akan menemukan plot twist didalamnya!

<a href='http://www.mitoshorror.xyz/search/label/Cerita%20Seram' rel=''dofollow'> Cerita Seram<Cerita Seram</a>

Namanya saja sudah cerita seram, pastinya akan membuat kalian tidak bisa tidur setelah membaca cerita-cerita seram di kategori ini.

<a href='http://www.mitoshorror.xyz/search/label/CreepyPasta' rel=''dofollow'> Creepy Pasta<Creepy Pasta</a>

Cerita pendek yang seram ada dikisahkan di kategori ini.

<a href='http://www.mitoshorror.xyz/search/label/Gambar%20Horror' rel=''dofollow'> Gambar Horror<Gambar Horror</a>

Berisikan gambar-gambar menyeramkan sehingga membuat kalian berfantasi dan membuat gambar tersebut seperti nyata !

<a href='http://www.mitoshorror.xyz/search/label/Legenda%20Misteri' rel=''dofollow'> Legenda Misteri<Legenda Misteri</a>

Menceritakan tentang legenda-legenda misteri dari belahan dunia manapun di dunia ini !

<a href='http://www.mitoshorror.xyz/search/label/Urban%20Legend' rel=''dofollow'> Urban Legend<Urban Legend</a>

Kisah seram di setiap daerah ada di kategori ini.

Apabila kalian menyukai beberapa kategori diatas, ini sangat cocok sekali dengan anda.

Semoga anda terhibur dengan blogger ini karena kami menyajikannya hanya khusus anda !

LINK BLOGGER : Blogger <a href='http://www.mitosunik.xyz' rel=''dofollow'> Mitos Horror<Mitos Horror</a>
Bifurcate array by given rules in javascript
Tags: javascript, codenewbie, codequality, 100daysofcode
Published: 2020-04-14 13:49:54

Hello brilliant minds, Welcome again in a new episode of series called **JavaScript useful snippets**. In this series, I'm going to talk about some short-codes and useful functions of JavaScript. These snippets can help you to make your development more efficient and faster. Stay tuned till the end to learn something new... 😊

#### JavaScript useful snippet - bifurcate() ####

Guess you have an array with tons of records from them you need some records which are truthy or match with any other rule you've given in one dataset, while rest records in another dataset at those times this function can make it happen in few secs.  bifurcate() will take two arguments as input, first one will be an array of records and the second one will be rule in the type of function. 

After, processing in the output it'll return two arrays inside array where first will consist records which satisfy with your rules and second will have rest records. Let's look at the syntax for better understanding...

```
const bifurcateBy = (arr, fn) =>
 arr.reduce((acc, val) => (acc[fn(val) ? 0 : 1].push(val), acc), [[], []]);
```

In return, I've used reduce method to differencing arrays, while as the initial value I've passed [[], []] into it. and in return of reduce(), I've first selected the index of output array by validating given function (*means if current records satisfy the given rule then index will be 0 otherwise 1*) and did push the record into a selected array. So, that's how both arrays will be treated here. now, let's check out results... 

#### Result: ####
```
const result = bifurcateBy(['Jan', 'May', 'April', 'Sep'], x => x[1] === 'a'); // output [ ["Jan", "May"], ["April", "Sep"]]
```

As you see in a result - Given arrays bifurcated into two arrays where the first one includes who satisfy condition which added in the second argument and second result array includes all records who are not matched with the condition.

{% youtube TYYzMx16P1s %}

Thank you for watching/reading folks, if you found this informative and wanted to make me more content like this please support me on Patreon.
  
Now, Guys in the next episode I'm going to share a function to get a distance between two points in the 2D dimension. so follow/subscribe to get notification... 

Subscribe on youtube https://www.youtube.com/channel/UCvNjso_gPQIPacA6EraoZmg
Facebook: https://www.facebook.com/KatharotiyaRajnish/
Twitter: https://twitter.com/tutorial_spot
Logical Operators and Short Circuit Assignment
Tags: javascript, beginners
Published: 2020-04-14 13:42:37

# Logical Operators and Short Circuiting

In many programming languages, we denote 'and' with: `&&` and 'or' with `||`. 

### `&&`

`&&` expects both the left and the right hand side *operands* to be `true` for the entire *expression* to evaluate to `true`. For example, `roomCleaned && dishesWashed` requires both a 'clean room' *and* 'dishes washed' for the whole *expression* to be `true`. If either of those are *false,* the entire *expression* *returns* *false.*

**Furthermore, 👆🏽, if `roomCleaned` is `false`, there is no reason to bother checking `dishesWashed`. If the left-hand side *operand* is `false`, we are *short circuited.** JS will **not** *evaluate* the right-hand side *operand.*

### `||`

`||` only requires one of the *operands* to be `true` for the entire *expression* to *return* `true`. For example, `roomCleaned || dishesWashed` only needs either *operand* to be `true`. As long as either of those is `true`, the entire *expression* *returns* *true.*

**Furthermore, 👆🏽, if `roomCleaned` is `true`, there is no reason to bother checking `dishesWashed`. If the left-hand side *operand* is `true`, we are *short circuited.*** JS will **not** *evaluate* the right-hand side *operand.*

## 'falsey' and 'truthy'

When working with 'non-boolean' *operands*, *logical operators* will treat them as 'falsey' or 'truthy.' For example, `""` is 'falsey,' as is `0`. `"a"` or `1` are 'truthy.' In essence, JS treats 'empty-ish' or `null`-ish things as 'falsey.' 

Combining this with the *short circuiting:*

```javascript
    // 'or' Short Circuit! - "a" is 'truthy', so no need to for '333'
    "a" || 333; // a
    
    const a = "";
    // 'a' is bound to a 'falsey' empty STRING, so we 'take' 'truthy' '333'. 
    a || 333; // 333
    
    null || "hello"; // hello
    
    // "a" is 'truthy,' but still must look at '333'
    "a" && 333; // 333
    
    // 'and' Short Circuit! - is 'falsey' - don't bother with '333'.
    0 && 333; // 0 
    
    // 'and' Short Circuit! - 'null 'falsey' - don't bother with 'hello'.
    null && "hello"; // null
```

## Short Circuit Assignment

Although use cases for `&&`  *short-circuiting* are virtually non-existent, we can use `||` *short-circuiting* to avoid having 'blank' for 'falsey' values in our data. The concept is the same as we saw 👆🏽, but we are just combining that with *variable assignment.*

```javascript
    // Imagine user left form field blank - no FORM VALIDATION.
    // We can assign a default value so that we can still 'accept' the 'form,' but it's clear that the user left that blank.
    const userName = "" || "Blank form field";

    // Imagine that we retrieved some product from database as an OBJECT LITERAL.
    const someProduct = { 
    	name: "Great Widget",
    	price: 0 // Bad data entry - no database validation! 😱
    }
    
    // We can prevent '0' from being shown to user.
    const displayedPrice = someProduct.price || "Please Call For Price!"
```
New online tools: CSS specificity calculator and color contrast checker
Tags: a11y, design, css, webdev
Published: 2020-04-14 13:39:56

My goal with Polypane is improving the workflow for developers and designers. The main focus is of course [developing an excellent browser for developers and designers](https://polypane.app), but I’m also developing online tools that help out during development. Two of them online now are a [CSS specificity calculator](https://polypane.app/css-specificity-calculator/), and a [color contrast checker](https://polypane.app/color-contrast/). Both of them go way beyond what you expect from these types of tools.

## [CSS specificity calculator](https://polypane.app/css-specificity-calculator/)

CSS specificity can be tricky to understand and while there are many places online that explain it, figuring out the specificity of a CSS selector can be difficult.

There are online tools that tell you the specificity, but none that also explain how that specificity is calculated. For example, is an attribute selector as specific as an element or a class? (It’s as specific as a class:)

[![CSS specificity calculator screenshot](https://dev-to-uploads.s3.amazonaws.com/i/27pf2dgrj9sa91ox3877.png)](https://polypane.app/css-specificity-calculator)

## [Color contrast checker](https://polypane.app/color-contrast/)

When working on a site in Polypane, the contrast checker informed me I didn’t have enough contrast on a text element, but it didn’t tell me how I could find a color that did have enough contrast, or better yet, told me which color that was.

So I decided to implement improvement suggestions in the next version of Polypane. Any color with insufficient contrast will get a suggestion if we can calculate that, based on the required contrast ratio for that specific font-size:

![Color suggestion in the upcoming version of Polypane](https://dev-to-uploads.s3.amazonaws.com/i/mcx7vbzyp91tnxdl8gz8.png)

After building that, I decided to create an online tool that did the same. Most online contrast checkers are either fast but only give you the current ratio, or slow and then suggest colors. Many of them also don’t take into account the alpha of a color leading to incorrect ratios.

I think tools should be fast, correct and helpful, so I set out to make a tool that updates on the fly, correctly handles transparencies and also gives you alternative colors if your contrast ratio is not enough.

[![Color contrast checker screenshot](https://dev-to-uploads.s3.amazonaws.com/i/v2gf5tbhkc0qovsrty54.png)](https://polypane.app/color-contrast/)


For both tools, I made sure that their status is included in the URL, so you can share them. They are available for free on the Polypane website, alongside the [Responsive design glossary](https://polypane.app/responsive-design-glossary) that I wrote. Let me know if you enjoy using these, and if you have suggestions for new tools to build!
10 000 days Birthday Calculator
Tags: javascript, webdev, css
Published: 2020-04-14 13:38:11

Have you ever wondered how many DAYS you are? And what about when is your ’10 000 days Birthday’?
Maybe it’s time bake a birthday cake? 😀

So I decided to create a ["10 000 days birthday calculator"](https://yaninatrekhleb.github.io/tenThousandDays/index.html) and [I've open-sourced it on GitHub](https://github.com/YaninaTrekhleb/tenThousandDays).
Just choose your birthday date and see when it’s time to celebrate!
You can also see how many days you are today and at what stage in life you are! 


[👉🏻Try it here👈🏻](https://yaninatrekhleb.github.io/tenThousandDays/index.html)
Google Sheets API quickstart in TypeScript
Tags: gsheets, typescript, node
Published: 2020-04-14 13:23:18

I don't get whether Google Sheets team is so against TypeScript, that I need this line... (I cannot export `typeof OAuth2Client`.)

```ts
async function getNewToken<T = any> (oAuth2Client: any): Promise<T>
```

Also, using too many callbacks is the easiest way to get into hell.

Anyways, the code is here

```ts
import fs from 'fs'
import readline from 'readline'

import { google } from 'googleapis'

const SCOPES = [
  'https://www.googleapis.com/auth/spreadsheets'
]
const TOKEN_PATH = 'secrets/token.json'
const CRED_PATH = 'secrets/gsheets.json'

async function main () {
  const auth = await authorize(JSON.parse(fs.readFileSync(CRED_PATH, 'utf8')))
  const sheets = google.sheets({ version: 'v4', auth })
  const r = await sheets.spreadsheets.values.get({
    spreadsheetId: '1BxiMVs0XRA5nFMdKvBdBZjgmUUqptlbs74OgvE2upms',
    range: 'Class Data!A2:E'
  })

  if (r) {
    const rows = r.data.values
    if (rows) {
      if (rows.length) {
        console.log('Name, Major:')
        // Print columns A and E, which correspond to indices 0 and 4.
        rows.map((row) => {
          console.log(`${row[0]}, ${row[4]}`)
        })
      } else {
        console.log('No data found.')
      }
    }
  }
}

async function authorize (cred: any) {
  const { client_secret, client_id, redirect_uris } = cred.installed
  const oAuth2Client = new google.auth.OAuth2(
    client_id, client_secret, redirect_uris[0])

  if (fs.existsSync(TOKEN_PATH)) {
    oAuth2Client.setCredentials(JSON.parse(fs.readFileSync(TOKEN_PATH, 'utf8')))
    return oAuth2Client
  }

  return getNewToken<typeof oAuth2Client>(oAuth2Client)
}

async function getNewToken<T = any> (oAuth2Client: any): Promise<T> {
  const authUrl = oAuth2Client.generateAuthUrl({
    access_type: 'offline',
    scope: SCOPES
  })

  console.log('Authorize this app by visiting this url:', authUrl)
  const code = await readlineAsync('Enter the code from that page here: ')
  const token = await new Promise((resolve, reject) => {
    oAuth2Client.getToken(code, (err: any, token: any) => {
      err ? reject(err) : resolve(token)
    })
  })
  oAuth2Client.setCredentials(token)
  // Store the token to disk for later program executions
  fs.writeFileSync(TOKEN_PATH, JSON.stringify(token))
  console.log('Token stored to', TOKEN_PATH)

  return oAuth2Client
}

async function readlineAsync (question: string) {
  const rl = readline.createInterface({
    input: process.stdin,
    output: process.stdout
  })

  return new Promise((resolve) => {
    rl.question(question, (answer) => {
      rl.close()
      resolve(answer)
    })
  })
}

main()
```

For this code, `oAuth2Client.getToken()` is not promisified. (I tested.)

For some reasons, `Google Sheets API Quickstart isn't verified by google`.

Also, readability can be improved if we use things like [readline-sync](https://www.npmjs.com/package/readline-sync), but I rather prefer to keep it minimal of libraries...
SM Market Magento Theme: A Lightweight Theme to Customize Your Online Stores
Published: 2020-04-14 13:20:42

People all around the globe love to buy stuff from those stores that are designed beautifully and have some appealing structure. If you are a store owner and looking for high-quality themes that offer a bunch of amazing features, then the SM Market theme should be your option.

The SM Market is a responsive Magento 2 theme that is fully customizable and suitable for ecommerce stores. Especially for those store owners who want to build a marketplace or a multi-category store with multiple branches and products such as an online market store, clothing store, furniture store, book store, cosmetics shop, luxury jewelry & accessories store, etc.

Click the link to read the full review of <a href="https://www.cloudways.com/blog/sm-market-theme/">SM Market Theme For Magnto</a>