一篇文章学会ES6核心

一、ES6

1.什么是ES6

ES的全称是:ECMAScript,它是ECMA国际标准化组织制定的一项脚本语言的标准规范

2015年6月:ES2015

2016年6月:ES2016

2017年6月:ES2017

2018年6月:ES2018

2.为什么要学习ES6

每一次标准的诞生都意味着语言的完善,功能的加强。javaScript语言本身也有一些不令人满意的地方。

  • 变量提升特性增加了程序运行时的不可预测性。
  • 语法过于松散,实现相同的功能,不同的人可能会写出不同的代码

3.ES6 新增的语法

3.1 let

es6中新增的用于声明变量的关键字.

let声明的变量只在所处的块级有效
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>11let</title>
</head>
<body>
    <script>
        //ES6中:如果一个变量用let声明,那么它只在所处的块级中有效
        if(true){
            let a = 10;
        }
        function fn(){
            
        }
        for(let i = 0; i <= 10; i++){

        }
        
        console.log(i);
        console.log(a);
    </script>
</body>
</html>

**注意:**使用let关键字声明的变量才具有块级作用域,使用var声明的变量不具备块级作用域特性

不存在变量提升
//不存在变量提升
console.log(a);
let a = 20;
暂时性死区

利用let声明变量会绑定这个块级作用域,不会受到外界的影响

var temp = 123;
if(true){
    let temp;
    temp = 'abc';
}
经典面试题
var arr = [];
for(var i = 0; i < 2; i++){
    arr[i] = function(){
        console.log(i);
    }
}

arr[0]();
arr[1]();

关键是变量i是全局的,函数执行时候输出是全局作用域下的i的值

let arr = [];
for(let i = 0; i < 2; i++){
    arr[i] = function(){
        console.log(i);
    }
}

arr[0]();
arr[1]();

关键点就在于每次循环都会产生一个块级作用域,每个块级作用于下的变量都是不同的,函数执行时输出的都是自己上一级(循环产生的块级作用域)下的i的值

小结

  • let关键字就是用来声明变量的
  • 使用let关键字声明的变量具有块级作用域
  • 在一个大括号中使用let关键字声明的变量才具有块级作用域,var关键字声明的变量不具备块级作用域
  • 防止循环变量变成全局变量,可以使用let声明变量
  • 使用let官架子声明的变量没有变量提升
  • 使用let关键字声明的变量具有暂时死区特性

3.2 const

声明常量,常量就是(内存地址)不能变化的量

具有块级作用域
if(true){
	const a = 10;   
}
console.log(a); //a is not defined
声明的时候必须赋值
const PI;  //Missing initializer in const declaration
常量赋值后,值不能被修改
const PI = 3.14;
PI = 100; //Assignment to constant variable
小结
  • const声明的变量是一个常量(值不能被修改)
  • 既然是常量就不能重新再赋值,如果是基本数据类型,不能更改值。如果是复杂数据类型,不能更改地址值。
  • 声明const的时候必须要给定值

3.3 let、const和var的区别

varletconst
函数级作用域块级作用域块级作用域
变量提升不存在变量提升不存在变量提升
值可以修改值可以修改值不可更改

4.解构赋值

ES6中允许从数组中提取值,按照对一个位置,对变量赋值,对象也可以实现解构

4.1 数组解构

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>14数组解构</title>
</head>
<body>
    <script>
        let [a,b,c,d] = [1,2,3];
        console.log(a);
        console.log(b);
        console.log(c);
        console.log(d); //undefined  
        //如果解构不成功,变量的值就是undefined
    </script>
</body>
</html>

4.2 对象解构

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>15.对象解构</title>
</head>
<body>
    <script>
        let person = {
            name:'张三',
            age:20,
            gender:'男'
        }
        //对象解构 - 这种写法要求解构出来的变量名必须和属性名一致
        let {name,age,gender} = person;
        console.log(name);
        console.log(age);
        console.log(gender);

        //对象解构 - 可以解构出来的变量名和属性名不一样 (myname,myage,sex都属于别名)
        let {name:myname,age:myage,gender:sex} = person
        console.log(myname);
        console.log(myage);
        console.log(sex);
    </script>
</body>
</html>

小结

  • 解构赋值就是把数据结构分解,然后给变量进行赋值
  • 如果解构不成功,变量跟数值个数不匹配的时候,变量的值为undefined
  • 数组解构用中括号包裹,对象解构用花括号包裹,多个变量之间用逗号分隔
  • 利用解构赋值能够让我们方便的去取对昂中的属性和方法

