JS-part4.1-数组常用方法

最新推荐文章于 2022-10-09 22:03:03 发布
最新推荐文章于 2022-10-09 22:03:03 发布
阅读量162 收藏
点赞数
分类专栏： Web开发 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Xiaolei233/article/details/118002997
版权

JavaScript


13-17参数相同

数组常用方法

数组常用方法
 + 就是 JS 自带的一些操作数组的方法
 + 数组常用方法的使用格式，必须是 数组.xxx()
     => length 和 索引 都一样，循环遍历都一样
     => 长得也一样
     => 唯独数组常用方法，伪数组用不了

数组常用方法1_(浏览器都可用)

1. push()

=> 语法: 数组.push(数据1， 数据2， 数据3， …);
=> 作用：把所有的参数按照顺序添加到数组的末尾位置
=> 返回值：追加以后数组的长度
=> 直接操作原始数组

// 1. push()
var arr = ['hello', 'world', '你好', '世界'];
var res= arr.push('新来的', '新来的2', [10, 20]);
console.log(res);
console.log(arr);

在这里插入图片描述

2. pop()

=> 语法: 数组.pop();
=> 作用：删除数组的最后一个数据
=> 返回值：被删除的数据
=> 直接操作原始数组,不需要参数

// 2. pop()
var arr = ['hello', 'world', '你好', '世界'];
var res = arr.pop();
console.log(res);
console.log(arr);

在这里插入图片描述

3. unshift()

=> 语法: 数组.unshift(数据1， 数据2， 数据3， …);
=> 作用：从数组的最前面插入一些数据
=> 返回值：插入后数组的长度
=> 直接操作原始数组

// 3. unshift()
var arr = ['hello', 'world', '你好', '世界'];
var res = arr.unshift('新来的');
console.log(res);
console.log(arr);

在这里插入图片描述

注：unshift()操作相比于push(),除了位置的不同，还有性能消耗的不同。前者消耗性能更大。

4. shift()

=> 语法: 数组.shift();
=> 作用：删除数组的最前面的一个数据
=> 返回值：被删除的数据
=> 直接操作原始数组,不需要参数

// 4. shift()
var arr = ['hello', 'world', '你好', '世界'];
var res = arr.shift();
console.log(res);
console.log(arr);

在这里插入图片描述

数组常用方法2_ES3.0(IE6\7\8都可用)

5. reverse()

=> 语法: 数组.reverse();
=> 作用：反转数组
=> 返回值：反转后的数组
=> 直接操作原始数组，无参数

var arr = ['hello', 'world', '你好', '世界'];
var res = arr.reverse();
console.log(res);
console.log(arr);

在这里插入图片描述

6. sort()

=> 语法: 
   1. 数组.sort();
       -> 按照每一个数据中的每一位数据的ASCII码进行排列
   2. 数组.sort(function(a, b){return a - b;});
       -> 升序排列
   3. 数组.sort(function(a, b){return b - a;});
       -> 降序排列
=> 作用：数组排序
=> 返回值：排序后的数组
=> 直接操作原始数组

// 1. 按照每一个数据中的每一位数据的ASCII码进行排列
var arr = [1, 11, 33, 26, 51, 19, 32, 27, 15, 100];
var res = arr.sort();
console.log(res);
console.log(arr);

在这里插入图片描述

// 2. 升序排列
var res = arr.sort(function(a, b){return a - b;});
console.log(res);
console.log(arr);

在这里插入图片描述

// 3. 降序排列
var res = arr.sort(function(a, b){return b - a;});
console.log(res);
console.log(arr);

在这里插入图片描述

7. splice()

=> 语法: 
    1. 数组.splice(开始索引, 多少个);
        -> 从开始索引，截取多少个
        -> 第二个参数可以不写，直接截取到末尾
    2. 数组.splice(开始索引, 多少个, 替换数据1, 替换数据2……);
        -> 把替换数据按照顺序插入到你截取的位置
        -> 注意：**从哪个索引开始删除，替换数据的第一个就插入哪个位置**
=> 作用：有两个
    1. 截取数组
    2. 替换新内容
=> 返回值：一定是一个数组
    -> 如果你截取多个数据，数组里面有多个
    -> 如果你截取一个数据，数组里面有一个
    -> 如果你一个都不截取，那么是一个空数组
=> 直接操作原始数组

