day3-JS之高级语法

---

前言

提示：这里可以添加本文要记录的大概内容：

例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、包装类型

定义：我们把经过包装后的简单数据类型叫做包装类型 ，包装类型也能使用属性和方法

<script type="text/javascript">
		
		//对象才有 属性，方法
		
		let str = 'abcd';
		//逻辑上：简单数据类型不能用方法
		// str.replace(); str是简单数据类型 却还是能用方法：这是因为在程序内部在调用方法的瞬间会把str简单数据类型进行包装，我们把经过包装后的简单数据类型叫做包装类型
		// let str = new String('abc');
		// console.log(str);
		
	</script>

1.String

== 定义：内置的构造函数 ，用于创建字符串==
创建字符串的两种方式：字面量创建和new String（）创建对象

字符串有length和索引号：

字符串trim()方法：用于去除字符串首尾两端的空白字符


字符串split()方法：
用字符串C分割，则把字符串的C都变成了逗号 ，如果不想去C，则可以传入空串；分割之后的每一项都放在数组中并且返回

字符串toLowerCase()方法：把字母转换为小写；与之相反的是toUppercase（）

字符串indexOf()方法：:查找某个元素首次出现的索引值。找不到返回-1；同理 lastIndexOf（）：查找某个元素尾次出现的索引值 ，找不到返回-1

字符串slicef()方法：截取字符串 和subString（）一模一样 唯一的区别：subString（大索引，小索引）会自动变为subString（小索引，大索引），而slicef()不会
注意：这两个方法，如果参数只有一个索引值，那么从这个索引值的位置一直截取到最后


substr():截取字符串

2.Number

== 定义：内置的构造函数 ，用于创建数字==
== 注意：parseInt和parseFloat在新版本中已经归属于在Number之内了：Number.parseFloat()==
数值的toFixed（）方法：用于保留几位有效数字（遵循四舍五入，保留两位看第三位）

Boolean

== 定义：内置的构造函数 ，用于创建布尔值==

补充两个公共方法

注意：undefined和null没有这个两个公共方法，因为他们两个是具体值

二、面向对象

面向对象的三个特征：封装、继承、多态

1.封装

2.原型对象【显示原型】

定义：就是函数的一个属性 prototype；每一个函数的prototype属性指向了一个对象，我们把这个对象叫做原型对象或者原型，每个原型对象都有constructor属性，这个属性的值就是它对应的构造函数
出现的原因：当我们通过构造函数和new关键字实例化一个对象的时候，就会开辟一块空间存放着这个对象的属性和方法，但是实例化多个对象之后，他们的方法却是一样的，但仍然占用了空间的内存；
作用：用来存放构造函数的方法（共享方法），减少内存空间的占用
所有实例化对象都能够共享原型对象的成员
注意：当实例化对象在构造函数中没有找到内容就会去原型对象找，如果在构造函数中找到内容就不会去原型对象中查找
==捋一捋：==每个函数都有prototype属性，函数的prototype属性指向的是一个对象（我们称为原型对象），（既然是对象就可以有属性和方法），这个对象有个自带属性是constructor，属性值是：原型对象对应的函数
在原型对象中添加方法：
原型对象的constructor
作用：用来找到原型对象的构造函数
注意：所有原型对象都有constructor属性，原型对象的constructor属性指回原型对象的构造函数

  <script>
        function F1() {
            name: '李白'
        }
        console.log(F1); //打印函数
        console.log(F1.prototype.constructor);//原型对象的constructor指向的是构造函数本身 也就是F1
    </script>

分析一：当我们实例化一个对象之后，想要通过这个实例对象找到它的构造函数应该怎么找？
答案：通过 对象名.constructor 就可以找到它的构造函数
具体的查找过程：对象中本身是没有constructor这个属性的，当实例对象找不到成员，就会利用每个对象都有的proto属性去原型对象中查找成员
构造函数、实例对象、原型对象的关系：

每一个对象都有__proto__属性【对象原型，隐式原型】(两个下划线proto两个下划线)，
==作用：==用于指向原型对象

3.继承

继原型对象回顾内容
构造函数相当于模板，模板内存放着公共内容；构造函数中的方法一般放在【添加】构造函数的原型对象里面

3.1继承

我们继承的内容一定是公共的内容 ，我们将公共内容提取并装到对象中
实例化一个中国人，中国人本应该要有对象中的属性但是没有，所有要想办法让实例对象（所有实例对象）继承这公共内容，我们可以把公共内容给对象的 _ _proto _ _属性（原型）：因为实例对象找不到成员时回去原型中找；我们将存放着公共属性的对象赋值给原型对象，这样原型对象就保存了这些公共成员，但是原型对象默认自带的constructor属性就被覆盖而消失了，这不是我们想看到的，所以我们还需要给这个原型对象手动添加回去constructor: 添加：Chinese.prototypr.constructor=Chinese; 但是通过其他构造函数（如：Japanese）new出来的实例化对象如果也要继承同一块公共内容，如果还是如上述操作那般，则必然会发生：将对象的公共内容赋值给Japanese的原型对象：Japanese.prototype=obj; 注意：这是将对象赋值给对象，引用传递传递的是地址，然后再给Japanese原型对象恢复自带的constructor属性：这时Chinese的原型对象的constructor属性值却是：构造函数Japanese ；出现这样的情况就是：因为在这之前执行了Japanese.prototype=obj; 将之前Chinese的原型对象进行了修改，使得Chinese的原型对象的constructor被换成了当前最新的Japanese的原型对象的constructor；所以通过这种方式的继承是有缺点的；这种继承方式分两步：第一步：将含有公共成员的对象赋值给构造函数的原型对象，第二步：给原型对象添加constructor属性并且指回当前的构造函数

