一、不定参
定参：函数的参数固定。（一般不超过4个）
- 不定参：函数的参数是不固定。（理论可以有无数个）
- 不定参的函数如何封装。
- 列如:console.log(1, 2, 3, 4...);
- arguments是一个数组.(argments[不定参])
- arguments存储着所有的实参.
console.log(arguments);// 实参的个数
console.log(arguments.length)myLog(1, 2, 3);
myLog('我', '你', '它', '她', '他');
function myLog() {
// arguments不需要声明,默认就存在.
// 注意: 函数外面无法使用arguments
// 循环arguments,访问所有的实参.
for (let i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
// 报错,函数外面无法使用arguments
// alert(arguments);// 不管是不是不定参函数,都可以使用arguments.
function fn () {
return arguments[0] * arguments[1]
}
let num1 = fn (1, 2);
let num2 = fn (5, 4);二、ES6的不定参
- arguments => ES5的不定参 (名字固定) (伪数组)
- rest参数 => ES6的不定参 (名字任意设置) (数组)
<script>
myLog(1, 2, 3);
myLog('我', '你', '它', '她', '他');
function myLog (...args) {
// 实参列表
// console.log('args', args);
// 实参个数
// console.log('length', args.length);
for (let i = 0; i < args.length; i++) {
console.log(args[i]);
}
}
</script>三、封装不定参
<script>
// arguments
// ...args
// 封装一个fn函数, 实现把所有实参求和后返回.
let num1 = fn (1, 231, 34, 124, 67, 867, 897890, 7890);
let num2 = fn (3, 2311, 342, 1242);
function fn () {
// 结果
let num = 0;
// 循环把所有的实参都加到num上
for (let i = 0; i < arguments.length; i++) {
num += arguments[i]
}
// 把结果返回到函数外面
return num
}
</script>四、封装一次就够
相同的逻辑 => 封装一个函数就够了.
函数的作用 => 函数表示一个功能,这个功能可以重复使用.
同一个函数可以调用多次.(使用多次).
<script>
let num1 = fn1 (1, 231, 34, 124, 67, 867, 897890, 7890);
let num2 = fn2 (3, 2311, 342, 1242);!
function fn1 () {
// 结果
let num = 0;
// 循环把所有的实参都加到num上
for (let i = 0; i < arguments.length; i++) {
num += arguments[i]
}
// 把结果返回到函数外面
return num
}
function fn2 () {
// 结果
let num = 0;
// 循环把所有的实参都加到num上
for (let i = 0; i < arguments.length; i++) {
num += arguments[i]
}
// 把结果返回到函数外面
return num
}
</script>五、返回的变量不应该再函数外面
arguments
...args
封装一个fn函数, 实现把所有实参求和后返回.
返回的num, 应该是每次调用的时候都初识为0,因此不能写在函数外面.
<script>
let num = 0;
let x = fn (1, 2, 3); // x === 6
let y = fn (1, 2, 3, 4);// y === 10
function fn () {
// 循环把所有的实参都加到num上
for (let i = 0; i < arguments.length; i++) {
num += arguments[i]
}
// 把结果返回到函数外面
return num
}
</script>以上函数的执行分析步骤。
- x = fn (1, 2, 3);
- x = num => (1 + 2 + 3); num === 6
- y = fn (1, 2, 3, 4);
- y = num (6 + 1 + 2 + 3 + 4); num === 16
六、return会终止函数执行
<script>
// return 执行后,整个函数会强制结束.
let num1 = fn (1, 2, 3, 4);// 1
function fn () {
// 结果
let num = 0;
// 循环把所有的实参都加到num上
for (let i = 0; i < arguments.length; i++) {
num += arguments[i];
}
// 把结果返回到函数外面
return num
}
</script>七、可选参和必填参
- 必填参 => 必填的参数
- 可选参 => 可以填也可以不填的参数
// querySelectorAll唯一的参数是必填参数,不填报错.
let oDiv = document.querySelectorAll('div');// alert的唯一参数是可选参数.
alert();函数的参数应该是必填的还是可选的?
没有一定的.只取决于写函数的人如何定义.
// 默认情况下，所有的参数都是可选的。
function fn (x) {
console.log(x);
}
fn();// 通过一些逻辑判断来设置一个必填参数.
function fn (x) {
// 如果没有给x传递实参。
if (x === undefined) {
let err = new Error('你要传递x参数,x参数是必填的');
console.error(err);
} else {
console.log(x);
}
}
fn();八、参数的默认值
- 对于可选参, 如果希望在不传递实参时,可选参等于一个默认值,怎么做?
function fn (x) {
// 如果x没有值,就把它变成10.
if (x === undefined) {
x = 10;
}
console.log(x);
}
fn();
fn(100);ES6默认参数的写法.
如果没有传递参数,x默认是10.
如果传递成参数,x的值就以传递的参数为准.
function fn (x = 10) {
console.log(x);
}
fn();
fn(100);九、JS内置对象
内置对象 => js本身就有的对象.(例如: window,document);
常用的内置对象.
- 数学
- 日期对象
- 字符串对象
- 数组对象 (最常用)
- 正则对象 (很难)
学习内置对象,需要关注这个内置对象有什么属性,有什么方法.
如何学习属性 => 知道这个属性有什么用就可以了.
如何学习对象的方法 =>
- 这个方法有什么用.
- 参数是什么,有多少个,那些是可选的,那些是必填的,数据类型是什么.(参数的细节)
- 这个方法返回什么.
- 语法.方法的书写形式.
对象:
- 属性
- 方法
十、数学对象
// 数学对象 => 处理一些数学问题.求幂,求绝对值问题,求随机数问题,求四舍五入问题
console.log(Math);
// 圆周率π
console.log(Math.PI);
// s是面积.10是圆的半径
let s = fn(10);
function fn (r) {
return Math.PI * r * r
}
// 求绝对值。
let n = Math.abs(-10);十一、数学方法
<script>
// 向下取整
let num1 = Math.floor(1.9);
console.log(num1);
// 向上取整
let num2 = Math.ceil(1.9);
console.log(num2);
// 四舍五入
let num3 = Math.round(1.9);
console.log(num3);
// 求幂 => 求xxx的几次放. 平方 => 2次幂, 立方 => 3次幂
let num4 = Math.pow(2, 2);
// 求2的平方根. 2的10次方幂是1024 则1024的10次方根就是2
let num5 = Math.sqrt(2);
// 求27的立方根.
let num6 = Math.cbrt(27);
// 找最大值
let max = Math.max(1,3246,534,56,56,767,8,689,8,9890,9823);
// 数组内有多个数组,如何找到arr中最大的数.
let arr = [1,3246,534,56,56,767,8,689,8,9890,9823];
// ES6的暂开运算符可以把数组的所有元素作为实参放入函数中.
let max1 = Math.max(...arr);
// ES5的写法.
let max2 = Math.max.apply(Math, arr);
// ES5从一个数组中找最小的数
let min2 = Math.min.apply(Math, arr);
// 找最小值
let min = Math.min(1,3246,534,56,56,767,8,689,8,9890,9823);
</script>十二、随机数
<script>
// 返回0-1之间的随机小数。(可以随机到0,不能随机到1);
let num = Math.random();
// 0 - 10的随机数 (可以随到0,但是随机不到10)
let num1 = Math.random() * 10;
// 把随机数取整,因为向下取整,因此最大只能取到9
let num2 = Math.floor(num1);
// 2-8的随机整数
// 先取0-6的随机整数,然后再+2.
// 取0-7之间的随机数
let num3 = Math.random() * 7;
// 向下取整后加2.
let num4 = Math.floor(Math.random() * 7) + 2;
// 封装一个获取任意两个整数之间的随机整数的函数.
// 获取4-100之间的随机整数
let num5 = getRandom(0, 255);
// 封装。
function getRandom(a, b) {
return Math.floor(Math.random() * (b - a) + 1) + a
}
</script>十三、数组方法
let arr = [11, 22, 33];
arr[3] = 44;
// 在最后面插入一个元素。
// 把数组的第四个元素变成arr.push(55)的返回值
arr.push(55);
arr.push(44);
// 在数组的最前面插入一个0.
arr.unshift(0);
// 删除最后面的元素
arr.pop();
// 删除最前面的元素
arr.shift();splice => 任意位置加,任意位置删
splice(要删除的元素的下标(要插入的元素的下标), 要删除的元素个数, 要替换的元素的值 )
// 任意位置添加元素,任意位置删除元素.
arr.splice(1, 0,'小陈');
// 删除第二个元素
arr.splice(1, 1);
// 用splice实现push的写法
arr.splice(3, 0, 44);十四、数组方法查找元素
let arr = [1,1,2,3,4,5,6,7];
// 这个数组中有没有元素10
// arr.includes(10) => 返回布尔值，如果arr中包含10，就返回true，否则返回false
if (arr.includes(10)) {
alert('有')
} else {
alert('没有')
}let arr = [1,1,2,3,4,5,6,7];
// arr.indexOf(10) => 返回查找元素的下标。如果没有指定元素，返回-1
if (arr.indexOf(10) !== -1) {
alert('有');
} else {
alert('没有');
}let arr = [1,1,2,3,4,5,6,7];
// 假设没有10e
let flag = false;
for (let i = 0;i < arr.length; i++) {
if (arr[i] === 10) {
flag = true;
break;
}
}
if (flag) {
alert('有')
} else {
alert('没有')
}十五、数组的其他方法
let arr1 = [1, 2, 3, 100];
let arr2 = [4, 5, 6];// 利用es6的展开运算符进行拼接
let arr3 = [...arr1, ...arr2];// 123在前
let arr3 = arr1.concat(arr2);// 456在后
let arr3 = arr2.concat(arr1);// 所有元素倒序
arr1.reverse();// 把数组转换成字符串.
let arr = ['我', '喜欢', '你'];
let str = '';
for (let i = 0; i < arr.length; i++) {
str += arr[i];
}// 把数组里面的元素拼接成字符串.
let str = arr.join('');// 没参数,默认用,连接各个元素
let str = arr.join();// 指定用 - 连接各个元素
let str = arr.join('-');// 把arr1中的1和2提取出来,再和arr2进行拼接.(不会修改原数组)
// 第一个参数是开始下标, 第二个参数是结束位置的下标.(包头不包尾)
let arr3 = arr1.slice(0,2).concat(arr2);// 把arr1中的2和3提取出来.在拼接.
let arr3 = arr1.slice(1,3).concat(arr2);// 把第二个元素和第二个元素之后的所有元素都提取出来,再拼接.
let arr3 = arr1.slice(1).concat(arr2);十六、字符串方法
- 字符串类型不是object类型.但是字符串可以拥有一些方法.
- 很多时候可以把字符串当成数组处理. => 字符串可以使用length和下标
let str = '爱上了得到';
// 如何判断一个字符串内有多少个字符?
console.log(str.length);let str = '爱上了得到';
// 如何知道字符串的第二个字符是什么?
console.log(str[1]);let str = '爱上了得到';
// 如何知道字符串内有没有'钱'这个字符串
if (str.includes('钱')) {
alert('有')
} else {
alert('没有')
}let str = '爱上了得到'
// 如何知道字符串内有没有'钱'这个字符串
if (str.indexOf('钱') !== -1) {
alert('有');
} else {
alert('没有');
}let str = '爱上了得到';
// 提取字符串。参数和数组的slice方法一样。
let msg = str.slice(0, 3);let str = '爱上了得到';
// 参数是负数,需要转换成正的再截取.
// 负数需要和字符串的length相加.
// -1 获取的是最后一个字符.
let msg = str.slice(-1); // 到let str = '爱上了得到';
// 参数和数组的slice方法一样。
let msg = str.substring(1, 3);let str = '爱上了得到';
// 第一个参数表示开始下标, 第二个参数表示截取的字符个数.
let msg = str.substr(1, 4);十七、字符串方法
- 字符串的所有方法都不会修改字符串本身。都需要重新赋值，原字符串才会变。
字符串变大、变小
let str = 'abc';
// 变大写.
str = str.toUpperCase();
// 变小写.
str = str.toLowerCase();字符串其中一个边大写
str = 'ab' + 'C';
// 只有C变大写
str = 'ab' + 'c'.toUpperCase();// 截取最后一个字符之前的所有字符 + 最后一个字符的大写。
str = str.slice(0,-1) + str.slice(-1).toUpperCase();str = 'a' + 'B' + 'c';
str = str.slice(0, 1) + str[1].toUpperCase() + str.slice(2);
// 封装一个函数, 把指定的字符串的最后一个字符变大写.十八、字符串的转数组
let str = '你爱我';
// 转换为数组.
// split() => 参数表示不要放进数组的字符串.
let arr = str.split('');// 数组倒序
arr.reverse();// 在把倒序后的字符串赋值给str.
str = arr.join('');
- str.split('') => 每个字符串作为单独的元素放入数组
- str.split('-') => 把-删掉后的其他字符放入数组.
- str.split() => 整个字符作为唯一的元素放入数组.
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