// 7. splice()
var arr = ['hello', 'world', '你好', '世界'];
var res = arr.splice(1, 2);

console.log('res:', res);
console.log('arr:',arr);

在这里插入图片描述

var arr = ['hello', 'world', '你好', '世界'];
var res = arr.splice(1, 2, '新来的');
// var res = arr.splice(1, 0, '新来的');
console.log('res:', res);
console.log('arr:',arr);
// ['hello', '新来的', '世界']
// ["hello", "新来的", "world", "你好", "世界"]

在这里插入图片描述

注：操作原始数组，插入是插入到原始数组里，而不是返回值里

8. concat()

=> 语法: 数组.concat(数组1, 数据2, …);
=> 作用：
    -> 如果参数是数组，那么把数组拆开，里面的每一项追加到原数组的后面
    -> 如果参数是数据，那么直接追加
=> 返回值：追加好的数组
=> **不改变原始数组**,融合进一个新的

// 8. concat()
var arr = ['hello', 'world', '你好', '世界'];
var res = arr.concat([10, 20],[30, 40], 100);
console.log(res);
console.log(arr);

在这里插入图片描述

9. slice()

=> 语法: 
   1. 数组.slice(开始索引, 结束索引);  -包前不包后
        -> 两个参数都可以不写，分别表示从第一个开始 和 到最后一个结束
   2. 数组.slice(开始索引, 结束索引);  -包前不包后
        -> 参数可以写一个负整数
        -> 当你书写完一个负整数以后，表示length + 负整数
=> 作用：
    -> 获取数组里面的某些数据
=> 返回值：一个数组
    -> 如果你获取多个数据，数组里面有多个
    -> 如果你获取一个数据，数组里面有一个
    -> 如果你一个都不获取，那么是个空数组
=> **不改变原始数组**

注: splice() 方法与 slice() 方法的作用是不同的，splice() 方法会直接对数组进行修改

// 9. slice()
// 语法1
var arr = ['hello', 'world', '你好', '世界'];
var res = arr.slice(1, 2);
console.log('res:', res);
console.log('arr:',arr);

// 语法2
// 因为 length 是 4，-3 的位置实际上是4 + -3，是1；-2 的位置实际上相当于 4 + -2， 就是2
var res2 = arr.slice(-3, -2);
console.log('res:', res);
console.log('arr:',arr);

在这里插入图片描述

10. join()

=> 语法: 数组.join('连接符号'); 
        -> 不传递，是按照 逗号(,) 连接
        -> 你传递什么，按照什么连接
=> 作用：把数组里面的每一个数据使用连接符号连接在一起
=> 返回值：是一个连接好的内容，是个string类型
=> **不改变原始数组**

// 10. join()
var arr = ['hello', 'world', '你好', '世界'];
var res = arr.join('@-@');
console.log('res:', res);
console.log('arr:',arr);

在这里插入图片描述

var res = arr.join();

在这里插入图片描述

var res = arr.join('');

在这里插入图片描述

数组常用方法3_ES5.0(IE6\7\8不可用了)

11. indexOf()

=> 语法：
  1. 数组.indexOf(数据)
  2. 数组.indexOf(数据, 开始索引)
    -> 从哪个索引开始向后查找
=> 作用：正向查看数组里面指定这个数据的索引
=> 返回值:
    -> 如果有这个数据，是第一个满足条件的数据的索引
    -> 如果没有这个数据，就是 -1

// 11. indexOf()
var arr = ['hello', 'world', '你好', '世界','hello'];
var res1 = arr.indexOf('hello');
console.log(res1);    // 0
console.log(arr);

var res2 = arr.indexOf('hello', 1);
console.log(res2);    // 4
console.log(arr);

var res3 = arr.indexOf('hello', 10);
console.log(res3);    // -1
console.log(arr);

12. lastIndexOf()

=> 语法：
  1. 数组.lastIndexOf(数据)
  2. 数组.lastIndexOf(数据, 开始索引)
    -> 从哪个索引开始向前查找
=> 作用：反向查看数组里面指定这个数据的索引
=> 返回值:
    -> 如果有这个数据，是第一个满足条件的数据的索引
    -> 如果没有这个数据，就是 -1
    -> 注意：虽然是反向查找，索引还是正常的

