javaScript第七天（2）

javaScript基础

☞ 对象其他部分 [理解]

• 自定义构造函数创建对象[掌握]

  //继续简化 自定义构造函数
  function People(uName, uAge) {
               this.uName = uName;
               this.uAge = uAge;
  }
  // 如何通过自定义构造函数创建对象?
  var zs = new People('张三', 20);
  console.log(zs);
  

  • 注意事项:
    1. 自定义构造函数的命名规则要遵守帕斯卡命名法(单词的首字母大写)

• this关键字

  this 关键字到底指的是谁?
  口诀: 谁调用函数(构造函数), this 就指向谁(就是谁)
  
  普通函数中的 this 关键字指向的就是 window对象
  function fn() {
     console.log(this);
  }
  window.fn();   // 因为我们平时调用函数时候, window对象省略
  
  
  在对象的方法中 this 关键字指向的就是 当前这个对象
  var  obj = {
      //方法
      eat:function() {
         console.log(this);  // 指向的是当前对象
      }
  }
  
  obj.eat(); 
  

• new关键字执行过程
  

  1. 先执行 new 关键 ----> 内存中开辟一个空间(空对象)
  2. 将用户的实参信息通过形参赋值给 空对象中 this 关键字
  3. 给 this 关键字 赋值
  4. 将this 关键字 最后指向 创建的对象

• 遍历对象[掌握]

  语法:
  for(键  in  对象) {
      
      对象[键];
  }
  
  例如:
   var obj = {
              uname: 'asd',
              age : 34,
              uheight: 180,
              color: 'red',
              weight: 70
          }
          // key 是一个变量, 这个变量中保存的就是 obj 对象中的所有属性
          for(key in obj) {
              //获取对象的值
              console.log('属性名:' +key + '对应的值:' + obj[key]);
          }
  
  

• instanceof关键字[以了解为主]

  instanceof :  判断当前对象 是否是 某个构造函数创建的  (判断孩子是不是某个人的骨肉)
  typeof :  获取数据类型
  

• 简单数据类型在内存中的存储方式

  简单数据类型,在内存的栈上保存的, 栈区中保存的就是变量的一个具体的值
  

• 复杂数据类型在内存中的存储方式

  复杂数据类型(对象), 在内存的堆上保存的, 复杂数据类型在内存中保存的是一个地址
  

 function Person ( name, age ) {
       this.name =  name; 
       this.age = age;
       this.sayHi = function () {
          console.log( "你好" );
       }
  }
   var p1 = new Peron( "张三", 18 );

    function getperson ( person ) {
		
          person.name = "李四";
        
    }
	getperson( p1 );

    console.log( p1.name );   思考： p1 的name值是什么？

1. 知识点-内置对象

• 为什么要学内置对象？

  内置对象中已经帮助我们是实现相关的方法(数学, 时间 ....), 提高代码效率
  

• 什么是内置对象？

  内置对象: js中本身已经具有的对象, 不需要我们手动创建,直接调用.
  

• 内置对象要学什么？怎么学？

  ☞ 各种方法
  ☞ 属性
  学习的方式: 通过查询手册实现
  手册地址:  https://developer.mozilla.org/zh-CN/docs/Web/JavaScript
  

2. 知识点-内置对象Math

• Math内置对象

  提供了与数学操作相关的方法和属性
  

  • 属性: Math.PI 获取圆周率

    获取圆周率
    

  • 方法:

    • 求一个数字的幂数(几次方)

      Math.pow(x, y)
      

    • 获取一组数字的最大值

      Math.max()
      

    • 获取一组数字中的最小值

      Math.min();
      

    • 求一个数字的绝对值

      Math.abs();
      

    • 求一个数字的四舍五入运算

      Math.round()
      
      注意一点: 该方法返回的是一个整数
      

    • 随机数

      Math.random()       大于等于 0  小于 1
      

    • Math.floor()

    • Math.ceil()

3. 知识点-内置对象数组

• 数组难到也是对象?数组也是内置对象?

  var  ary  = new Array();
  

• 数组添加值 push() unshift()

  1. push() 方法

     通过 push()方法可以向数组中同时添加一个或者多个值,添加到数组的末尾
     

  2. unshift()方法

     通过 unshift()方法可以向数组中同时添加一个或者多个值, 添加到数组的开始位置
     

