当前位置:实例文章 » HTML/CSS实例» [文章]js常用功能方法

js常用功能方法

发布人:shili8 发布时间:2025-02-07 11:44 阅读次数:0

**JavaScript 常用功能方法**

JavaScript 是一种广泛使用的编程语言,尤其是在前端开发中。它提供了许多有用的函数来简化代码编写和提高效率。在本文中,我们将介绍一些常用的 JavaScript 函数及其应用。

###1. 数组相关函数####1.1 `push()` 和 `pop()`

`push()` 方法用于向数组的末尾添加一个或多个元素,返回新数组的长度。`pop()` 方法则从数组的末尾移除一个元素,并返回该元素。

javascriptlet arr = [1,2,3];
console.log(arr.push(4)); // 输出:4console.log(arr); // 输出: [1,2,3,4]
console.log(arr.pop()); // 输出:4console.log(arr); // 输出: [1,2,3]


####1.2 `shift()` 和 `unshift()`

`shift()` 方法从数组的开头移除一个元素,并返回该元素。`unshift()` 方法则向数组的开头添加一个或多个元素,返回新数组的长度。

javascriptlet arr = [1,2,3];
console.log(arr.shift()); // 输出:1console.log(arr); // 输出: [2,3]
arr.unshift(0);
console.log(arr); // 输出: [0,2,3]


####1.3 `indexOf()` 和 `includes()`

`indexOf()` 方法用于在数组中查找指定元素的索引,如果不存在则返回 -1。`includes()` 方法则用于检查数组是否包含某个元素。

javascriptlet arr = [1,2,3];
console.log(arr.indexOf(2)); // 输出:1console.log(arr.includes(4)); // 输出: false


####1.4 `slice()`

`slice()` 方法用于从数组中提取一段元素,返回一个新数组。

javascriptlet arr = [1,2,3];
console.log(arr.slice(0,2)); // 输出: [1,2]


###2. 对象相关函数####2.1 `Object.keys()` 和 `Object.values()`

`Object.keys()` 方法用于返回一个数组,包含对象中所有可枚举属性的键名。`Object.values()` 方法则返回一个数组,包含对象中所有可枚举属性的值。

javascriptlet obj = { a:1, b:2, c:3 };
console.log(Object.keys(obj)); // 输出: ['a', 'b', 'c']
console.log(Object.values(obj)); // 输出: [1,2,3]


####2.2 `Object.assign()`

`Object.assign()` 方法用于将源对象的所有可枚举属性复制到目标对象中。

javascriptlet obj1 = { a:1, b:2 };
let obj2 = { c:3, d:4 };
console.log(Object.assign(obj1, obj2)); // 输出: { a:1, b:2, c:3, d:4 }


####2.3 `JSON.parse()` 和 `JSON.stringify()`

`JSON.parse()` 方法用于将 JSON 字符串解析为 JavaScript 对象。`JSON.stringify()` 方法则用于将 JavaScript 对象转换为 JSON 字符串。

javascriptlet jsonStr = '{"a":1, "b":2}';
console.log(JSON.parse(jsonStr)); // 输出: { a:1, b:2 }
console.log(JSON.stringify({ a:1, b:2 })); // 输出: '{"a":1,"b":2}'


###3. 函数相关函数####3.1 `bind()`

`bind()` 方法用于创建一个新函数,其 this 值绑定到指定的值。

javascriptlet obj = { a:1, b:2 };
function sayHello(name) {
 console.log(`Hello, ${name}!`);
}
sayHello.bind(obj, 'John')(); // 输出: Hello, John!


####3.2 `call()` 和 `apply()`

`call()` 方法用于调用一个函数,并传递参数。`apply()` 方法则用于调用一个函数,并传递一个数组作为参数。

javascriptfunction sayHello(name) {
 console.log(`Hello, ${name}!`);
}
sayHello.call(null, 'John'); // 输出: Hello, John!
sayHello.apply(null, ['John']); // 输出: Hello, John!


####3.3 `setTimeout()` 和 `setInterval()`

`setTimeout()` 方法用于在指定的时间后执行一个函数。`setInterval()` 方法则用于周期性地执行一个函数。

javascriptfunction sayHello() {
 console.log('Hello!');
}
setTimeout(sayHello,1000); // 输出: Hello! (延迟1 秒)
setInterval(sayHello,2000); // 每2 秒输出一次 Hello!


###4. 数学相关函数####4.1 `Math.random()`

`Math.random()` 方法用于生成一个随机数。

javascriptconsole.log(Math.random()); // 输出:一个随机数


####4.2 `Math.floor()` 和 `Math.ceil()`

`Math.floor()` 方法用于向下舍入到最接近的整数。`Math.ceil()` 方法则用于向上舍入到最接近的整数。

javascriptconsole.log(Math.floor(3.7)); // 输出:3console.log(Math.ceil(3.7)); // 输出:4


####4.3 `Math.pow()`

`Math.pow()` 方法用于计算两个数字的幂。

javascriptconsole.log(Math.pow(2,3)); // 输出:8


###5. 日期相关函数####5.1 `Date.now()`

`Date.now()` 方法用于获取当前时间戳。

javascriptconsole.log(Date.now()); // 输出: 当前时间戳


####5.2 `Date.parse()` 和 `Date.UTC()`

`Date.parse()` 方法用于将一个日期字符串解析为 Date 对象。`Date.UTC()` 方法则用于创建一个 Date 对象,表示世界标准时间。

javascriptconsole.log(Date.parse('2022-01-01')); // 输出:2022 年1 月1 日的时间戳console.log(Date.UTC(2022,0,1)); // 输出:2022 年1 月1 日的 Date 对象


####5.3 `Date.prototype.toLocaleString()` 和 `Date.prototype.toISOString()`

`Date.prototype.toLocaleString()` 方法用于将一个 Date 对象转换为本地时间字符串。`Date.prototype.toISOString()` 方法则用于将一个 Date 对象转换为 ISO8601 格式的时间字符串。

javascriptlet date = new Date();
console.log(date.toLocaleString()); // 输出: 本地时间字符串console.log(date.toISOString()); // 输出: ISO8601 格式的时间字符串


以上就是 JavaScript 常用功能方法的一些例子和注释。这些函数可以帮助你简化代码编写和提高效率。

其他信息

其他资源

Top