5.箭头函数(⭐⭐⭐⭐⭐)

5.1 ES6中新增的定义函数的方式

() => {}  //() 代表是函数    => 必须要的符号,指向哪一个代码块    {}表示函数体
const fn = () => {}  //代表把一个函数赋值给了fn

5.2 大括号可省略

函数体内只有一行代码,且代码的执行结果就是返回值,可以省略大括号

//1.在箭头函数中,如果函数体内只有一句代码,
//     并且代码的执行结果就是函数的返回值,函数体大括号可以省略
// const sum = (x,y) => {
//     return x + y;
// }
const sum = (x,y) =>  x + y;

5.2 形参括号可省略

如果形参只有一个,可以省略小括号

//2.在箭头函数中,如果形参只有一个,形参外侧的小括号也是可以省略不写
// const fn = (v) =>{
//     console.log(v);
// }
const fn = v =>{
    console.log(v);
}
fn('我爱中国');

5.3 箭头函数中没有this

箭头函数不绑定this关键字,箭头函数中的this,指向的是函数定义位置上下文的this

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>02箭头函数中的this</title>
</head>
<body>
    <button>按钮1</button>
    <div>哈哈</div>
    <script>
        var btn = document.querySelector('button');
        var div = document.querySelector('div');
        btn.onclick = function(){
            console.log(this);
            // div.addEventListener('click',function(){
            //     console.log(this); //这个时候是div
            // });
            //箭头函数不绑定this关键字,箭头函数中的this,指向的是函数定义位置上下文的this
            div.addEventListener('click',() => {
                console.log(this); //这个时候是btn
            });
        }
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>01.箭头函数</title>
</head>
<body>
    <script>
        //箭头函数:用来简化函数定义语法的
        // const fn = () => {

        // }
        // fn();
        //1.在箭头函数中,如果函数体内只有一句代码,
        //     并且代码的执行结果就是函数的返回值,函数体大括号可以省略
        // const sum = (x,y) => {
        //     return x + y;
        // }
        const sum = (x,y) =>  x + y;
        
        const result = sum(10,20);
        console.log(result);
        //2.在箭头函数中,如果形参只有一个,形参外侧的小括号也是可以省略不写
        // const fn = (v) =>{
        //     console.log(v);
        // }
        const fn = v =>{
            console.log(v);
        }
        fn('我爱中国');

        //3. 箭头函数不绑定this。箭头函数没有自己的this关键字,如果在箭头哈桑怒中使用this关键字,
        //   this关键字将指向箭头函数定义位置中的this
        function fn2(){
            console.log(this);  //window
            // return function(){
            //     console.log('返回的:' + this);
            // }
            return () => {
                console.log(this);
            }
        }
        const obj = {name:'张三'}
        var resFn = fn2().call(obj);
        resFn();

    </script>
</body>
</html>

5.4 小结

  • 箭头函数不绑定this,箭头函数中的this指向的是它所定义的位置,可以简单的理解为,定义箭头哈桑农户中的作用域的this指向谁,他就指向谁
  • 箭头函数的有点在于解决了this执行环境中所造成的一些问题。比如:解决了匿名函数this指向的问题(匿名函数的执行环境具有全局性),包括setTimeout和setInterval使用this造成的问题。

5.5 面试题

var age = 100;
var obj = {
    age: 20,
    say: ()=>{
        alert(this.age);
    }
}

obj.say(); //100

箭头函数this指向是被声明的作用域里面,而对象没有作用域,所以箭头函数虽然在对象中被定义,但是this指向的是全局作用域。

6.剩余参数(⭐⭐⭐)

剩余参数语法允许我们将一个不定数量的参数表示为一个数组,不定参数定义方式,这种方式很方便的去声明不知道参数的情况下的一个函数。

6.1 语法
function 函数名 (first,...args){
    
}
6.2 剩余参数和解构
let students = ['zs','ls','ww'];
let [s1,...s2] = students;

console.log(s1); //sz
console.log(s2); //['ls','ww']
6.2 案例
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>04剩余参数</title>
</head>
<body>
    <script>
        const sum = (...args) => {
            let total = 0;
            //args.forEach(function(value){});
            args.forEach(value => {
                total += value;
            });
            return total;
        }

        console.log(sum(10,20));
        console.log(sum(10,20,30));
        console.log(sum(10,20,30,40,50,60));


        let arr1 = ['张三','李四','王五','赵六'];
        let [s1,...s2] = arr1;
        console.log(s1);
        console.log(s2);
    </script>
