Каверзные вопросы по Javascript — Приведение типов

Приведение типов

Приведение типов — этоавтоматическое или неявное преобразование значений из одного типа данных в другой.

Чем приведение типов отличается от преобразования типов?

Приведение типов является неявным, тогда как преобразование типов может быть как неявным, так и явным.

Приведение типов — Js неявно преобразует число 9 в строку «9».

const value1 = "5";
const value2 = 9;
let sum = value1 + value2;

console.log(sum); // "59"

Преобразование типов — Number() можно использовать для преобразования «5» в число 5.

const value1 = "5";
const value2 = 9;
let sum = Number(value1) + value2;

console.log(sum); // 14

Ложные значения

Boolean('')           // false
Boolean(0)            // false     
Boolean(-0)           // false
Boolean(NaN)          // false
Boolean(null)         // false
Boolean(undefined)    // false
Boolean(false)        // false

Истинные ценности

Все, что не входит в список выше, является истинным значением, например -

Boolean({})             // true
Boolean([])             // true
Boolean(Symbol())       // true
!!Symbol()              // true
Boolean(function() {})  // true

Вопросы

1. Что будет записано в консоль?

console.log(![]);        // false
console.log([] == ![]);  // true 
console.log([] === ![]); // false

Ответ: неверно, верно, неверно

Почему?

a. ![] : [] является истинным значением, поэтому ![] = false

b. [] == ![] : введите приведение +[] == +![], +[] = 0 и ![] = false, чтобы оно стало +false =› 0==0 =› true
Javascript пытается преобразовать обе стороны в число, если обе стороны типы не одинаковы. И если это объект, он пытается преобразовать в значение primitive.

typeof([]) // "object" - convert to primitive type - string
typeof(![]) // "boolean" - convert to number - 0
Number(![]) // 0
[].toString() // ”” - the empty string
=> []==![]

=> []==false // Type conversion by the statement itself

=> []==0 // To number of right operand

=> ""==0 // To Primitive call for Array which will in this case convert to empty string

=> 0==0 // To number call of "" which is 0

=> true

в. [] === ![] : так как === также проверяет тип, приведения типов нет, поэтому возвращается [] === false =› false

2. Что будет записано в консоль?

console.log(null == false); // false
console.log(null == true);  // false

Ответ: неверно, неверно

Почему?

Приведение типа дает false = +false = 0, но этого не происходит с null как null is only comparable with undefined и не приводится к 1 или +0.

3. Что будет записано в консоль?

console.log(typeof null)              // 'object'
console.log(null instanceof Object)   // false
console.log(NaN instanceof Number)    // false
console.log(typeof NaN)               // 'number'

Ответ: «объект», ложь, ложь, «число».

а. согласно правилам, null имеет тип объекта.
b. false: null является примитивным значением и не является объектом
c. false: NaN — это примитивное значение, а не число.

4. Что будет записано в консоль?

console.log(typeof new String("str") === typeof String("str"));

Ответ: неверно

Почему?
а. typeof new String(“str”) : "объект"
б. typeof String(“str”) : «строка»

5. Что выводит приведенный ниже код?

console.log(Boolean('false'))      // true
console.log(Boolean(false))        // false
console.log('3' + 1)               // 31
console.log('3' - 1)               // 2
console.log('3' - ' 02 ')          // 1 
console.log('3' * ' 02 ')          // 6
console.log(25 + -"2" - false + "10");  // 2310 
console.log(Number('1'))           // 1
console.log(Number('number'))      // NaN
console.log(Number(null))          // 0
console.log(Number(false))         // 0 

Ответ:
верно, неверно, 31, 2, 1, 6,2310, 1, NaN, 0, 0

6. Что выводит приведенный ниже код?

console.log(JSON.stringify([1,2,null,3]))       // [1,2,null,3]
console.log(JSON.stringify([1,2,undefined,3]))  // [1,2,null,3]
console.log(null === undefined)                 // false
console.log(null == undefined)                  // true
console.log(null == 0)                          // false
console.log(null < 0)                           // false
console.log(null > 0)                           // false
console.log(null <= 0)                          // true
console.log(null >= 0)                          // true
console.log(undefined == 0)                     // false
console.log(undefined < 0)                      // false
console.log(undefined > 0)                      // false
console.log(undefined <= 0)                     // false
console.log(undefined >= 0)                     // false

Ответ:
[1,2,null,3] —счастливый путь: «[1,2,null,3]»
[1,2,null,3] —JSON не имеет неопределенного значения, оно заменено на null
false —null -> 0 и undefined -> NaN, тогда НЕ строго равно
true —Особое правило
false —Особое правило: null не преобразуется на 0 здесь
false —null -› 0
false — null -› 0
true — null -› 0
true —null —› 0
false —undefined —› NaN
false —undefined -› NaN
false — undefined -› NaN
false —undefined -› NaN
false — сильный> неопределенный -> NaN

