js18编程思想

简介: js18编程思想

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
如果 原型函数和构造函数有同样的方法,实例对象会执行构造函数的方法(图里看出构造函数更近)


07. 内置(原生)对象

 所有函数都有 prototype 属性对象

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

[外链图片转存中...(img-adyqOxZv-1669771432106)][外链图片转存中...(img-UKiv1o22-1669771432107)]
# 07. 内置(原生)对象 

所有函数都有 prototype 属性对象


         
相关文章
|
消息中间件 运维 关系型数据库
超低运维成本,构建自有高性能商业充电运营平台
奥升新能源技术服务平台,致力于高性能高费效比技术框架研发与实施,致力于为客户提供性价比最优的技术解决方案和运维服务。
|
Java
leetcode-377:组合总和 Ⅳ
leetcode-377:组合总和 Ⅳ
103 0
|
数据处理 网络虚拟化 网络架构
VLAN端口类型详解——Huawei、Cisco
VLAN(Virtual Local Area Network,虚拟局域网)技术可以把一个物理LAN划分成多个逻辑的LAN——VLAN,每个VLAN是一个广播域。处于同一VLAN的主机能够直接互通,而处于不同VLAN的主机不能够直接互通。
718 0
VLAN端口类型详解——Huawei、Cisco
|
8天前
|
人工智能 运维 安全
|
6天前
|
人工智能 异构计算
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
|
7天前
|
机器学习/深度学习 人工智能 自然语言处理
B站开源IndexTTS2,用极致表现力颠覆听觉体验
在语音合成技术不断演进的背景下,早期版本的IndexTTS虽然在多场景应用中展现出良好的表现,但在情感表达的细腻度与时长控制的精准性方面仍存在提升空间。为了解决这些问题,并进一步推动零样本语音合成在实际场景中的落地能力,B站语音团队对模型架构与训练策略进行了深度优化,推出了全新一代语音合成模型——IndexTTS2 。
629 22
|
6天前
|
人工智能 测试技术 API
智能体(AI Agent)搭建全攻略:从概念到实践的终极指南
在人工智能浪潮中,智能体(AI Agent)正成为变革性技术。它们具备自主决策、环境感知、任务执行等能力,广泛应用于日常任务与商业流程。本文详解智能体概念、架构及七步搭建指南,助你打造专属智能体,迎接智能自动化新时代。
|
13天前
|
人工智能 JavaScript 测试技术
Qwen3-Coder入门教程|10分钟搞定安装配置
Qwen3-Coder 挑战赛简介:无论你是编程小白还是办公达人,都能通过本教程快速上手 Qwen-Code CLI,利用 AI 轻松实现代码编写、文档处理等任务。内容涵盖 API 配置、CLI 安装及多种实用案例,助你提升效率,体验智能编码的乐趣。
1020 110