</body>
</html>

7.ES6的内置对象扩展

7.1 Array的扩展方法

扩展运算符(展开语法)

扩展运算符可以将数组或对象转换为用逗号分隔的参数序列

let arr = [1,2,3]
...arr
console.log(...arr); //等同于下面的写法
console.log(1,2,3);
扩展运算符可以应用于合并数组
//方法一
let arr1 = [1,2,3]
let arr2 = [3,4,5]
let arr1 = [...arr1,...arr2]

//方法二
arr1.push(..arr2);

将类数组或可遍历对象转换成为真正的数组
let oDivs = document.getElementByTagName('div');
oDivs = [...oDivs]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>05数组扩展运算符</title>
</head>
<body>
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div>5</div>

    <script>
        //1.扩展运算符可以将数组拆分成以逗号分隔的参数序列
        let arr = ['a','b','c'];
        // ...arr;  'a','b','c'
        console.log(...arr); //等同于下面的写法
        console.log('a','b','c');

        //2.扩展运算符应用于数组的合并
        let arr1 = [1,2,3];
        let arr2 = [3,4,5];
        let arr3 = [...arr1,...arr2];
        console.log(arr3);

        //第二种合并的方式
        arr1.push(...arr2);
        console.log(arr1);

        //3.利用扩展运算符将伪数组转换成真正的数组
        var oDivs = document.getElementsByTagName('div');
        console.log(oDivs);
        //转换成一个真数组
        var arr4 = [...oDivs]

        arr4.push('a');
        console.log(arr4);
    </script>
</body>
</html>
7.1.2 构造方法

Array.from()

将伪数组或可遍历对象转换成为真正的数组

//定义一个集合
let arrLike = {
    '0':'a',
    '1':'b',
    '2':'c',
    length: 3
}

//转成一个真数组
let arr2 = Array.from(arrLike); //['a','b','c']

方法还可以接受第二个参数,作用类似于数组的map方法,用原来对每个元素进行处理,将处理的值放入到返回的数组

//定义一个集合
let arrLike = {
    '0':1,
    '1':2,
    '2':3,
    length: 3
}

//转成一个真数组
let arr2 = Array.from(arrLike,item => item*2); //[2,4,6]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>06Array.from方法</title>
</head>
<body>
    <script>
        // var arrayLike = {
        //     '0':'a',
        //     '1':'b',
        //     '2':'c',
        //     length: 3
        // }
        // //将伪数组或可遍历对象转换成为真正的数组
        // var arr = Array.from(arrayLike);
        // console.log(arr); //['a', 'b', 'c']

        var arrLike = {
            '0':1,
            '1':2,
            '2':3,
            'length':3
        }
        //var arr = Array.from(arrLike,(item) => {return item*2});
        var arr = Array.from(arrLike,item => item*2);
        console.log(arr);
    </script>
</body>
</html>
7.1.3 实例方法find

用于找出第一个符合条件的数组成员,如果没有找到就返回undefined

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>实例方法find</title>
</head>
<body>
    <script>
        let arr = [
            {
                id:1,
                name:'张三'
            },
            {
                id:2,
                name:'李四'
            }
        ];
        //找数组里面符合条件的值,当数组中元素id等于2就查找出来
        //只会匹配一个
        //let target = arr.find((item,index) => { return item.id = 2;});
		let target = arr.find((item,index) => item.id = 2);
        console.log(target);
    </script>
</body>
</html>
7.1.4 实例方法findIndex

用于找出第一个符合条件的数组成员的位置,如果没有找到返回-1

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>实例方法findIndex</title>
</head>
<body>
    <script>
        // var arr = [
        //     {
        //         id:1,
        //         name:'张三'
        //     },
        //     {
        //         id:2,
        //         name:'李四'
        //     }
        // ]
        let arr = [10,20,30,50]
        let index = arr.findIndex((item) => {return item > 20;});
        //let index = arr.findIndex(item => item > 20);
        console.log(index);
    </script>
</body>
</html>
7.1.4 实例方法Includes

判断某个数组是否包含给定的值,返回布尔值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>实例方法Includes</title>
</head>
<body>
    <script>
        let arr = ['a','b','c','e'];

        let result = arr.includes('a'); 
        console.log(result); //true
        result = arr.includes('d');
        console.log(result);//false
    </script>