// 12. lastIndexOf()
var arr = ['hello', 'world', '你好', '世界','hello'];
var res = arr.lastIndexOf('hello');
console.log(res);    // 4
console.log(arr);

var res2 = arr.lastIndexOf('hello', 3);
console.log(res2);    // 0
console.log(arr);

13. forEach()

=> 语法：数组.forEach(function(item, index, arr){})
    -> item: 数组的每一项
    -> index: 数组的每一项索引
    -> arr: 原始数组
=> 作用：取代 for 循环的作用，遍历数组
=> 没有返回值

注： 三个参数名可自定义；
在不考虑性能的情况下，可以用forEach代替for循环遍历数组

// 13. forEach()
var arr = ['hello', 'world', '你好', '世界'];
arr.forEach(function(item, index, arr){
    // 这个函数，会根据数组里面有多少个数据执行多少回
    // console.log('我执行了');
    // 这个函数每一次执行的时候， item 分别是数组里的每一项
    // 这个函数每一次执行的时候， index 分别是数组里每一项的索引
    // 这个函数每一次执行的时候， arr 每一次都是原始数组
    console.log(item, '---', index, '---', arr);
});

在这里插入图片描述

14. map()

=> 语法：数组.map(function(item, index, arr){})
    -> item: 数组的每一项
    -> index: 数组的每一项索引
    -> arr: 原始数组
=> 作用：映射数组
=> 返回值：是一个新的数组
    -> 里面是对原始数组每一个数据的操作
    -> 返回值数据，一定和原始数组长度一样
=> 不改变原始数组

map 底层封装
1. 准备一个新的数组
2. 遍历原始数组，分别执行函数
3. 依次把函数执行后的返回值放在新数组里面
4. 把新数组当作 map 的返回值给出来

 var arr = [10, 100, 1000];
 var res = arr.map(function(item, index, arr){
     console.log(item, '---', index, '---', arr);

     return item * 1.3;
 });

 console.log(res);

在这里插入图片描述

*/
// 自己写的一个函数
// 我要想用，必须是 myMap(a, b, c)
// 我为了可以像数组常用方法一样的话
// 我需要把这个方法放在 Array.prototype 上

function myMap(fn){
    // fn 就是你调用 myMap 的时候传递的函数

    var newArr = [];

    //这个函数里面 this 表示调用方法的那个数组
    for(var i = 0; i < this.length; i++){
        newArr.push(fn(this[i], i, this));
    }
    return newArr;
}

Array.prototype.myMap = myMap;
var res = arr.myMap(function(item, index, arr){
    console.log(item, index, arr);

    return item * 1.3;
});
console.log(res);

15. filter()

=> 语法：数组.filter(function(item, index, arr){})
    -> item: 数组的每一项
    -> index: 数组的每一项索引
    -> arr: 原始数组
=> 作用：过滤原始数组中的数据，把满足条件的放在新数组里
=> 返回值：是一个新的数组，里面是所有原始数组中满足条件的项
=> 不改变原始数组

// 15. filter()
var arr = [10, 20, 30, 40, 50];
var res = arr.filter(function(item, index, arr){
    return item > 20;
});

console.log(res);

/*
  底层封装
    1. 准备一个新数组
    2. 循环遍历原始数组
        -> 数组有多少项，函数执行多少回
        -> 每一回，如果返回值是true，那么就把这一项放在新数组里
    3. 把新数组当作filter的返回值

    newArr = [];

    函数第一次执行
        => item === 10, return item > 20, return false
        => 10 这个数据就不放在新数组里面
    函数第二次执行
        => item === 20, return item > 20, return false
        => 20 这个数据就不放在新数组里面
    函数第三次执行
        => item === 30, return item > 20, return true
        => 30 这个数据放在新数组里面
    函数第四次执行
        => item === 40, return item > 20, return true
        => 40 这个数据放在新数组里面
    函数第五次执行
        => item === 50, return item > 20, return true
        => 50 这个数据放在新数组里面
    
    循环结束
    把 newArr 当作 filter 方法的返回值
*/

在这里插入图片描述

16. every()

=> 语法：数组.every(function(item, index, arr){})
    -> item: 数组的每一项
    -> index: 数组的每一项索引
    -> arr: 原始数组
=> 作用：判断原始数组里是否每一个都满足条件
=> 返回值：是一个布尔值
    -> 如果原始数组中每一个都满足条件，那么返回值为true
    -> 只要原始数组中有任意一个不满足条件，就返回false

