JS基础知识(一)变量类型和计算

变量类型和计算

问题：

1. JS中使用typeof能得到哪些类型

2. 何时使用=== 何时使用==

3. JS有哪些内置函数

4. JS变量按照存储方式区分为哪些类型，并描述其特点
5. 如何理解JSON

知识点：

  1.变量类型

     （1）值类型vs 引用类型

     首先原始类型存储的都是值，是没有函数可以调用的，比如 undefined.toString()

     值类型：把变量的值都存在变量的一个位子里。

( 

六种 原始值类型 ES6前

• boolean
• null
• undefined
• number
• string
• symbol
  es10 bigint

)

首先原始类型存储的都是值，是没有函数可以调用的，比如 undefined.toString() .

但对于像'1'.tostring()是因为强制类型转化。

     引用类型：把属性存在对象里，通过指针来指向对象。

//值类型
var a =100;var b =a;

a
//100
b
//100
a=200
//200
b
//100

 a,b为值类型，将a的值赋值给b，值类型都自己管自己的，改了就是自己的改了，跟别人没关系。

//引用类型
var a= {age:20}

var b = a

b
//{age: 20}
a
//{age: 20}
b.age=21
//21
a
//{age: 21}

a,b为对象，为引用类型。引用类型为属性存在对象里，通过指针来取得。那些值都是共享的，他们都指向相同的一个对象时，那个对象改变了，所有指向他的都跟着改变了。

引用类型：对象，函数，数组都是属于引用类型。

引用类型可以可以无限扩展属性，共用空间。

//引用类型扩展属性(对象)
var a= {age:20}

a.age
//20
a.name='aa'
//"aa"
a.bb='true'
//"true"
a
//{age: 20, name: "aa", bb: "true"}

//引用类型扩展属性(数组)
var arr = [1,2,3]

arr.age=21
//21
var arr2 = arr

arr.age=22
//22
arr
//(3) [1, 2, 3, age: 21]
arr2
//(3) [1, 2, 3, age: 21]
arr2.a=2
//2
arr
//(3) [1, 2, 3, age: 21, a: 2]
arr2
//(3) [1, 2, 3, age: 21, a: 2]

引用类型共同指向以后，无论是先者还是后者，指向的都是同一个了。 

//引用类型扩展属性(函数)
function fn() {}

fn
//ƒ fn() {}
fn.age=21
//21
var fn1 =fn

fn1.age
//21
fn1.age=22
//22
fn.age
//22

function test(person) {
  person.age = 26
  person = {
    name: 'yyy',
    age: 30
  }

  return person
}
const p1 = {
  name: 'yck',
  age: 25
}
const p2 = test(p1)
console.log(p1) // -> {name: "yck", age: 26}
console.log(p2) // -> {name: "yyy", age: 30}

 

• 首先，函数传参是传递对象指针的副本
• 到函数内部修改参数的属性这步，我相信大家都知道，当前 p1 的值也被修改了
• 但是当我们重新为 person 分配了一个对象时就出现了分歧。
• p1分配了一个新地址，同时person也分配了一个新地址。

（2）typeof变量类型

     一共有六种：undefined,boolean,string,number,object,function

//typeof
typeof undefined  //undefined
typeof '123'  //string
typeof NaN   //number
typeof 123   //number
typeof true  //boolean
typeof {}  //object
typeof [] //object
typeof null  //object
typeof Function //function

注意： null也是对象，typeof不能区分对象和数组，将其都视为object，只能区别出function。以及之前的，对象，数组，函数都是引用类型。想要区分数组和对象 需要使用instanceof

2.变量计算

涉及到一个“强制类型转化”

（1）字符串拼接
以+例子

当类型相同的进行+，例如数字进行时，会是数字类型的，当数字和字符串相加，会将其转化成字符进行拼接。

//字符串拼接
100+10
//110
100+'10'
//"10010"

1 + '1' // '11'
true + true // 2
4 + [1,2,3] // "41,2,3"

'a' + + 'b' // -> "aNaN"

4 * '3' // 12
4 * [] // 0
4 * [1, 2] // NaN

（2）==运算符

//==运算符
100 == '100'
//true
''==0
//true
100==='100'
//false
''===0
//false
null == undefined
//true
null ===undefined
//false

 ==运算符其实是比较其中的值是否相等，而===还会判断其类型是否相等。例如‘’ 空字符 以及0 都被转化成false。以及null,undefined也被转化成false.而第一个将100转成了字符串进行比较。

