Những bài test JavaScript thật sự ảo ma

Thứ Hai, 28/11/2022

Tram Ho

Không ai hiểu tôi cả, có phải tôi là javascript?
Javascript khó hiểu, Là một web developer thì dù bạn có thích hay không cũng phải làm việc với nó.
Mình chia sẽ sáu bài test, là một số trường hợp magic của javascript mà mình đã gặp khi thực chiến.
Đề bài chung là cái gì được in ra console?.
Giành 15 phút, mở console và thực hành ngay nhé.

Bài 1. parseInt

<span class="token keyword">const</span> a <span class="token operator">=</span> <span class="token function">parseInt</span><span class="token punctuation">(</span><span class="token string">'0.000005'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">const</span> b <span class="token operator">=</span> <span class="token function">parseInt</span><span class="token punctuation">(</span><span class="token string">'0.0000005'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">const</span> c <span class="token operator">=</span> <span class="token function">parseInt</span><span class="token punctuation">(</span><span class="token number">0.000005</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">const</span> d <span class="token operator">=</span> <span class="token function">parseInt</span><span class="token punctuation">(</span><span class="token number">0.0000005</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>a<span class="token punctuation">,</span> b<span class="token punctuation">,</span> c<span class="token punctuation">,</span> d<span class="token punctuation">)</span><span class="token punctuation">;</span>

const a = parseInt('0.000005');

const b = parseInt('0.0000005');

const c = parseInt(0.000005);

const d = parseInt(0.0000005);

console.log(a, b, c, d);

Vì sao d = 5?

Bài 2. Math.max

<span class="token keyword">const</span> a <span class="token operator">=</span> Math<span class="token punctuation">.</span><span class="token function">max</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">const</span> b <span class="token operator">=</span> Math<span class="token punctuation">.</span><span class="token function">max</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">const</span> c <span class="token operator">=</span> a <span class="token operator">===</span> b

console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>a<span class="token punctuation">,</span> b<span class="token punctuation">,</span> c<span class="token punctuation">)</span><span class="token punctuation">;</span>

const a = Math.max([]);

const b = Math.max();

const c = a === b

Bài 3. RegExp

<span class="token keyword">const</span> reg <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">RegExp</span><span class="token punctuation">(</span><span class="token string">'true'</span><span class="token punctuation">,</span> <span class="token string">'g'</span><span class="token punctuation">)</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>reg<span class="token punctuation">.</span><span class="token function">test</span><span class="token punctuation">(</span><span class="token string">'true'</span><span class="token punctuation">)</span><span class="token punctuation">)</span>
<span class="token punctuation">[</span><span class="token string">'true'</span><span class="token punctuation">,</span> <span class="token string">'true'</span><span class="token punctuation">,</span> <span class="token string">'true'</span><span class="token punctuation">,</span> <span class="token string">'true'</span><span class="token punctuation">]</span><span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span><span class="token parameter">str</span><span class="token operator">=&gt;</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>reg<span class="token punctuation">.</span><span class="token function">test</span><span class="token punctuation">(</span>str<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

const reg = new RegExp('true', 'g')

console.log(reg.test('true'))

['true', 'true', 'true', 'true'].forEach(str=> console.log(reg.test(str)));

Vì sao lúc là true lúc lại là false

Bài 4. Array.map và parseInt

<span class="token keyword">const</span> a <span class="token operator">=</span> <span class="token function">parseInt</span><span class="token punctuation">(</span><span class="token string">'10'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">const</span> arrayA <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'10'</span><span class="token punctuation">,</span><span class="token string">'10'</span><span class="token punctuation">,</span><span class="token string">'10'</span><span class="token punctuation">,</span><span class="token string">'10'</span><span class="token punctuation">,</span><span class="token string">'10'</span><span class="token punctuation">]</span><span class="token punctuation">.</span><span class="token function">map</span><span class="token punctuation">(</span>parseInt<span class="token punctuation">)</span><span class="token punctuation">;</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token punctuation">{</span> a<span class="token operator">:</span> a<span class="token punctuation">,</span> arrayA<span class="token operator">:</span> arrayA <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

const a = parseInt('10');

const arrayA = ['10','10','10','10','10'].map(parseInt);

console.log({ a: a, arrayA: arrayA });

Bài 5. Variable scope

<span class="token keyword">var</span> a <span class="token operator">=</span> <span class="token number">1</span><span class="token punctuation">;</span> 
<span class="token keyword">function</span> <span class="token function">bar</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 
    <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span>a<span class="token punctuation">)</span> <span class="token punctuation">{</span> 
        <span class="token keyword">var</span> a <span class="token operator">=</span> <span class="token number">10</span><span class="token punctuation">;</span> 
    <span class="token punctuation">}</span> 
    console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>a<span class="token punctuation">)</span><span class="token punctuation">;</span> 
<span class="token punctuation">}</span> 
<span class="token function">bar</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

var a = 1;

function bar() {

if (!a) {

var a = 10;

}

bar();

Vì sao a = 10 ?

Bài 6. toString() method

<span class="token keyword">function</span> <span class="token function">tryCatch</span><span class="token punctuation">(</span><span class="token parameter">fn</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">try</span> <span class="token punctuation">{</span>
        console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token function">fn</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span>
    <span class="token punctuation">}</span> <span class="token keyword">catch</span> <span class="token punctuation">(</span>err<span class="token punctuation">)</span> <span class="token punctuation">{</span>
        console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>err<span class="token punctuation">.</span>message<span class="token punctuation">)</span>
    <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
<span class="token function">tryCatch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token number">2.</span><span class="token punctuation">.</span><span class="token function">toString</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token function">tryCatch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token number">2</span> <span class="token punctuation">.</span><span class="token function">toString</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token function">tryCatch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token number">2</span>        <span class="token punctuation">.</span><span class="token function">toString</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token function">tryCatch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">(</span><span class="token number">2</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">toString</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token function">tryCatch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">[</span><span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">.</span><span class="token function">toString</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token function">tryCatch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token number">2.</span><span class="token function">toString</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

function tryCatch(fn) {

try {

console.log(fn())

} catch (err) {

console.log(err.message)

}

tryCatch(() => 2..toString());

tryCatch(() => 2 .toString());

tryCatch(() => (2).toString());

tryCatch(() => [2].toString());

tryCatch(() => 2.toString());

Vì sao 2.toString() là bị Error

Đáp án và lý giải chi tiết mình sẽ cập nhật vào tuần sau. Các bạn folow mình để có thể nhận thông báo.

Chia sẻ bài viết ngay

Nguồn bài viết : Viblo

Những bài test JavaScript thật sự ảo ma

Bài 1. parseInt

Bài 2. Math.max

Bài 3. RegExp

Bài 4. Array.map và parseInt

Bài 5. Variable scope

Bài 6. toString() method

Apple đang tiến hành "cuộc chiến thầm lặng" chống lại Google, nguyên nhân tới từ một sự kiện xảy ra từ đầu những năm 2000

Một bài báo mất 1 tiếng để hoàn thành, siêu chatbot AI ChatGPT chỉ cần… 30 giây

Hướng dẫn sử dụng ngôn ngữ R cho người mới bắt đầu

10 plugin cần thiết của SublimeText dành cho các lập trình viên JavaScript