// 16. every()
var arr = [10, 20, 30, 40, 50];
var res = arr.every(function(item, index, arr){
    console.log(item, index, arr);

    return item < 40;
});

console.log(res);

/*
  底层原理
    1. 假设一个变量为true,表示所有数据都满足条件
    2. 循环遍历数组
        => 执行传递进来的函数
        => 如果该函数返回的是true,那么循环继续
        => 如果函数返回的是false, 那么把我的假设改成false,直接结束循环
    3. 循环结束以后,把我的假设当作 every 的返回值

    var flag = false;

    函数第一次执行
        item === 10, return item < 40,return true
        什么也不做,循环继续
    函数第二次执行
        item === 20, return item < 40,return true
        什么也不做,循环继续
    函数第三次执行
        item === 30, return item < 40,return true
        什么也不做,循环继续
    函数第四次执行
        item === 40, return item < 40,return false
        把 flag 赋值为 false
        break 结束循环
    
    循环结束后,把flag的值返回
*/

在这里插入图片描述

17. some()

=> 语法：数组.some(function(item, index, arr){})
                -> item: 数组的每一项
                -> index: 数组的每一项索引
                -> arr: 原始数组
=> 作用：判断原始数组里是否有某一个满足条件
=> 返回值：是一个布尔值
    -> 如果原始数组中任意一个数据满足条件，那么返回值为true
    -> 只要原始数组中所有数据都不满足条件，就返回false

// 17. some()
var arr = [10, 20, 30, 40, 50];
var res = arr.some(function(item, index, arr){
    console.log(item, index, arr);

    return item > 10;
});
console.log(res);

/*
   底层原理
     1. 假设一个变量为false,表示所有数据都不满足条件
     2. 循环遍历数组
         => 执行传递进来的函数
         => 如果该函数返回的是 false,那么循环继续
         => 如果函数返回的是 true, 那么把我的假设改成true,那么结束循环
     3. 循环结束以后,把假设变量 当作 some 的返回值

     var flag = true;

     函数第一次执行
         item === 10, return item > 10,return false
         什么也不做,循环继续
     函数第二次执行
         item === 20, return item > 10,return true
         把 flag 赋值为 true
         break 结束循环
     
     循环结束后,把flag的值返回
 */

数组常用方法4_ES2015(6.0)以后(标准浏览器IE10以上)

18. copyWithin()

=> 语法：数组.copyWithin(目标位置,开始索引,结束索引)
    -> 目标位置:当你替换内容的时候,从哪一个索引位置开始替换
    -> 开始索引:数组哪一个索引位置开始当作替换内容,默认值是 0
    -> 结束索引:数组哪一个索引位置结束当作替换内容,默认是末尾
    -> 包前不包后
=> 作用：使用数组里面的内容替换数组里面的内容
=> 返回值: 是一个新的数组
    -> 替换后的数组

// 18. copyWithin()
var arr = [100, 200, 300, 400, 500];
// 第一个参数 0, 表示从索引 [0] 位置,即值为100时开始替换
// 第二个参数 3, 表示原始数组索引[3]位置开始向后查找,若没写第三个参数,默认到末尾
// 找到的就是 400 和 500
// 把 400 和 500 两个数据从 [0] 开始替换;400换100, 500换200
var res = arr.copyWithin(0, 3); // [400, 500, 300, 400, 500]
var res = arr.copyWithin(0, 2); // [300, 400, 500, 400, 500]
// 第三个参数 4, 表示原始数组索引[4]位置结束查找
// 找到的就是[3] 开始 [4] 结束,包前不包后,找到的就是 400
// 把 400 从 0 开始替换
var res = arr.copyWithin(0, 3, 4); // [400, 200, 300, 400, 500]
console.log(res);

19. fill()

=> 语法：数组.fill(要填充的数据,开始索引,结束索引)
                -> 要填充的数据:你想用什么数据填充数组里面的每一位
                -> 开始索引:从数组哪一个索引位置开始填充,默认值是 0
                -> 结束索引:填充到哪一位索引为止,默认值是末尾
                -> 前提:数组要有length
                -> 包前不包后
=> 作用：使用数组指定内容去填充数组
=> 返回值:填充好的数组

