JavaScript丨内置函数(三)

简介: 这是`JavaScript`系列教程的第九期,这是最后一期讲内置函数了!

这是JavaScript系列教程的第九期,这是最后一期讲内置函数了!

本期主要讲剩下的几个常用内置函数,Number,Object,ParseInt,ParseFloat,String

Number

Number构造函数包含常量和处理数值的方法。其他类型的值可以使用 Number() 函数转换为数字。

isInteger()

isInteger()方法用来判断给定的参数是否为整数。我们一般会将这个封装成为一个函数,用于判断数字是否为整数。

const isInt = (num) => {
  return Number.isInteger(Number(num));
};

console.log(isInt("3")); // true
console.log(isInt("3.3")); // false
console.log(isInt(3)); // true
console.log(isInt(3.3)); // false

上面函数就是传入一个参数,参数可能是数字,也可能是字符串,所以我们需要将字符串转化为数字,然后再用isInteger()来判断是否为整数。

toFixed()

toFixed()方法使用定点表示法来格式化一个数值。

const fixed = (num, digit) => {
  return Number.parseFloat(num).toFixed(digit);
};

console.log(fixed(2.22222, 2)); // 2.22
console.log(fixed("2.22222", 2)); // 2.22

将上面的封装位一个函数,传入需要转化的数字,以及转化的位数,可以看到结果保留了两位小数。

toString()

toString() 方法返回指定 Number 对象的字符串表示形式。

console.log((111).toString()); // 111
console.log((111).toString(2)); // 1101111

toString() 接受一个参数,默认是10,可以填写2-36,这里其实就是可以理解为进制,需要转为2进制,就填写2,就像上面的一样。

Object

Object 是 JavaScript 的一种数据类型。它用于存储各种键值集合和更复杂的实体。可以通过 Object() 构造函数或者使用对象字面量的方式创建对象。

assign()

Object.assign() 静态方法将一个或者多个源对象中所有可枚举的自有属性复制到目标对象,并返回修改后的目标对象。

const obj = { name: "orange", age: 18 };
const obj1 = {};
Object.assign(obj1, obj);
console.log(obj1); // { name: 'orange', age: 18 }

从以上栗子可以看出,第一个参数是需要赋值的变量,第二个是目标值,也就是需要复制的那个值。

keys()

Object.keys() 静态方法返回一个由给定对象自身的可枚举的字符串键属性名组成的数组。

const obj = { name: "orange", age: 18 };
const keys = Object.keys(obj)
console.log(keys); // [ 'name', 'age' ]

上面的栗子使用Object.keys()获取了obj的键。

values()

前面的Object.keys()是获取Object的键,那么Object.values()就是返回键的值,Object.values()静态方法返回一个给定对象的自有可枚举字符串键属性值组成的数组。

const obj = { name: "orange", age: 18 };
const keys = Object.values(obj)
console.log(keys); // [ 'orange', 18 ]

上面的栗子就是输出了一个数组,数组的内容就是键所对应的值!

parseFloat()

parseFloat() 函数解析一个参数(必要时先转换为字符串)并返回一个浮点数。

parseInt()

parseInt(string, radix) 解析一个字符串并返回指定基数的十进制整数,radix 是 2-36 之间的整数,表示被解析字符串的基数。

console.log(parseInt("1111")); // 1111
console.log(parseInt("1111", 2)); // 15

一般情况下,默认第二个参数位10,或者不填写!

String

String 对象用于表示和操作字符序列。

includes()

includes() 方法执行区分大小写的搜索,以确定是否可以在一个字符串中找到另一个字符串,并根据情况返回 true 或 false。

const str = "这里是orange写的";
const word = "orange";
console.log(str.includes(word)); // true

indexOf()

String 的 indexOf() 方法在字符串中搜索指定子字符串,并返回其第一次出现的位置索引。它可以接受一个可选的参数指定搜索的起始位置,如果找到了指定的子字符串,则返回的位置索引大于或等于指定的数字。

const str = "这里是orange写的";
const word = "orange";
console.log(str.indexOf(word)); // 3

从0开始,找到了第四位出现了,就是3。

slice()

slice() 方法提取字符串的一部分,并将其作为新字符串返回,而不修改原始字符串。两个参数可选,第一个是开始的位置,第二个是排除第一个字符的索引。

const str = "这里是orange写的";
const word = "orange";
console.log(str.slice(3)); // orange写的
console.log(str.slice(3, 9)); // orange

简单理解就是,第一个参数是提取字符串的第一个位置,第二个参数就是提取字符串的最后一个位置,不填写第二个参数的话,就是直接到字符串的最后了!

split()

split() 方法接受一个模式,通过搜索模式将字符串分割成一个有序的子串列表,将这些子串放入一个数组,并返回该数组。

