JS高级第一天

三元表达式

1.条件表达式？表达式1：表达式2
2.条件表达式用于判定：true||false
3.true执行表达式1
4.false:执行表达式2
5.本质就是简化if-else
6.if（条件表达式){
表达式1
}else{
表达式2
}
7.：
< type=“radio” name=“gender”> 男
< type=“radio” name=“gender”>女

<script>
    let inputs = document.querySelectorAll('input')

    inputs.forEach(function (input, i) {
        input.onclick = function () {

            // let res
            // if (i == 0) {
            //     res = '男'
            // } else {
            //     res = '女'
            // }

            let gender = i == 0 ? '男' : '女'

            console.log(gender)
        }
    })

冒泡排序

1.冒泡特点：遍历，相邻进行比较，位置不对就交换
for (let j = 0; j < ages.length; j++) {
for (let i = 0; i < ages.length - 1 - j; i++) {
// 第一个：ages[i] 第二个：ages[i+1]
if (ages[i] > ages[i + 1]) {
// 交换
let temp = ages[i]
ages[i] = ages[i + 1]
ages[i + 1] = temp
}
}
}

    console.log(ages)

    console.log(ages.sort(function (a, b) { return b - a }))

创建对象的几种形式

1.创建对象：字面量{}
let obj1 = {
name:“安其拉”
age：18
skill:技能
}
2.工厂模式：将结构写到函数里面，每次给函数提供数据，返回对象：结构是一样的，数据不同，可以实现结构的复用：
function createHer(name,age,skill){
return{
name:name
age:age
skill:skill
}
}
let obj2 = createGero(‘妲己’，18，’女‘，)
输出的结果为age:18,name:妲己,skill:女

构造函数

构造函数：方便区分对象，将对象进行分类：new object()

1.定义一个构造函数(为了区分：构造函数：大驼峰)
function CreateDog(name,gender,age,skill){
this.name=name
this.age=age
this.gender = gender
this.skill = skill
构造函数不需要返回值的
}
2.通过构造函数创建对象:new 构造函数（）
let obj4 = new CreateDo(’'戈薇”，“女”，18，“破魔箭”)
输出结果为：age: 18
gender: “女”
name: “戈薇”
skill: “破魔剑”
使用构造函数的目的：就是为了区分对象

构造函数与普通函数的区别

1.普通函数可以用new？可以
function a() {
// 当构造函数的时候：普通的return无效
return ‘hello world’
}

    let obj1 = new a()
    console.log(obj1)：结果为：a
    2.构造函数可以当普通函数用？可以
      // 2. 构造函数可以当普通函数用吗？可以
    function CreateStudent(name, age, stuno) {
        this.name = name
        this.age = age
        this.stuno = stuno
    }

    let obj2 = CreateStudent('张三', 18, '000001')
    console.log(obj2)
    构造函数可以有返回值：只有当返回值的结果是对象的时候
     function CreateTeacher(name, age) {
        this.name = name
        this.age = age

        // return 'gun'

        // 如果返回的是复杂数据类型：可以改变对象（没有任何含义）
        return { gun: '滚就滚' }
    }

    let obj3 = new CreateTeacher('小马哥', 50)
    console.log(obj3) 结果为：滚就滚

    // 构造函数：就是用来new的
    // 普通函数：就是用来调用的
    // 二者不需要也绝不可能交叉使用

构造函数给对象赋值的弊端

// 构造函数：让对象具有name，age属性，有一个方法：say，输出我是谁，今年多大

    function CreateStudent(name, age) {
        this.name = name
        this.age = age

        this.say = function () {
            console.log(`我是${this.name},我今年${this.age}岁`)
        }

        // 本质原因：给say赋值的函数是一个匿名函数：用后即焚（无法复用）
        // 解决方案：让函数变成有名函数，放到函数外面，然后让内部属性指向外部函数
    }

    let stu1 = new CreateStudent('王浩', 20)
    console.log(stu1)
    stu1.say()


    let stu2 = new CreateStudent('奥迪', 18)
    stu2.say()

    console.log(stu1.say == stu2.say)       // false：说明占用两份内存

    // 构造函数内部给this直接赋值函数：所有对象的内存中都会保留该函数
    // 占用的内存的数量就是对象的数量：内存占用比较严重

    // 解决内存占用问题
    function CreateTeacher(name, age) {
        this.name = name
        this.age = age

        this.say = say
    }

    // 定义一个有名函数：say
    function say() {
        console.log(`我是${this.name},我今年${this.age}岁`)
    }

    let t1 = new CreateTeacher('杰豪', 30)
    let t2 = new CreateTeacher('小马哥', 50)

    t1.say()
    t2.say()

    // 证明只有一份内存
    console.log(t1, t2)

    console.log(t1.say === t2.say)  // true


    // 上述解决方案有bug：say是一个全局函数
    // 容易被污染？

构造函数原型对象

1.解决内存占用问题

    // 解决内存占用问题
    function CreateTeacher(name, age) {
        this.name = name
        this.age = age
    }

    // 将为函数的属性：挂载到原型对象上
    CreateTeacher.prototype.say = function () {
        console.log(`我是${this.name},我今年${this.age}岁`)
    }

    let t1 = new CreateTeacher('杰豪', 30)
    let t2 = new CreateTeacher('小马哥', 50)

    t1.say()
    t2.say()

    console.log(t1, t2)

    // 证明：两个say不占用内存
    console.log(t1.say === t2.say)  // true

原型对象找函数原型 // 原型对象：只要是个函数，系统一定会为函数 自动 产生一个对象：原型对象prototype

    // 函数如何找到自己的原型对象呢？
    // 函数名.prorotype
    function a() { }

    console.log(a.prototype)
    // 原型对象中默认只有一个属性：constructor，指向所在的构造函数

    // 构造函数：男人
    // 男人找女人：男人.prototype
    // 原型对象：系统分配的女人
    // 女人找男人：constructor

    // 一对一关系：证明
    console.log(a.prototype.constructor == a)   // true


    // 原型对象是一个对象：对象是否可以添加属性？且非常安全
    // 男人.女人.新增属性 = 新的属性值
    // 构造函数.prototype.属性名 = 值
    a.prototype.say = function () {
        console.log('我是要成为海贼王的男人')
    }

    // 原型对象中的方法：给对象用，构造函数产生的对象
    let objA = new a()
    objA.say()

    // 对象的原型对象(__proto__) === 构造函数的原型对象(prototype)
    console.log(objA.__proto__ === a.prototype)     // true


    // 总结
    // 1. 是函数一定会有原型对象：系统产生
    // 2. 函数如何找到原型对象：函数名.prorotype
    // 3. 原型对象中默认有一个属性：constructor，指向构造函数本身

    // 4. 构造函数的作用：new产生对象，产生的对象与构造函数没有直接关联（间接有）
    // 5. 构造函数产生对象可以通过__proto__找到原型对象

    // 以上就是原型的三角关系

    // 解决的问题
    // 1. 原型对象只有1个：将方法存储到原型对象中，占用一份内存
    // 2. 原型对象是对象：方法存在对象里面不存在覆盖问题，与全局隔离：安全

总结：其实就是一级一级去找对象，顶级对象是null，第一个函数找其他就加prototyge就可以找到原型对象，往下面好找__proto__就找到new出来的新对象