</body>
</html>

7.2 String的扩展方法

7.2.1 字符串模板

ES6 新增的创建字符串的方式,使用反引号定义

let name = `张三`
模板字符串中可以解析变量
let name = '张三';
let sayHello = `hello,my name is ${name}`;
模板字符串可以换行
let result = {
    name:'张三',
    age:20,
    sex:'男'
}
let html = `<div>
	<span>${result.name>}</span>
	<span>${result.age>}</span>
	<span>${result.sex>}</span>
</div>`
在模板字符串中可以调用函数
const sayHello = function(){
    return '厉害了我的国';
}

let grant = `${sayHello()}哈哈哈`

console.log(grant); //厉害了我的国哈哈哈
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>10.字符串模板</title>
</head>
<body>
    <script>
        let name = '张三';
        let sayHello = `hello,my name is ${name}`;
        console.log(sayHello);

        let result = {
            name:'张三',
            age:20
        }

        let html = `
            <div>
                <span>姓名:${result.name}</span>
                <span>年龄:${result.age}</span>
            </div>
        `;
        console.log(html);


        const fn = () => {
            return '厉害了我的国';
        }
        let html2 = `${fn()}哈哈哈`
        console.log(html2);
    </script>
</body>
</html>
7.2.2 startWith() 和 endWith()
  • startWith() 表示参数字符串是否在原字符串的头部,返回布尔值
  • endWith() 表示值参数字符串是否在原字符串的尾部,返回布尔值
let str = 'Hello World';
str.startWith('Hello'); //true
str.endWith('World'); //true
str.endWith('d'); //true
str.endWith('x'); //false
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>11startWith()endWith()</title>
</head>
<body>
    <script>
        let str = 'Hello ECMAScript 2024';
        let r1 = str.startsWith('Hello');   //区分大小写
        console.log(r1);
        let r2 = str.endsWith('4');
        console.log(r2)
    </script>
</body>
</html>
7.2.2 repeat()

字符串重复多少次

语法:字符串.repeat(次数);

console.log('*'.repeat(10));

8.Set数据结构

ES6中提供了一个新的数据解构set,它类似于数组,但是成员的值都是唯一的,没有重复的值。

Set本身是一个构造函数,用来生成Set数据结构

8.1 创建语法

const s = new Set();

set函数可以接受一个数组作为参数,用来初始化

const set = new Set([1,2,3,4,4,5]);  //{1,2,3,4}

8.2 实例方法

  • add(value):添加某个值到set,返回set结构本身
  • delete(value):删除某个值,返回一个布尔值,表示删除是否成功
  • has(value):返回一个布尔值,表示该值是否为Set的成员
  • clear() :清除所有的成员,没有返回值
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>13.set</title>
</head>
<body>
    <script>
        //1.创建一个空的set对象
        const s1 = new Set();
        console.log(s1);
        console.log(s1.size); //set的长度

        const s2 = new Set(['a','b','c']);
        console.log(s2);
        console.log(s2.size);
        //set中不能有重复的元素
        const s3 = new Set(['a','b','c','a']);
        console.log(s3);
        console.log(s3.size);

        const set = new Set();
        //往set中添加元素
        set.add('a');
        set.add('b').add('c').add('d').add('c');
        //set中删除元素
        const d1 = set.delete('d'); //删除成功返回true
        const d2 = set.delete('d'); //删除失败返回false
        console.log(d1);
        console.log(d2);
        //判断一个值是否是set数据结构中的成员,使用has,有就返回true,没有就返回false
        const r1 = set.has('d')
        console.log(r1);

        //清空set数据结构中的值,clear方法
        set.clear();
        console.log(set);
    </script>
</body>
</html>

8.3 遍历

Set结构的实例和数据一样,也拥有forEach方法,用于对每个成员执行某种操作,没有返回值

set.forEach(value => console.log(value));
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>14set结构的遍历</title>
</head>
<body>
    <script>
        const set = new Set(['a','b','c','d']);
        //遍历
        set.forEach(value =>{
            console.log(value);
        });
    </script>
</body>
</html>

d(‘b’).add(‘c’).add(‘d’).add(‘c’);
//set中删除元素
const d1 = set.delete(‘d’); //删除成功返回true
const d2 = set.delete(‘d’); //删除失败返回false
console.log(d1);
console.log(d2);
//判断一个值是否是set数据结构中的成员,使用has,有就返回true,没有就返回false
const r1 = set.has(‘d’)
console.log(r1);

    //清空set数据结构中的值,clear方法
    set.clear();
    console.log(set);