• 删除(取值)数组中的值 pop() shift()

  1. pop()方法

     pop() 方法从数组中删除某个值, 从数组中从后向前删除, 返回值就是删除的值
     

  2. shift()方法

     shift() 方法将数组中某个值删除, 从数组的开始位置向后删除,返回的结果也是删除的值
     

• 翻转数组 reverse()

  reverse() 翻转数组, 返回值就是翻转后的数组
  

• join()

  将数组中的值以一个分割符拼接成一个字符串, 返回的结果就是一个字符串
  

• indexOf()、lastIndexOf()

  1. indexOf()方法

     indexOf() 从数组中查找值对应的索引位置, 如果找到这个值,那么就返回值对应的索引位置, 如果没有找到,返回的结果就是 -1
     
     indexOf()可以设置第二个参数, 第二个参数可以设置也可以不用设置,代表的意思从哪开始找, 如果找到则返回对应的索引,否则返回-1
     

  2. lastIndexOf() 方法

     lastIndexOf() 从数组中查找值对应的索引位置
     
     lastIndexOf()也可以设置第二个参数, 二个参数的作用与indexOf()中第二参数的作用一样.
     

  3. 区别

     • indexOf() 从数组的前 向 后 找
     • lastIndexOf() 从数组的后向前找

  4. 补充: 判断一个值是不是数组 Array.isArray(obj)

4. 知识点-内置对象字符串

• 字符串特性:

  不可变特性, 字符串在内存中的位置空间.
  在程序中大量拼接字符串会有什么问题?  ---> 浪费内存 (由于字符串不可变特性)
  

• 获取指定位置处的字符

  charAt(索引值)
  注意: 字符串中的索引位置从 0 开始
  

• 截取字符串 [重点]

  ☞ slice(startIndex[, end])
     // slice()
              // console.log(str.slice(6));
              // slice(starindex);
              //参数starindex代表从字符串中哪个位置开始截取,默认是到字符串的结尾处
  
              // console.log(str.slice(6, 8));
              // slice(startindex, endindex)
              // 参数: startindex 从哪开始截取
              // 参数: endindex  截取字符串到哪结束[不包括这个值]
  
  ☞ substring(startIndex[,end]); 
   //substring()截取字符方法与slice方法一样
  
  ☞ substr(startIndex[, length])
   // substr(startindex, length)
   // 参数: startindex 代表从字符串的哪个位置开始截取, 默认到字符串的结束位置
  // 参数: length 代表的是要从字符串中一共截取多少个
  

• 拼接字符串

  concat()  ====> 将字符串拼接到一块, 返回一个新的字符串
  

• 替换

  replace('targetElement', 'element')   ====> 返回的结果也是字符串
  

• 去除空白

  trim()    ====> 将字符串的首尾空白去掉
  

• indexOf(字符) lastIndexOf(字符)

  indexOf(字符)	: 都是用来获取字符串中对应字符的索引位置, 从左向右查找, 如果找到那么就直接返回对应的索引位置, 如果没有找到,那么就返回-1
  
  lastIndexOf(字符) : 都是用来获取字符串中对应字符的索引位置, 从后向前找, 如果找到那么就直接返回对应的索引位置, 如果没有找到,那么就返回-1
  
  备注:
  1. indexOf(字符) 和  lastIndexOf(字符)  支持第二参数的设置,如何设置了第二个参数,那么代表从指定的位置起,向后(向前)查找
  

  ====> 将字符串的首尾空白去掉

• indexOf(字符) lastIndexOf(字符)

  indexOf(字符)	: 都是用来获取字符串中对应字符的索引位置, 从左向右查找, 如果找到那么就直接返回对应的索引位置, 如果没有找到,那么就返回-1
  
  lastIndexOf(字符) : 都是用来获取字符串中对应字符的索引位置, 从后向前找, 如果找到那么就直接返回对应的索引位置, 如果没有找到,那么就返回-1
  
  备注:
  1. indexOf(字符) 和  lastIndexOf(字符)  支持第二参数的设置,如何设置了第二个参数,那么代表从指定的位置起,向后(向前)查找