JavaScript is all about Object. Object
class is the most important data type in JavaScript. It is often used to store various keyed collections and more complex entities. Let’s find out 4 object methods that are useful but not known to many of us
EC6 added a helper function called Object.is()
. Object.is()
methods determines whether two values are the same value and is slightly different from the ===
operator
===
and Object.is()
The method Object.is()
works the same as ===
for almost all intents and purposes, with just 2 key differences
1_ Negative 0
The unusual JavaScript number negative zero -0
is usually considered equal to positive zero +0
, but they are technically different values. Object.is()
can tell them apart, returning false
for the comparison between -0
and…
While other languages (i.e., C, Java, C#) are compiled in advance, JS is interpreted and sometimes compiled at runtime with a just-in-time (JIT) compiler.
JavaScript skips <compiler> && <ByteCode> steps.
Java Example Compile steps below:
In Object.assign()
,
The target object is determined by the its position in the parameters. Whatever positions 1st in the method’s parameters becomes the target object
The properties are overwritten by other objects that have the same properties later in the parameter order
If the source value is a reference to an object, it only copies the reference value. Object.assign()
copies property values and it does only Shallow Clone, not Deep Clone
The main use case of Object.assign()
is to copy all properties from source object to target object
// HERE
sourceObj is assigned to targetObj ( {}…
The Object.getOwnPropertyNames()
method returns an array of all properties (including non-enumerable property) found directly in a given object
Syntax
Object.getOwnPropertyNames(obj)
Example
Object.getOwnPropertyNames()
returns all keys of the object
[ '0', '1', '2' ]
string
The Object.keys()
method returns an array of a given object’s own enumerable property names, iterated in the same order that a normal loop would
Syntax
Object.keys(obj)
Example
Object.keys
returns the same output as Object.getOwnPropertyNames()
because every elements in the obj
is enumerable
[ '0', '1', '2' ]
string
Object.getOwnPropertyNames(obj)
returns all the properties of the object. Object.keys(obj)
returns all enumerable properties. …
Defintion
Object.assign
method is one of the new features introduced with ECMAScript 2015 (ES6). This method copies the values (of all enumerable own properties) from one or more source objects to a target object
Use Case
It is useful for merging objects or cloning them shallowly.
Example
Object.assign
method is useful for merging objects because properties in the target object are overwritten by properties in the sources if they have the same
For example:
Intl.Collator()
enable language sensitive string comparisonJavaScript native sort method does not work for most of foreign language, which has non-ASCII characters like [‘ą’, ‘ㄱ’, ‘世’, ‘д’, ‘e’]
Quick Solution
Using localeCompare()
Using Intl.Collator()
Intl.Collator
is better performer than localeCompare
Intl.Collator
Object and its compare
property is better than localeCompare()
in terms of performance for comparing large number of strings
localeCompare()
const a = 'réservé'; // with accents, lowercase
const b = 'RESERVE'; // no accents, uppercaseconsole.log(a.localeCompare(b));
// expected output: 1
Intl.Collator()
const a = 'réservé'; // with accents, lowercase
const b = 'RESERVE'; // no accents, uppercaseconsole.log(new Intl.Collator().compare(a, b));// expected output…
Syntax
grid-column: grid-column-start / grid-column-end
Example
Our test shows that the implementation of the chunked requests makes the upload 30% faster.
이번 시간에는 청크 분할 요청 (Chunked Request)를 이용해서 대용량파일 전송 속도를 최소 30% 빠르게 올린 경험을 여러분과 함께 공유하고자 합니다
인트로
저는 TransPerfect라는 회사에서 GlobalLink Share라는 파일 쉐어링 플랫폼을 만들고 있는 프론트엔드 개발자입니다. Dropbox / Google Drive와 비슷한 파일 쉐어링 플랫폼이라고 생각하시면 편하실거 같습니다. GlobalLink Share 또는 GL Share는 1) 로그인이 필요없는 익명 파일 쉐어 2) 게스트 로그인 등의 기능등을 가지고 있고 무제한 파일 사이즈 쉐어를 추구합니다.
개발 스택은 다음과 같습니다
Vue.js / V …
Network tab or panel in Chrome Devtool is one of the most popular debugging tools that software developers especially Web & Front-End developer can use
The most common use cases for the Network panel are
I believe that many readers of this article have an experience of using Chrome Devtool at least once. Inspecting the status codes such as 2xx (Success), 4xx Client Error, 5xx Server Error, for example, is one of the common practices software engineers do to see if HTTP request/response is safely delivered to/from the…
About