</script>
````

8.3 遍历

Set结构的实例和数据一样,也拥有forEach方法,用于对每个成员执行某种操作,没有返回值

set.forEach(value => console.log(value));
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>14set结构的遍历</title>
</head>
<body>
    <script>
        const set = new Set(['a','b','c','d']);
        //遍历
        set.forEach(value =>{
            console.log(value);
        });
    </script>
</body>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/904193.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

C语言:代码运行的底层奥秘,编译和链接

目录 翻译环境和运行环境编译环境预编译&#xff08;预处理&#xff09;编译词法分析语法分析语义分析 汇编 链接运行环境 翻译环境和运行环境 在ANSI C的任何⼀种实现中&#xff0c;存在两个不同的环境。 第1种是翻译环境&#xff0c;在这个环境中源代码被转换为可执行的机器…

2024 FinTechathon 校园行:助力高校学生探索金融科技创新

在金融科技蓬勃发展的当下&#xff0c;人才培养成为推动行业前行的关键。为推进深圳市金融科技人才高地建设&#xff0c;向高校学子提供一个展示自身知识、能力和创意的平台&#xff0c;2024 FinTechathon 深圳国际金融科技大赛——西丽湖金融科技大学生挑战赛重磅开启&#xf…

第7章 内容共享

第 7 章 内容共享 bilibili学习地址 github代码地址 本章介绍Android不同应用之间共享内容的具体方式&#xff0c;主要包括&#xff1a;如何利用内容组件在应用之间共享数据&#xff0c;如何使用内容组件获取系统的通讯信息&#xff0c;如何借助文件提供器在应用之间共享文件…

控制台安全内部:创新如何塑造未来的硬件保护

在 Help Net Security 的采访中&#xff0c;安全研究人员 Specter 和 ChendoChap 讨论了游戏机独特的安全模型&#xff0c;并强调了它与其他消费设备的不同之处。 他们还分享了对游戏机安全性的进步将如何影响未来消费者和企业硬件设计的看法。 斯佩克特 (Specter) 是本周在阿…

开源项目-投票管理系统

哈喽&#xff0c;大家好&#xff0c;今天主要给大家带来一个开源项目-投票管理系统 投票管理系统主要有首页&#xff0c;发起投票&#xff0c;管理投票&#xff0c;参与投票&#xff0c;查看投票等功能 首页 为用户提供了一键导航到各个功能模块的便捷途径。 新增投票 用户…

Unity 两篇文章熟悉所有编辑器拓展关键类 (上)

本专栏基础资源来自唐老狮和siki学院&#xff0c;仅作学习交流使用&#xff0c;不作任何商业用途&#xff0c;吃水不忘打井人&#xff0c;谨遵教诲 编辑器扩展内容实在是太多太多了&#xff08;本篇就有五千字&#xff09; 所以分为两个篇章而且只用一些常用api举例&#xff0c…

rnn/lstm

tip&#xff1a;本人比较小白&#xff0c;看到july大佬的文章受益匪浅&#xff0c;现在其文章基础上加上自己的归纳、理解&#xff0c;以及gpt的答疑&#xff0c;如果有侵权会删。 july大佬文章来源&#xff1a;如何从RNN起步&#xff0c;一步一步通俗理解LSTM_rnn lstm-CSDN博…

【Docker大揭秘】

Docker 调试一天的血与泪的教训&#xff1a;设备条件&#xff1a;对应的build preparation相应的报错以及修改 作为记录 构建FASTLIO2启动docker获取镜像列出镜像运行containerdocker中实现宿主机与container中的文件互传 调试一天的血与泪的教训&#xff1a; 在DOCKER中跑通F…

APISQL企业版离线部署教程

针对政务、国企、医院、军工等内网物理隔离的客户&#xff0c;有时需要多次摆渡才能到达要安装软件的服务器。本教程将指导您使用Linux和Docker Compose编排服务&#xff0c;实现APISQL的离线部署。 准备 准备一台Linux(x86_64)服务器。 安装Docker Engine&#xff08;推荐版本…

音视频入门基础:AAC专题(11)——AudioSpecificConfig简介

音视频入门基础&#xff1a;AAC专题系列文章&#xff1a; 音视频入门基础&#xff1a;AAC专题&#xff08;1&#xff09;——AAC官方文档下载 音视频入门基础&#xff1a;AAC专题&#xff08;2&#xff09;——使用FFmpeg命令生成AAC裸流文件 音视频入门基础&#xff1a;AAC…

