js18编程思想

01.编程思想 [重要]

解决问题思维方式
       - 面向对象编程
            找解决问题的对象,调用其功能解决问题。
            如果解决问题的对象不存在, 自己创建对象,封装功能.

       - 面向过程编程
           按步骤进行,第一步做什么,第二步做什么 

02.创建对象的方式:【面试】

具体一个事物
           特征  行为
1.创建对象
           功能行为 -> 方法
           特征 -> 属性
2.创建的方式:
	1.简单函数创建
	 function test1() {
            let person = new Object() //创建一空对象
            person.name = 'jack' //对象创建属性name赋值为jack
            person.age = 18 //对象创建属性age赋值为18
        }
    2.字面量创建
     function test2() {
            let person1 = {
                name: 'jack',
                age: 18
            }

            let person2 = {
                name: 'rose',
                age: 20
            }

            let person3 = {
                name: 'tom',
                age: 21
            }...
        }
     3.工厂函数
     function createPerson(name, age) {
            let person = {
                name,
                age
            }
            return person
        }
        let p1 = createPerson('jack', 18)
        let p2 = createPerson('rose', 20)
        let p3 = createPerson('tom', 21)

        //创建手机对象,颜色,类型
        function createPhone(color, type) {
            let phone = {
                color,
                type
            }
            return phone
        }

        let pp1 = createPhone('白色', 'iphone13')
        let pp2 = createPhone('黑色', '华为monto-s122')
	4.构造函数 - 对象的模板
             1. 函数名就是对象类型名
                  首字母大写
             2. 构造函数体中,this关键字只定义属性和方法
             	
             3. 通过new语句 调用构造函数创建对象
             
             4.注意:事件处理函数中,在外层保存实例对象的this
       function Person(name, age) {
            this.name = name //给当前对象创建name属性,赋值为jack
            this.age = age   //给当前对象创建age属性,赋值为18
            this.say = function () {
                console.log(this.name, '在说话');
            }
        }

        //创建对象
        let o1 = new Person('jack', 18)
        let o2 = new Person('rose', 20)
        o1.say()
        o2.say()

        console.log(o1.name);
        console.log(o2.name);

        //表示手机的构造函数
        function Phone(color, type) {
            this.color = color
            this.type = type
            this.callPhone = function () {
                console.log(this.color + this.type + '的手机打电话');
            }
        }
        let phone1 = new Phone('白色','iphone13-10012')
        phone1.callPhone()
    
         5.Object.create() 方法创建对象,以参数为原型来创建
         Object.create() 方法创建一个新对象,使用现有的对象来提供新创建的对象的 __proto__。(请打开浏览器控制台以查看运行结果。)


03.检查对象数据类型

对象数据类型 
            instanceof关键字 (可以检查内置数据类型和自己创建数据类型)
            用法: 
               对象 instanceof 数据类型  =>返回值 true|false
基本数据类型 
            typeof
区分数据类型
            
            自己创建数据类型
               构造函数 
 
            内置数据类型
                Array 数组
                Object 简单对象
                String  字符串对象
                Date 日期时间
                Math
                RegExp
                JSON
             let arr = new Array()
             let arr = [10,20]
             arr instanceof Array

04.练习

选项卡1.0 -1.1- 1.2

05.概念区分

构造函数、实例、引用变量、对象名,对象概念区分
对象:
	实例对象  
        let p1 = new Person('jack',18) 
        //p1 引用变量  对象名 p1
        //实例对象,实例化一个对象,也就是new语句创建一个对象
	原型对象
	函数对象
	

06.prototype 原型对象【面试题】

1.面试:什么是原型对象?作用?
    1.实例对象公共的属性和方法,提取出来定义到一个独立的对象,节约内存空间
    2.javascript规定,每个构造函数都有一个prototype属性指向它的原型(原型对象)
    3.在原型对象上定义的属性和方法可以被所有构造函数对应的实例对象访问
2.面试:为什么实例对象能访问到原型对象公共的属性和方法?
	1.因为每个实例对象都有一个隐藏原型指向原型对象

3. //[[Prototype]] <==> __proto__
phone1.__proto__ === Phone.prototype
如果 原型函数和构造函数有同样的方法,实例对象会执行构造函数的方法(图里看出构造函数更近)

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-adyqOxZv-1669771432106)(D:\周sir\课件\week4-面向对象\原型引入.png)][外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UKiv1o22-1669771432107)(D:\周sir\课件\week4-面向对象\原型&实例对象&构造函数关系图.png)]

07. 内置(原生)对象

 所有函数都有 prototype 属性对象

同样的方法,实例对象会执行构造函数的方法(图里看出构造函数更近)


[外链图片转存中...(img-adyqOxZv-1669771432106)][外链图片转存中...(img-UKiv1o22-1669771432107)]

# 07. 内置(原生)对象 

所有函数都有 prototype 属性对象


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值