3.2继承优化

对于之前继承的方式：我们是把一个具体定义的字面对象赋值给构造函数的原型对象；这次我们将对象赋值给构造函数的原型对象
==注意区别：==实例化对象是通过new构造函数赋值实现的；其实 new 构造函数本身就是对象了 ，赋值只是将对象具体、化实例化
==优化之后：==通过 将new 构造函数赋值给构造函数的原型对象就不会出现上面的constructor问题了，优化之后：通过对应的构造函数new出来的对象，它的原型对象的自带属性constructor指向的函数也是对应的

   <script>
        // 构造函数 人
        function Person() {
            this.head = 1;
            this.eyes = 2;
            this.legs = 2;
            this.say = function () { console.log('say'); }
            this.eat = function () { console.log('eat'); }
        }
        // 构造函数 中国人
        function Chinese() {
            this.language = '汉语';
            this.skin = 'yellow';
        }

        // 继承:
        // 1、把对象赋值给原型对象 Chinese.prototype = 对象   之前是实例化对象 这次是对象 ；new 构造函数就是一个对象 之前不过是赋值的方式进行了对象的实例化
        Chinese.prototype = new Person();
        // 2、指回构造函数本身
        Chinese.prototype.constructor = Chinese;
        let c1 = new Chinese();
        console.log(c1);
        //-----------------------------------------
         构造函数 日本人
        function Japanese() {
            this.language = '日语';
            this.skin = 'white';
        }
        //进行继承人 1、把对象赋值给原型对象
        Japanese.prototype = new Japanese();
        // 2、指回构造函数本身
        Japanese.prototype.constructor = Japanese;
        let j1 = new Japanese();
        console.log(j1);
    </script>

4.原型链

定义：由原型构成的链状结构
作用：提供查找成员的方法；类似于作用域链，当在这个原型找不到就去深一层的原型中查找成员

三、This

1.this指向

1.== 普通函数内的this指向window==；理解：因为在调用函数的时候是window在调用，只不过我们通常省略了window
2. 构造函数的this指向当前实例化的对象；
3. 方法中的this指向调用者对象
4. 事件处理函数的this指向事件源
5. 定时器调用函数中的this指向window

2.严格模式

开启严格模式 ：'use strict ';在你需要开启严格模式的作用域内置于第一句位置
遵守

• 变量必须先定义后使用
• 普通函数中的this指向undefined
• 函数中的形参不能重名

3.改变this指向

·函数都有这三个方法
call
函数.call（）：第一个参数是你要将this指向的新目标，不想改变则写null，其余在第一个参数后面的都是给函数准备的
注意：函数调用call，同时call会调用函数执行，在函数执行的同时改变this指向

apply
函数apply（）：和call相同；不同的是第二个参数是数组
应用场景：和数组打交道

apply应用场景

bind
函数bind（）：第一个参数是你要将this指向的新目标，但是在改变this指向之后函数并不会调用；而是返回改变this之后的函数；所以返回的是一个函数！！！
==什么时候使用bind:==想改变this 但是不想让函数立刻执行；此时适合用bind


在定时器中使用binid：

扩展： … rest剩余参数用于函数参数和解构赋值中； …也叫扩展运算符，在数组、字符串、对象中都是展开的意思 ；效果如下图：将数组的中括号拆开

四、class类

定义： class是关键字，专门用于创建类的，类可被用于实现逻辑的封装，在ES6中用class创建对象
定义类语法： class 类名 {} 类名参考构造函数的函数名规范
==类的内容：==封装一些公共成员
实例如下：
实例化的类仍然是一个对象

1.类中添加成员

成员由静态成员和实例成员
类中每个成员之间用分号隔开
类中添加静态成员用static关键字
在类中添加方法 不能再写function关键字了 直接 ：static eat(){} 静态成员只能类/构造函数调用
不加static关键字的就是实例成员 对象使用实例成员

2.类中有特殊的构造函数constructor

constructor是一个特殊的方法，不论我们写不写，都会自动创建这个，在实例化对象的时候通过constructor构造的函数会自动执行
应用场景： constructor通常用于接收参数，做初始化

3.类之间的继承extends

3.1super

先调用super；再设定自己的成员

分析super
super用于调用父类的constructor方法或者普通方法
明星类继承人类，在明星类中添加自己的属性在constructor中，但是uname,age,sex和人类一样，所以可以继续继承Person,可以用super（uname,age,sex）表示继续继承Person，但是要放在当前语句块的第一句，在super语句之后再添加 自己的成员

四、拷贝

拷贝不是直接赋值

1.浅拷贝

==定义：==只拷贝外面一层的简单类型数据，如果在第一层中还有复杂数据类型，浅拷贝仍然是将地址赋值过去

==Object.assign（）：==专门实现浅拷贝；newObj是空对象；obj是有内容的对象

2.深拷贝

==定义：==所有层都拷贝了

==注意：==浅拷贝过程中 对象名都写死了；所以封装一个拷贝函数
在这里插入图片描述

总结

提示：这里对文章进行总结：