es6 基础学习之字符串和函数的扩展

ES6 中的字符串扩展

ES6 提供了多种新的字符串操作方法和特性。

1. 模板字符串(Template Strings)

使用反引号(`````)而非单引号或双引号来创建字符串,并允许插入变量:

javascript 复制代码
const name = 'John';
const greeting = `Hello, ${name}!`;
console.log(greeting); // 输出 "Hello, John!"

2. 新增的字符串方法

  • startsWith: 判断字符串是否以给定字符串开头
  • endsWith: 判断字符串是否以给定字符串结尾
  • includes: 判断字符串是否包含给定字符串
  • repeat: 重复字符串指定次数
javascript 复制代码
const str = 'hello';

console.log(str.startsWith('he'));  // true
console.log(str.endsWith('lo'));    // true
console.log(str.includes('ell'));   // true
console.log(str.repeat(2));         // 'hellohello'

ES6 中的函数扩展

1. 默认参数

在 ES6 中,函数参数可以有默认值。

javascript 复制代码
function greet(name = 'John', age = 30) {
  console.log(`Hello ${name}, you are ${age} years old.`);
}

greet();                // 输出 "Hello John, you are 30 years old."
greet('Jane', 25);      // 输出 "Hello Jane, you are 25 years old."

2. Rest 参数

使用 ... 操作符接收多余的参数,这些参数被存储在一个数组中。

javascript 复制代码
function sum(...numbers) {
  return numbers.reduce((prev, curr) => prev + curr, 0);
}

console.log(sum(1, 2, 3, 4));  // 输出 10

3. 箭头函数(Arrow Functions)

箭头函数提供了一种更简洁的方式来写函数。

javascript 复制代码
const square = x => x * x;

console.log(square(5));  // 输出 25

注意:箭头函数不绑定自己的 thisargumentssupernew.target。这些函数表达式更适用于那些不需要自己的 this 值的函数。

4. 函数名属性

函数名属性 name 可以返回函数名。

javascript 复制代码
function foo() {}
const bar = function() {};

console.log(foo.name);  // 输出 "foo"
console.log(bar.name);  // 输出 "bar" 在 ES6 中,匿名函数也能有 name 属性

以上只是 ES6 在字符串和函数方面的一些基础扩展。这些新特性使得 JavaScript 编程更加灵活和强大。希望这能帮助你更好地理解和使用 ES6。

相关推荐
BillKu29 分钟前
Vue3 axios 请求设置 signal 信号属性,以便 abort 取消请求
前端·javascript·vue.js
灿灿121384 小时前
Vue 项目路由模式全解析:从 hash 到 history 再到 abstract
javascript·vue.js·哈希算法
BillKu4 小时前
Vue3 + Element Plus中el-table加载状态分析
javascript·vue.js·elementui
大明884 小时前
滚动锁定技术解析:以Ant Design的useScrollLocker为例
前端·vue.js·前端框架
吃肉不吃皮4 小时前
【Vue转React】更新机制对比,React开发中的心智负担从何而来?
前端·vue.js·react.js
黑土豆5 小时前
使用Web Worker异步解析Word文档:基于Vue 3和Mammoth.js的完整实现
前端·javascript·vue.js
五月仲夏5 小时前
vue中的h渲染函数
前端·javascript·vue.js
wh_xia_jun5 小时前
4步使用 vue3 路由
前端·javascript·vue.js
江城开朗的豌豆6 小时前
Vue为什么要用虚拟DOM?直接操作真实DOM不香吗?
前端·javascript·vue.js
萌萌哒草头将军6 小时前
🚀🚀🚀恭喜 Rolldown 获得 JS 开源奖年度突破奖,2025 年 JS 开源奖典礼回顾!🎉🎉🎉
前端·vue.js·react.js