// 19. fill()
var arr = new Array(30);
// 使用字符串'填充内容'去把数组填满
// var res = arr.fill('填充内容');
// 使用字符串'填充内容'从[5]开始填充数组,填充到末尾
// var res = arr.fill('填充内容', 5);
// 使用字符串'填充内容'从[5]开始填充到数组索引[25]
var res = arr.fill('填充内容', 5, 25);
console.log(res);

在这里插入图片描述
在这里插入图片描述在这里插入图片描述

20. includes()

=> 语法：数组.includes(数据)
=> 作用：查看数组中是不是有某一个数据
=> 返回值:一个布尔值
    -> 有这个数据, 就是true
    -> 没有这个数据, 就是false

// 20. includes()
var arr = [10, 20, 30, 40, 50];
var res = arr.includes(50);  // true
console.log(res);

21. flat()

=> 语法：数组.flat(数字)
                -> 数字:表示扁平化多少层,可以不写,默认为1
                -> 数字这个参数还可以填写Infinity(大写I),表示无限
=> 作用：拍平数组
=> 返回值:拍平后的数组

// 21. flat()
var arr = [
    10, 20, 30,
    [40, 50],
    [60, 70, [80, [90, [100, [100, [120]]]]]]  
];
var res = arr.flat(3);   //拍3层
var res = arr.flat(Infinity);   //拍无限层

console.log(res);
console.log(arr);

在这里插入图片描述

22. flatMap()

=> 语法：数组.flatMap(function(item, index, arr){})
=> 作用：拍平数组,但是只能拍一层
=> 返回值:是一个新的数组
    -> 一边拍平,一边映射

// 22.flatMap()
var arr = [[10, 21, 30], [40, 51, 60]];
var res = arr.flatMap(function(item){
    return item.filter(function(item){return item % 2 === 0});
})
console.log(res);

在这里插入图片描述

23. find()

=> 语法：数组.find(function(item){})
=> 作用：根据条件找到数组里面满足条件的数据
=> 返回值:找到的第一个的那个**数据**

// 23. find()
var arr = [10, 20, 30, 40, 50];
var res = arr.find(function(item){
    return item > 20;
})
console.log(res);  // 30

24. findIndex()

=> 语法：数组.findIndex(function(item){})
=> 作用：根据条件找到数组里面满足条件的数据
=> 返回值:找到的第一个的那个数据的**索引**