对于 == 来说，如果对比双方的类型不一样的话，就会进行类型转换.

假如我们需要对比 x 和 y 是否相同，就会进行如下判断流程：

1. 首先会判断两者类型是否相同。相同的话就是比大小了
2. 类型不相同的话，那么就会进行类型转换
3. 会先判断是否在对比 null 和 undefined，是的话就会返回 true
4. 判断两者类型是否为 string 和 number，是的话就会将字符串转换为 number

   1 == '1'
         ↓
   1 ==  1
   

5. 判断其中一方是否为 boolean，是的话就会把 boolean 转为 number 再进行判断

   '1' == true
           ↓
   '1' ==  1
           ↓
    1  ==  1
   

6. 判断其中一方是否为 object 且另一方为 string、number 或者 symbol，是的话就会把 object 转为原始类型再进行判断

   '1' == { name: 'yck' }
           ↓
   '1' == '[object Object]'

 

（3）if运算符

//if运算符
if(100){console.log(100)}
//100
if(''){console.log(100)}
//undefined

 自动转化成boolean进行判别。

if中认为是false的几个值：0，NaN,null,'',undefined

if(0){console.log('1')}
//undefined
if(NaN){console.log('1')}
//undefined
if(null){console.log('1')}
//undefined
if(''){console.log('1')}
//undefined
if(undefined){console.log('1')}
//undefined

（4）逻辑运算

10 && 0
//0
''||'abc'
//"abc"
!window.abc 
//true

 &&与

||或

!非

快速判断一个值是true还是false：!!

var a = 100;

!!a
//true
var b =''

!!b
//false

（5） boolean

在条件判断时，除了 undefined， null， false， NaN， ''， 0， -0，其他所有值都转为 true，包括所有对象。

(6) 对象转原始类型

对象在转换类型的时候，会调用内置的 [[ToPrimitive]] 函数，对于该函数来说，算法逻辑一般来说如下：

• 如果已经是原始类型了，那就不需要转换了
• 调用 x.valueOf()，如果转换为基础类型，就返回转换的值
• 调用 x.toString()，如果转换为基础类型，就返回转换的值
• 如果都没有返回原始类型，就会报错 

当然你也可以重写 Symbol.toPrimitive ，该方法在转原始类型时调用优先级最高。

let a = {
  valueOf() {
    return 0
  },
  toString() {
    return '1'
  },
  [Symbol.toPrimitive]() {
    return 2
  }
}
1 + a // => 3

 

 3.内置函数 (9种)

Object
//ƒ Object() { [native code] }
Array
//ƒ Array() { [native code] }
Function
//ƒ Function() { [native code] }
Boolean
//ƒ Boolean() { [native code] }
Number
//ƒ Number() { [native code] }
String
//ƒ String() { [native code] }
Date
//ƒ Date() { [native code] }
RegExp
//ƒ RegExp() { [native code] }
Error
//ƒ Error() { [native code] }

4.JSON 
json有点像Math,是JS里的一个对象。

JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式

json有两个方法，parse,stringify.

parse:转化为对象

stringify:转化为字符串

JSON.stringify({ x: 5 });                  // '{"x":5}'

JSON.parse('[1, 5, "false"]');             // [1, 5, "false"]

JSON
//JSON {parse: ƒ, stringify: ƒ, Symbol(Symbol.toStringTag): "JSON"}
Math
//Math {abs: ƒ, acos: ƒ, acosh: ƒ, asin: ƒ, asinh: ƒ, …}

JSON也是一个数据格式
.json

 

 

问题解决：

1. JS中使用typeof能得到哪些类型
   undefined,string,number,boolean,object,function.

2. 何时使用=== 何时使用==
   
    一般都是使用===会更好，除了一种情况。

   //jQuery源码中
   If(obj.a == null)
   Obj.a===null || obj.a ===undefined

    

3. JS有哪些内置函数
   Object,String,Number,Boolean,Array,Function,Date,RegExp,Error

4. JS变量按照存储方式区分为哪些类型，并描述其特点
   存储方式，存在系统中内存中的方式。
   值类型：分块存在内存中，互相不干涉
   引用类型：共用一个内存块，相互干涉，共享，节省资源
5. 如何理解JSON

         JS里的一个对象，像Math一样。有两个方法stringify,parse。同时也是一种数据格式.json