复习JavaScript高级01-内置对象-原型对象-构造函数

最新推荐文章于 2024-09-04 20:18:34 发布

我的Y轴是反的

最新推荐文章于 2024-09-04 20:18:34 发布

阅读量191

点赞数

文章标签： javascript linq 前端

本文链接：https://blog.csdn.net/vip77778888/article/details/122202641

版权

内置对象

内置对象api： js作者提前写好的对象，里面有一些预先定义的方法，我们直接使用即可，无需关心原理

api : 预先定义的函数

例如:

数组的增删改查操作
新增元素到最后面： arr.push( 元素 )
新增元素到最前面： arr.unshift()
删除最后一个元素： arr.pop()
删除第一个元素： arr.shift()
删除指定位置元素： arr.splice(起始下标,删除数量)

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    let arr = [20, 40, 12, 14, 5, 34, 43, 6, 6, 7, 756, 765, 7, 58]
    let str = arr.join("$") // 转换字符串类型 中间可以写字符串
    console.log(str);
    arr.reverse() // 反转函数

    console.log(arr);
    arr.sort(function (a, b) {
      return b - a // 冒泡排序
    })
    console.log(arr);

    let index = '大前端聪明蛋天下第一'
    let index1 = index.indexOf('聪明蛋') //indexOf 返回指定位置的下标
    console.log(index1);

    let str1 = '你是谁#聪明蛋'
    console.log(str1.split('#')) //split 切割字符串 可以分成2个数组
    console.log(str1.split('='));

    let index2 = index.substr(5, 3) //substr 截取部分字符串取第五个下标 截取后的3个数字
    console.log(index2)

    console.log('dukawhdkwbdkBYJGSDJY'.toLocaleLowerCase()) //全部转换为小写
    console.log('dukawhdkwbdkBYJGSDJY'.toLocaleUpperCase()) //全部转换为大写
  </script>
</body>

</html>

总而言之就是预先设定好的函数直接调用即可

构造函数


  <script>
    function Conte(name, age) {
      // 里面有4步
      //1,创建一个新的空对象{}
      //2,this指向这个空对象
      //3,给this赋值
      //4.return这个this
      this.name = name
      this.age = age
    }
    let index1 = new Conte('聪明蛋', 18)
    let index2 = new Conte('聪明蛋', 22)
    console.log(index1, index2)
    // 构造函数 一定要加new  
  </script>

构造函数创建对象（new关键字四个工作流程）
构造函数：使用new关键字调用的函数
(1)创建空对象
(2)this指向这个对象
(3)对象赋值
(4)返回对象

原型对象

原型：任何构造函数在被创建的时候，系统都会自动帮我们创建一个与之对应的对象，称之为原型对象

同时解决内存浪费与全局变量污染的问题

谁可以访问原型对象中的成员(属性和方法)

构造函数自身：构造函数名.prototype
构造函数实例化的每一个对象：点语法直接访问

a. 原型：每一个函数被创建的时候，系统都会自动创建与之对应的对象，称之为原型对象
b. 作用：解决构造函数（1）内存资源浪费（2）全局变量污染
c. 怎么用：（1）构造函数.prototype (2)实例化对象直接访问

 /* 
        1.prototype属性： 属于构造函数，指向原型对象
            * 作用： 解决构造函数资源浪费+变量污染
        2.__proto__属性： 属于实例对象，指向原型对象
            * 作用： 可以让实例对象访问原型中的成员
        */

      //1.构造函数
      function Person (name, age) {
        this.name = name
        this.age = age
      }

      //2.原型对象
      Person.prototype.eat = function () {
        console.log('我中午真的吃了红烧武昌鱼')
      }
      Person.prototype.country = '中国人'

      //3.实例对象
      let p1 = new Person('聪明蛋', 28)
      console.log(p1)

      /* 
      __proto__ : 属于实例对象,指向原型对象
      */
     console.log( Person.prototype === p1.__proto__ )//true

     //实例对象为什么可以直接访问原型中的成员，其实都是通过__proto__来访问的
     /* 
     1.虽然实例对象可以直接访问原型的原理是 __proto__,但是开发中不推荐使用
     2.原因： __proto__不是ECMA标准语法，有一些浏览器不支持。
     3.结论： 学习阶段，学习原型可以用__proto__. 实际开发中，建议省略__proto__
     */
     p1.eat()//p1.__proto__.eat()

总结

什么是原型？
- 任何构造函数在被创建的时候，系统都会自动帮我们创建一个与之对应的对象，称之为原型对象
2.如何访问原型对象
- 构造函数名.prototype
3.哪些对象可以访问原型？
- a.构造函数自身
- b.该原型对应的构造函数实例化出来的对象
4.proto属性介绍
- 属于对象，指向实例化这个对象的构造函数对应的原型
- proto属性不是W3C的标准属性，所以实际开发中一般不会使用它来访问原型
6.constructor属性介绍
- 属于原型对象，指向这个原型对应的构造函数
- 作用:可以得知某个实例对象，到底是由哪一个构造函数生成的

我的Y轴是反的

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复习JavaScript高级01-内置对象-原型对象-构造函数

目录内置对象构造函数原型对象总结内置对象内置对象api： js作者提前写好的对象，里面有一些预先定义的方法，我们直接使用即可，无需关心原理 api : 预先定义的函数例如:数组的增删改查操作新增元素到最后面： arr.push( 元素 ) 新增元素到最前面： arr.unshift() 删除最后一个元素： arr.pop() 删除第一个元素： arr.shift() 删除指定位置元素： arr.spli...
复制链接

扫一扫