How can I get a number input value as a number instead of a string?

Given a number input:

<input type="number" id="create-y-small" name="create-y-small" value="0">

How do I get the value of the input as a number? The following returns a string:

$("#create-y-small").val()

Why is this the default behavior? Surely one should expect a number type input to give a number?

I've looked for answers elsewhere but no luck:

Input value is a string instead of a number - Answers use parsing to parse to a number. I don't want to parse to a number I just want to get the number as a number.

Get variable value from input number - OP seemed happy to get the value as a string

Get the value of a input number in jQuery - Same story

https://www.codegrepper.com/code-examples/javascript/how+to+get+the+value+of+input+number+using+jquery - Same story

Solution

You can use jQuery's valHooks to change how jQuery returns values.

$.valHooks.number = {
  get: function( elem ) {
    return elem.value * 1;
  }
};

You only need to do this once in your code and then all type=number inputs will instead return a number.

console.log(
  "num is a string",
  $("#num").val() === "1", 
  $("#num").val() === 1, 
  $("#txt").val() === "1",
  $("#txt").val() === 1)

$.valHooks.number = {
  get: function( elem ) {
    return elem.value * 1;
  }
};

// confirm no neffect on type='text'
console.log(
  "num is a number",
  $("#num").val() === "1", 
  $("#num").val() === 1, 
  $("#txt").val() === "1",
  $("#txt").val() === 1)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='number' id='num' value="1">
<input type='text' id='txt' value="1">