// 24. findIndex()
var arr = [10, 20, 30, 40, 50];
var res = arr.findIndex(function(item){
    return item > 20;
})
console.log(res);  // 2
guanerkoushi
关注
专栏目录
前后端项目-part03
cgblpx的博客
02-27 739
文章目录5.4.4 机构名称5.4.4.1 创建实体类Company5.4.4.2 创建实体类CompanyMapper5.4.4.3 创建实体类CompanyService5.4.4.4 创建实体类CompanyController5.4.4.5 后端测试5.4.4.6 修改basic.js5.4.4.7 修改course.vue5.4.4.8 测试5.4.5 课程标签5.4.5.1 效果5.4.5.2 修改course.vue5.4.5.35.4.5.46 5.4.4 机构名称 5.4.4.1 创建实体
linux常用命令-part3
热门推荐
chinayuan的专栏
05-01 2万+
中文怎么发音 Ubuntu 有奔头，乌版图 Fedora 费德勒，菲朵拉 Debian 迪扁，德槟 CentOS 桑托斯 森头斯       Linux发展历史: 1) RedHat ---> 1.RedHat                2.CentOS                3.Fedora  桌面图形系统        rpm, yum 命令 2)
JavaScript学习笔记——函数 Part1：函数的创建原理（函数声明、函数表达式、函数在何时被创建）
Insomnia_X的博客
07-16 328
在JavaScript中，很多组织代码的技巧都要求精通并熟练地使用函数。学习JavaScript的分水岭就是熟知函数。通往精通函数的学习道路很有趣，但常常会让人迷惑不解，接下来将见到一些奇异、古怪而神奇的东西。 创建函数的两种方法 1.函数声明 function quack(num){//这是函数声明语句 ...} quack(3);//调用函数 标准的函数声明（由function关键字、函数名、形参、代码块组成） 创建了一个函数，名称为quack，可以用quack引用和调用这个函数 2.函数表.
js 解决精度问题
qq_33051709的博客
04-29 442
js 解决精度问题 4.1*100 // 409.99999999999994 解决办法： parseFloat((4.1*100).toPrecision(12)) // 410 toPrecision () https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number/toPr...
2018-08-18-Python全栈开发day41-JS-part3-数组对象
weixin_30846599的博客
08-18 76
1.数组对象创建方式 　　 var arr=[1,2,3,4]; 2.二维数组 　　若数组内还有一个或者多个数组，则是二维数组。若其中还有数组，则是多维数组 3. 数组的属性 　　length等 4.数组的方法 4.1 join方法 　　 var arr=[1,2,3,4]; bb=arr.join('hello'); document.writ...
linux常用命令-part2
chinayuan的专栏
05-01 2万+
Ubuntu,Fedora,Debian,CentOS中文怎么发音 有奔头， 费德勒， 迪扁， 桑托斯。 乌版图 菲朵拉 德槟 森头斯 ================================ 使用find和wc命令统计代码行数 ================================ wc -l `find . -name "*.js" | xargs`
Vue - part1
weixin_48665759的博客
05-11 223
1. MVVM 模式 1.1 MVC 模式 MVC 模式代表 Model-View-Controller（模型-视图-控制器） 模式。这种模式用于应用程序的分层开发。 Model （模型） ： 代表一个存取数据的对象或 JAVA POJO。它也可以带有逻辑，在数据变化时更新控制器。 View（视图） ： 代表模型包含的数据的可视化。 Controller（控制器） ：控制器作用于模型和视图上。它控制数据流向模型对象，并在数据变化时更新视图。它使视图与模型分离开。 1.2 MVC 模式实现 创建一个作为模
JavaWeb学习笔记-part10-SpringMVC
qq_51704510的博客
10-31 358
1 概述 springmvc是基于spring的一个servlet升级版，实际上是spring的一个模块，专门做web开发的。 web开发底层是servlet，框架是在servlet基础上面增加一些功能，让你做web开发方便。 SpringMVC就是一个spring容器，放的是控制器对象（Controller）。我们要做的就是使用@Controller创建控制器对象，把对象放入springmvc容器中，把创建的对象作为控制器使用，这个控制器对象能接受用户的请求，显示处理结果，就当作是一个servlet
part4-m6
zsnpromsie的博客
09-05 569
Part 4 · React 框架原理与实战 本阶段将带你学习前端圈子中口碑极佳的 React 框架以及它的一些高阶用法、组件库封装、数据流方案、服务端渲染（SSR）、静态站点生成（SSG），同时深入 React 框架内部，剖析 React 部分核心源码和实现，最后还会结合 TypeScript 和蚂蚁金服的 Ant Design 库做出实战。 模块六 Angular 企业实战开发 本模块中通过企业实战带你领略最具规模的前端框架 Angular，包括：NG 数据绑定及实现原理、组件封装及父子组件通信、
前端面试题--js
最新发布
weixin_44501366的博客
10-09 5123
SetES6 新增的一种新的的数据结构，类似于数组，但成员是唯一且无序的，没有重复的值。成员不能重复；只有键值，没有键名，有点类似数组；可以遍历，方法有add: 新增，相当于array里的pushdelete: 存在即删除集合中的valuehas: 判断集合中是否存在valueclear: 清空集合Set 结构可以利用Array.from或者 扩展运算符 转化为数组。
c语言中结构体数组的引用,【C语言入门教程】7.2 结构体数组的定义和引用
weixin_42322347的博客
05-22 4839
7.2 结构体数组的定义和引用当需要使用大量的结构体变量时，可使用结构体定义数组，该数组包含与结构体相同的数据结构所组成的连续存储空间。如下例所示：struct student stu_a[50]; // 声明长度为 50 的结构体数组 stu_a引用结构体数组中元素的一般形式为：结构体数组名[n].成员名[] 符号的优先级与.符号相同，适用于自左向右结合性，所以运算时首先获得的是结...
CSS第九章 移动端布局-Viewport视口/移动端适配方案
晓葉斑比
06-04 1866
Viewport视口移动端模拟器访问的网站的PC端和移动端是否用同一代码实现？Viewport视口ViewPort设置移动端适配方案1. 流式布局(百分比布局)流式布局原则2. rem布局(等比缩放布局) 移动端模拟器 切换平台之后，一定要重新刷新浏览器 访问的网站的PC端和移动端是否用同一代码实现？ 1.大一点的网站的PC端和移动端都是分开开发的，各有一套代码。 访问淘宝网 ->后端检测当前设备 ->如果是PC端 ->www.taobao.com 访问淘宝网 ->后端检
CSS第五章 CSS盒子模型/标签分类和嵌套规范
晓葉斑比
05-18 1189
CSS五、CSS盒子模型5.1 标准盒子模型5.2 box-sizing样式5.3 盒子模型的一些问题1. margin叠加问题2. margin传递问题扩展 五、CSS盒子模型 5.1 标准盒子模型 组成 : content -> padding -> border -> margin            物品     &
CSS第九章 移动端布局-Bootstrap
晓葉斑比
06-05 1094
BootstrapBootstrapContainersGrid system栅格系统Grid optionsAuto-layout columnsEqual-widthSetting one column width 设置列宽度 Bootstrap Bootstrap是HTML、CSS和JS框架，用于开发响应式布局、移动设备优先的WEB项目。 好处：不需要自己写样式，它提供了大量的class样式供选择 我下的最新版本v5.0.1，不同版本提供的内容有改变 特色：1. 响应式布局（不需要自己写media q
CSS第十章 Sass与Less
晓葉斑比
06-06 952
CSS一、Sass与Less1.1 定义1.2 使用注释变量、插值、作用域选择器嵌套、伪类嵌套、属性嵌套(Sass)运算、单位、转义、颜色 一、Sass与Less CSS（层叠样式表）是一门非程序式语言，入门学习使用非常直观方便，但是对于一些比较复杂或者重用性比较强的项目来说，因为CSS没有变量、函数、SCOPE（作用域），需要书写大量看似没有逻辑的代码，不方便维护及扩展，不利于复用，尤其对于非前端开发工程师来讲，往往会因为缺少 CSS 编写经验而很难写出组织良好且易于维护的 CSS 代码。为了方便前端开发
HTML技术(基础/列表/表格/表单)
晓葉斑比
05-02 912
HTML技术前言一、HTML介绍1.1 发展1.2 HTML文件的基本结构1.3 HTML标签常用标签1.4 HTML元素HTML元素属性二、识别表单元素三、样式表的三种形式 前言 ubuntu下写HTML文本使用工具VS Code,win可使用H Builder 快速生成标准的html代码： （1）在第一行输入！ （2）按Tab键或者选择代码提示中的！ Visual Studio Code默认是在VScode的控制台下查看html页面，这对于我们调试和查看效果十分不方便。所以这里我们需要安装一下扩展
怎么做网站
晓葉斑比
11-17 843
教程 建站流程网站的三要素一. 注册域名域名的分类二. 主机主机的分类三. 域名解析与绑定四. FTP工具 \ 网站目录与默认首页FTP(文件传输协议)常用的ftp工具网站目录与默认首页 网站的三要素 一. 注册域名 + 域名实名认证和域名备案并不一样，不管注册的是.com的国际域名，还是.cn国内域名，都是需要进行域名实名认证的。 根据《中国互联网络域名管理办法》的规定，注册.xin 域名、.cn等国内域名、.com/.net国际域名、.top域名都要求必须进行实名认证（未完成实名认证的域名会处于
JS-part12.3-ES6- 箭头函数 / 函数的参数默认值 / 模板字符串 / 点点点运算符 / 解构赋值 / 对象的简写形式
晓葉斑比
09-04 772
Javascript一. ES6的箭头函数箭头函数的特性二. 函数的参数默认值三. 模板字符串四. 点点点(...)运算符1. 展开运算符2. 合并运算符五. 解构赋值1. 解构数组2. 解构对象六. 对象的简写形式 一. ES6的箭头函数 + 一种新的函数定义方式 + 对于函数表达式的简写方式(匿名函数) + 匿名函数 => var fn = function(){} => var obj = { fn: function(){} } => setTimeout( funct
H.264/MPEG-4 Part 10 白皮书概述
"H.264_MPEG-4 Part 10 White Paper.pdf" 是一份关于H.264/MPEG-4 Part 10标准的技术文档，是学习H.264编码技术的重要参考资料，适合学校教学使用，且被评价为优于中文版资料。 正文： H.264/MPEG-4 Part 10，通常...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值