JavaScript学习笔记--变量与数据类型(二)----基本数据类型以及String、Number、Boolean包装类型

基本数据类型

基本数据类型一共有七种,分别是String、Number、BigInt、Boolean、null、undefined、Symbol,下面一一介绍。

String

  • 单引号、双引号都是string
  • 两个字符串相加是拼接,其他-*/都会运算错误

Number

JS采用IEEE 754标准的双精度64位格式表示数字,这个版本存在精度问题,并不是真正意义上的整数,一个看上去是整数的东西实际上是浮点数。

  • 包括浮点数和整数

  • 特殊的数字类型NaN,NaN与任何数值都不相等

  • isNaN()函数判断是否为NaN的唯一方式

  • Infinity:数据超过了JS可以表示的范围,是一个特殊的数字,判断一个变量是否是一个有穷数,使用内置函数isFinite()

  • 内置函数 parseInt()、parseFloat()可以将字符串转换为整型浮点数,该函数的第二个可选参数表示字符串所表示的数字的;除此之外,可以用一元运算符" + "来将数值转换为数字字符串。当给定的字符串不存在数值形式,函数会返回一个特殊的值NaN

  • parseInt() 和 parseFloat() 函数会尝试逐个解析字符串中的字符,直到遇上一个无法被解析成数字的字符,然后返回该字符所有数字字符组成的数字。但是运算符 "+"对字符串的转换方式与之不同, 只要字符串含有无法被解析成数字的字符,该字符串就将被转换成 NaN

  • 0.1 + 0.2 != 0.3的原因。计算机中的数字无论是定点数还是浮点数都是以多位二进制的方式进行存储的,0.1的二进制表示是一个无限循环的小数,js使用的浮点数标准需要对这种无限循环的二进制进行截取,导致精度丢失,造成0.1不是0.1,截取之后成了0.1000...001,0.2成了0.200...002,所以两者相加大于0.3

0.1 + 0.2 = 0.30000000000000004
  • 为什么console.log(0.1)在控制台输出时仍然是0.1?因为输出内容进行转换时,会将二进制转换为十进制十进制再转换为字符串,在这个转换过程中取近似值。

BigInt

可以理解为大整数

Boolean

  • 布尔值,包括true和false
  • false值,包括0NaN""' 'falseundefinednull,其他的值会被转换为true

null

表示一个空值null,变量存在,只不过值为null

undefined

未定义类型,表示一个未初始化的值,也就是还没有被分配的值

Symbol

  • ES6新增的数据类型,Symbol是原始值,且Symbol实例是唯一的不可变的,Symbol的用途是确保对象属性使用唯一标识符,不会发生属性冲突的危险。
  • 基本用法,需要使用Symbol函数初始化typeof返回symbol。可以给他传入一个字符串参数作为对符号的描述(相同的参数的Symbol也不一样),Symbol没有字面量语法
  • 不能使用new关键字作为构造函数使用
let sym1 = Symbol()
let sym2 = Symbol("foo")
  • 需要共享和重用Symbol实例的时候,可以使用let sys = Symbol.for(‘xxx’),在全局Symbol注册表中创建并重用,如果第一次则生成一个新的,不是第一次则调用已有的。可以使用Symbol.keyFor(Symbol实例)在全局注册表中查询
  • 凡是可以使用字符串或者数值作为属性的地方,都可以使用Symbol
  • 常用的内置Symbol,ES6引入的一批常用内置Symbol。
    1. for-of循环会在相关对象上使用Symbol.iterator
    2. instanceof操作符会使用Symbol.hasInstance函数来确定关系, (Foo[Symbol.hasInstance](f))
    3. 正则表达式匹配字符串会使用String.prototype.match()方法,String.prototypr.match()方法会使用Symbol.match为键的函数来对正则表达式求值
    4. 正则表达式替换字符串会使用String.prototype.replace()方法,String.prototypr.replace()方法会使用Symbol.replace为键的函数来对正则表达式求值
    5. 正则表达式搜索字符串会使用String.prototype.search()方法,String.prototypr.search()方法会使用Symbol.search为键的函数来对正则表达式求值
    6. 正则表达式匹配索引拆分字符串使用String.prototype.split()方法,String.prototypr.split()方法会使用Symbol.split为键的函数来对正则表达式求值

基本数据类型相关要点

  1. 基本类型的值是不可变
var str = "123hello321";
str.toUpperCase();     // 123HELLO321
console.log(str);      // 123hello321
  1. 基本类型的比较是值比较数据类型不同也可以比较,因为自动进行了数据类型的隐式转换