const str = "这里是orange写的,你好";
console.log(str.split(',')); // [ '这里是orange写的', '你好' ]

可以看到,参数就是分隔符,通过字符串中的,,将整个字符串分割为两个字符串,返回一个数组。

substring()

String 的 substring() 方法返回该字符串从起始索引到结束索引(不包括)的部分,如果未提供结束索引,则返回到字符串末尾的部分。

const str = "这里是orange写的,你好";
console.log(str.substring(3, 9)); // orange

如果传入的参数都是正数的话,substring()slice()是一样的作用,但是你传入的是负数的话,就会有点差别了,你可以试试看哟

toLocaleLowerCase()

String 的 toLocaleLowerCase() 方法会根据特定区域设置的大小写映射规则,将字符串转换为小写形式并返回。简单的讲,就是大小字母全部转化为小写的。

console.log('ORANGE'.toLocaleLowerCase()); // orange

toLocaleUpperCase()

既然可以大写转化为小写,那么肯定也有小写转化为大写的!

console.log('orange'.toLocaleUpperCase()); //ORANGE

toString()

String 的 toString() 方法返回该字符串的值。一般使用就是将数字转化为字符串,当然也可以将其他的转化为字符串。

console.log((111).toString()); // 111
console.log({ name: "orange", age: 18 }.toString()); // [object Object]
console.log(function(){console.log(1)}.toString()); // function(){console.log(1)}

trim()

String 的 trim() 方法会从字符串的两端移除空白字符,并返回一个新的字符串,而不会修改原始字符串。

console.log(' orange '.trim()); // orange
console.log('orang e '.trim()); // orang e

可以看到,确实只会去除头尾两端的空白字符!

总结

内置函数挺多的,我用三期总结了在项目中常用的一些内置函数,涉及到了很多的类型的函数,内置函数就讲到这里了,下一期就是讲讲什么是dom,什么是bom了!

相关文章
|
2天前
|
JavaScript 前端开发
在JavaScript中,函数原型(Function Prototype)是一个特殊的对象
JavaScript中的函数原型是一个特殊对象,它为所有函数实例提供共享的方法和属性。每个函数在创建时都有一个`prototype`属性,指向原型对象。利用原型,我们可以向所有实例添加方法和属性,实现继承。例如,我们定义一个`Person`函数,向其原型添加`greet`方法,然后创建实例`john`和`jane`,它们都能调用这个方法。尽管可以直接在原型上添加方法,但推荐在构造函数内部定义以封装数据和逻辑。
8 2
|
4天前
|
前端开发 JavaScript 数据处理
在JavaScript中,异步函数是指什么
【5月更文挑战第9天】JavaScript中的异步函数用于处理非立即完成的操作,如定时器、网络请求等。它们可通过回调函数、Promise或async/await来实现。示例展示了如何使用async/await模拟网络请求:定义异步函数fetchData返回Promise,在另一异步函数processData中使用await等待结果并处理。当fetchData的Promise解析时,data变量接收结果并继续执行后续代码。注意,调用异步函数不会阻塞执行,而是会在适当时间点继续。
10 0
|
4天前
|
自然语言处理 JavaScript 前端开发
在JavaScript中,this关键字的行为可能会因函数的调用方式而异
【5月更文挑战第9天】JavaScript中的`this`关键字行为取决于函数调用方式。在非严格模式下,直接调用函数时`this`指全局对象,严格模式下为`undefined`。作为对象方法调用时,`this`指向该对象。用`new`调用构造函数时,`this`指向新实例。通过`call`、`apply`、`bind`可手动设置`this`值。在回调和事件处理中,`this`可能不直观,箭头函数和绑定方法可帮助管理`this`的行为。
10 1
|
4天前
|
JavaScript 前端开发 网络架构
JavaScript中的箭头函数是一种新的函数表达形式
【5月更文挑战第9天】JavaScript的箭头函数以简洁语法简化函数定义,其特性包括:1) 不绑定自身this,继承上下文的this,适合回调和事件处理;2) 没有arguments对象,需用剩余参数语法访问参数;3) 不能用作构造函数,无new调用;4) 没有prototype属性,不支持基于原型的继承。箭头函数在特定场景下优化了this处理,但使用时要注意与普通函数的差异。
8 2
|
7天前
|
JavaScript 前端开发
js的一些内置函数
js的一些内置函数
7 1
|
7天前
|
JavaScript 前端开发 索引
js的includes函数
js的includes函数
12 1
|
7天前
|
JavaScript 安全 前端开发
js的map函数
js的map函数
7 0
|
7天前
|
JavaScript 前端开发
js的filter函数
js的filter函数
9 1
|
7天前
|
JavaScript 前端开发
js的函数
js的函数
7 0
|
7天前
|
JavaScript 前端开发
js的join函数
js的join函数
8 1