7. Что выводит приведенный ниже код?

let obj1 ={name:”vineet”}
let obj2 ={name:”vineet”}
console.log(obj1===obj2);     // false
console.log(JSON.stringify(obj1)===JSON.stringify(obj2)); // true
console.log(obj1==obj2);  // false
console.log(JSON.stringify(obj1)==JSON.stringify(obj2)); // true

Ответ:
ложь
истина
ложь
истина

8. Что выводит приведенный ниже код?

var a =1
var b ='1'
console.log(a===b);
console.log(a==b);

Ответ:
неверно
верно

9. Что будет выведено?

(true + false) > 2 + true

Ответ:
неверно

Расчет:-

=> 1 + 0) > 2 + 1
=> 1 > 3
=> false

10. Что будет на выходе?

console.log(-"giddyup" + 409);

Ответ:
NaN

11. Что будет на выходе?

const myContainer = {
  height: 4,
  width: 2,
}
const num = 12;
console.log(num + myContainer)

Ответ:
12[объект Объект]

=> 12 + myContainer
=> 12 + '[object Object]'
=> 12[object Object]

12. Что будет на выходе?

const myContainer = {
  height: 4,
  width: 2,
  valueOf: function() {
    return this.height * this.width
  }
}
const num = 12;
console.log(num + myContainer)

Ответ:
20

=> 12 + myContainer.valueOf()  // can also define toString function
=> 12 + 8
=> 20

Этапы сравнения объектов в числовом преобразовании: —

1. Если input уже является примитивом, ничего не делайте и верните его.

2. Вызвать input.toString(), если результат примитивен, вернуть его.

3. Вызвать input.valueOf(), если результат примитивен, вернуть его.

4. Если ни input.toString(), ни input.valueOf() не дают примитива, бросить TypeError.

13. Как работают сравнения с null ?

null == 0               // false, null is not converted to 0
null == null            // true
undefined == undefined  // true
null == undefined       // true

Почему?

• null равно только null или undefined и не равно ничему другому.

14. Как сделать выбор между числовым преобразованием или строковым преобразованием?

• +активирует числовое преобразование

true + false             // 1

• / арифметический оператор запускает числовое преобразование

12 / "6"                 // 2

• + имеет ассоциативность слева направо, поэтому выражение "number" + 15 запускается первым, вызывая преобразование строки 15 для конкатенации. То же самое срабатывает для 3 для выражения "number15" + 3.

"number" + 15 + 3        // 'number153'

• Оператор сравнения > запускает числовое преобразование нуля в 0 и [1] в 1 для сравнения.

[1] > null        => 1 > 0 => true

• == запускает числовое преобразование

'true' == true
+'true' == +true
NaN == 1
false

== обычно запускает числовое преобразование, но это не относится к нулевому значению. null можно сравнивать только с самим собой или с undefined.

null == ''
==> false

• == запускает числовое преобразование. Array.valueOf возвращает сам массив, за которым следует toString(), который преобразует массив [‘x’] в ‘x’.

['x'] == 'x'  
==> 'x' == 'x'
==>  true

• Оператор + запускает числовое преобразование для []. Метод valueOf() массива игнорируется, так как он возвращает сам массив, который не является примитивным. toString массива возвращает пустую строку.

[] + null + 1  
==>  '' + null + 1  
==>  'null' + 1  
==> 'null1'

• Логические операторы || и && приводят операнды к логическим значениям, но возвращают исходные операнды (не логические значения). 0 ложно, а '0' верно, потому что это непустая строка. {} пустой объект тоже правдив.

0 || "0" && {}  
==>  (0 || "0") && {}
==> (false || true) && true  // internally
==> "0" && {}
==> true && true             // internally
==> {}

• Все операнды не являются примитивными значениями, поэтому + начинается с крайнего левого запуска числового преобразования. Оба метода Object’s и Array’s valueOf возвращают сам объект, поэтому он игнорируется. toString() используется как запасной вариант. Хитрость здесь в том, что первый {} рассматривается не как литерал объекта, а скорее как оператор объявления блока, поэтому он игнорируется. Вычисление начинается со следующего выражения +[], которое с помощью метода toString() преобразуется в пустую строку, а затем в 0.

{}+[]+{}+[1]
==> +[]+{}+[1]
==> 0 + {} + [1]
==> 0 + '[object Object]' + [1]
==> '0[object Object]' + [1]
==> '0[object Object]' + '1'
==> '0[object Object]1'

• + здесь запускает преобразование строк — конкатенацию

!+[]+[]+![]  
==> (!+[]) + [] + (![])
==> !0 + [] + false
==> true + [] + false
==> true + '' + false
==> 'truefalse'

Источники

https://www.freecodecamp.org/news/js-type-coercion-explained-27ba3d9a2839/