var a = 1;
var b = true;
console.log(a == b);    // true ==只进行值的比较
console.log(a === b);   // false ===先进行数据类型的比较,再进行值的比较

原始值的包装类型

为了方便操作原始值(基本数据),提供了Boolean、Number、String三种特殊的引用类型。这些类型和其他引用类型有一样的特点,但是也具有各自原始类型的对应的特殊行为。每当用到某个原始值的方法或者属性时,后台都会创建一个响应原始包装类型的对象,从而暴露出操作原始值的各种方法.

let s1 = "xxxx";
let s2 = s1.substring(2);

在上述代码中,s1是一个包含字符串的变量,是一个原始值,第二行紧接着在s1上调用了方法,原始值本身不是对象,因此逻辑上不应该有方法。这实际上是后台做了很多处理,为了实现上述操作,当第二行访问s1时,是以读模式访问字符串的。在此时,后台进行了三步操作

  1. 创建一个String类型的实例
  2. 调用实例上的特定方法
  3. 销毁实例
    这样就可以让原始值用有对象的行为,同理于Boolean和Number。

引用类型和原始值包装类型的主要区别

主要区别在于生命周期,在通过new实例化引用类型后,得到的实例会在离开作用域时销毁,而自动创建的原始值包装对象只存在于访问他的那行代码执行期间,这意味着不能够在运行时给原始值添加属性和方法.

原始值包装类型的实例上调用typeof会返回object所有原始值包装对象都会转换为布尔值true。

let obj = new Object("sss");
//当传给Object的是字符串的时候,会创建一个String的实例,
//如果是数值,则会创建Number的实例,如果是布尔值则创建Boolean的实例

Boolean的包装类型

  1. 重写valueOf()、toLocaleString()和toString()方法
    valueOf()方法返回一个原始值true或falsetoString()方法调用时也会被覆盖,返回字符串"true"或者"false"
  2. 所有对象布尔表达式中都会自动转换为true
let falseObject = new Boolean(false);
let result = falseObject && true;       //true,所有对象在布尔表达式中都会自动转换为true
  1. typeof对原始值返回boolean,对引用值返回object,上述falseObject instanceof Object 返回true

Number的包装类型

  1. 重写valueOf()、toLocaleString()和toString()方法
    valueOf返回Number对象表示的原始数值,另外两个方法返回数值字符串,其中toString()方法可选的接收一个表示基数的参数
  2. 其中Number包装类型有toFixed方法啊返回包含制定小数点位数的数值字符串
let num = 10;
condole.log(num.toFixed(2))  //"10.00"
  1. 但是0.1+0.2 != 0.3。ES所有的数值都以IEEE 754 64位格式存储,但是位操作并不直接应用64表示,而是先把值转换为32位整数,再进行位操作,之后再把结果转换为64位。

  2. ES6新增了Number.isInteger()方法,用于辨别一个数值是否保存为整数,因为有时候小数位的0可能会让人误以为数值是一个浮点值

String 包装类型

  1. 继承的valueOf()、toLocaleString()和toString()方法都返回对象的原始字符串
  2. 每个String对象都有一个length属性,表示字符串中字符的数量
  3. String类型提供了很多方法来解析和操作字符串,如charAt()方法返回给定索引位置的字符,由传给方法的整数参数指定

常用的字符串操作方法

  1. concat(),用于将一个或者多个字符串拼接成一个新的字符串,不改变原字符串;但是实际上使用’+'或者模板字符串更多
let str = "hello";
let result = str.concat("world");
console.log(str);    //hello
console.log(result); //helloworld
  1. slice(),substring(),substr(),从字符串中提取子字符串的方法,都返回调用他们的字符串的一个子字符串,而且都接收一个或者两个参数;对于slice()和substring()第一个参数表示字符串开始的位置,第二个参数表示字符串结束的位置(这个位置之前都会被提取出来);对于substr()第二个参数表示返回的子字符串的长度。对于三者,省略第二个参数都是表示提取到字符串末尾;不会修改原字符串,只会返回给新的字符串。