docker 可用镜像服务地址(2024.10.25亲测可用)

1.错误 Error response from daemon: Get “https://registry-1.docker.io/v2/” 原因&#xff1a;镜像服务器地址不可用。 2.可用地址 编辑daemon.json&#xff1a; vi /etc/docker/daemon.json内容修改如下&#xff1a; {"registry-mirrors": ["https://…

【AI应用落地实战】智能文档处理本地部署——可视化文档解析前端TextIn ParseX实践

湘江之畔&#xff0c;秋风送爽。前不久&#xff0c;2024长沙中国1024程序员节在长沙盛大举行。今年的程序员节主题为“智能应用新生态”&#xff0c;以科技为纽带&#xff0c;搭建起了一个共筑智能应用新生态的交流平台&#xff0c;众多技术大咖齐聚一堂&#xff0c;探讨智能应…

echarts实现 水库高程模拟图表

需求背景解决思路解决效果index.vue 需求背景 需要做一个水库高程模拟的图表&#xff0c;x轴是水平距离&#xff0c;y轴是高程&#xff0c;需要模拟改水库的形状 echarts 图表集链接 解决思路 配合ui切图&#xff0c;模拟水库形状 解决效果 index.vue <!--/*** author:…

Kubeadm搭建k8s

一、架构 节点名称规格IP地址安装组件master012C/4G&#xff0c;cpu核心数要求大于2192.168.88.76docker、kubeadm、kubelet、kubectl、flannelnode012C/2G192.168.88.20docker、kubeadm、kubelet、kubectl、flannelnode022C/2G192.168.88.21docker、kubeadm、kubelet、kubect…

transformers和bert实现微博情感分类模型提升

项目源码获取方式见文章末尾&#xff01; 600多个深度学习项目资料&#xff0c;快来加入社群一起学习吧。 《------往期经典推荐------》 项目名称 1.【LSTM模型实现光伏发电功率的预测】 2.【卫星图像道路检测DeepLabV3Plus模型】 3.【GAN模型实现二次元头像生成】 4.【CNN模…

【Apache Zookeeper】

一、简介 1、场景 如何让⼀个应⽤中多个独⽴的程序协同⼯作是⼀件⾮常困难的事情。开发这样的应⽤&#xff0c;很容易让很多开发⼈员陷⼊如何使多个程序协同⼯作的逻辑中&#xff0c;最后导致没有时间更好地思考和实现他们⾃⼰的应⽤程序逻辑&#xff1b;又或者开发⼈员对协同…

了解lwip

lwIP是一个小型的开源的TCP/IP协议栈&#xff08;精简版的TCP/IP协议&#xff09;&#xff0c;博客借用了其他博客的内容在此声明。 TCP/IP协议栈结构 应用层&#xff1a;HTTP,MQTT,NTP、FTP....... 传输层:TCP协议&#xff08;用于不可靠设备可靠传输&#xff09;&#xff…

基于Springboot+微信小程序的房产交易租赁服务平台设计与实现 (含源码数据库)

1.开发环境 开发系统:Windows10/11 架构模式:MVC/前后端分离 JDK版本: Java JDK1.8 开发工具:IDEA 数据库版本: mysql5.7或8.0 数据库可视化工具: navicat 服务器: SpringBoot自带 apache tomcat 主要技术: Java,Springboot,mybatis,mysql,vue 2.视频演示地址 3.功能 该系统…

《Linux运维总结:基于ARM64+X86_64架构CPU使用docker-compose一键离线部署redis 6.2.14容器版哨兵集群》

总结&#xff1a;整理不易&#xff0c;如果对你有帮助&#xff0c;可否点赞关注一下&#xff1f; 更多详细内容请参考&#xff1a;《Linux运维篇&#xff1a;Linux系统运维指南》 一、部署背景 由于业务系统的特殊性&#xff0c;我们需要面向不通的客户安装我们的业务系统&…

【计算机网络 - 基础问题】每日 3 题(五十九)

✍个人博客&#xff1a;https://blog.csdn.net/Newin2020?typeblog &#x1f4e3;专栏地址&#xff1a;http://t.csdnimg.cn/fYaBd &#x1f4da;专栏简介&#xff1a;在这个专栏中&#xff0c;我将会分享 C 面试中常见的面试题给大家~ ❤️如果有收获的话&#xff0c;欢迎点赞…