let string = "hello world";
console.log(string.slice(2))             // llo world
console.log(string.substring(2))         // llo world
console.log(string.substr(2))            // llo world
console.log(string.slice(2,4))           // ll
console.log(string.substring(2,4))       // ll
console.log(string.substr(2,5))         // llo w
  • 当传入的是负值的时候,slice方法把所有负值参数都当成字符串长度加上负参数值,即从倒数第几个开始;substring()会把所有的负参数值都转换为0(substring(3,0)等价于substring(0,3)),substr()会把第一个负参数值当成字符串长度加上该值,将第二个负参数值转换为0
  1. indexOf()和lastIndexOf():字符串定位子字符串方法。从字符串中搜索传入的字符串,并返回位置,没找到就返回-1。区别在于从头还是从尾找字符串。这两个方法都可以接收可选的第二个参数,表示开始搜索的位置,这意味着会从指定位置开始搜索,会忽略该位置
let string = "hello world";
console.log(string.indexOf("o"));  //4
console.log(string.lastIndexOf("o")) //7
console.log(string.indexOf("o",6));  //7
console.log(string.lastIndexOf("o",6)) //4

//例子:用一个数组保存一个字符串中的所有e所在的位置
let stringValue = "Lorem ipsum dolor sit amet, consectetur adipisicing elit";
let indexOfE = [];
let position = stringValue.indexOf("e");

while (position > -1) {
    indexOfE.push(position);
    position = stringValue.indexOf("e", position + 1);
}
console.log(indexOfE);
  1. startsWith()、endsWith()、includes(),字符串包含方法,ES6新增的判断字符串中是否包含另一个字符串的方法。这些方法都会从字符串中搜索传入的字符串,返回布尔值。可以简单的理解为以…开头,以…结尾,包含…;其中startsWith()和includes()接受第二个参数,表示开始搜索的位置,endesWith接受的第二个参数表示字符串末尾的位置
let message = "foobarbaz";
console.log(message.startsWith("foo"));      // true
console.log(message.startsWith("foo", 1));   // false
console.log(message.includes("bar"));         // true
console.log(message.includes("bar", 4));     // false
console.log(message.endsWith("bar"));      // false
console.log(message.endsWith("bar", 6));   // true
  1. trim()方法,创建字符串的一个副本,删除前后所有空格符再返回结果,不改变原来的字符串
let str = "    hello sss   ";
let trimstr = str.trim();        
console.log(str);       "    hello sss   ";
console.log(trimstr);   "hello sss";
  1. repeat(),接受一个整数参数,表示字符串要重复多少次,返回拼接所有副本后的结果,不改变原字符串

  2. padStart()和padEnd(),复制字符串,字符串如果小于指定长度(第一个参数),则会分别在start或end以第二个参数填充;否则返回原始字符串,不改变原字符串

let stringValue = "foo";
console.log(stringValue.padStart(6));         // "    foo"
console.log(stringValue.padStart(9, "."));   // "......foo"
console.log(stringValue.padEnd(6));           // "foo    "
console.log(stringValue.padEnd(9, "."));     // "foo......"
console.log(stringValue.padStart(8, "bar")); // "barbafoo"
console.log(stringValue.padStart(2));          // "foo"
console.log(stringValue.padEnd(8, "bar"));    // "foobarba"
console.log(stringValue.padEnd(2));             // "foo"
  1. 字符串迭代与解构。字符串上暴露了一个iterator方法,表示迭代字符串每个字符,可以手动调用。Symbol.iterator为每个对象定义了默认的迭代器,可以被for...of循环使用;有了迭代器后就可以通过解构操作符来解构,更加方便的把字符串分割成字符数组,下面都不改变原字符串
let message = "abs";
let iterator = message[Symbol.iterator]();
console.log(iterator.next()) //{value:"a", done: false}

//还可以通过`for..of`来访问字符串
for (const charm of message ){
    console.log(charm);    
}
//a
//b
//s
//可以`解构`
let message = "asdfx";
console.log([...message]);
const array = [...message];
console.log(array);//['a', 's', 'd', 'f', 'x']
  1. toLowerCase()、toUpperCase()、toLocaleLowCase()、toLocaleUpperCase(),字符串大小写转换,后面两个是用来兼容不同的地区,不改变原字符串

  2. 字符串模式匹配方法:match方法,等同于RegExp对象的exec()方法;search()方法,唯一参数,与match一样,接受正则表达式字符串或者RegExp对象,返回模式第一个匹配的位置索引;

  3. 字符串替换,replace()方法,接收两个参数,第一个可以是一个RegExp对象或一个字符串,第二个是一个字符串或者函数

  4. 最后一个模式匹配相关的方法是split(),根据传入的分隔符将字符串拆分成数组,作为分隔符的参数可以是字符串或者RegExp对象

  5. localeCompare()方法,比较两个字符串,返回-1、0、1中的一个

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值