JavaScript基础(函数及面向对象)

news/2025/2/26 15:32:47

函数

定义函数

Java定义方法:

public 返回值类型 方法名(){

        return 返回值

}

定义函数方法一

eg:定义一个绝对值函数

javascript">function abs(x) {
            if (x>=0){
                return x;
            }else {
                return -x;
            }
        }

调用函数:

注意:一旦执行到return代表函数结束,返回结果。

如果没有执行return,函数执行完也会返回结果,结果为undefined

定义函数方法二

javascript">var abs1=function (x) {
            if (x>=0){
                return x;
            }else {
                return -x;
            }
        }

调用函数:

function(x){.....}这是一个匿名函数,但是可以把结果赋值给abs,通过abs就可以调用函数

方式一和方式二等价

参数问题

JavaScript可以传递任意个参数,也可以不传递参数

1.当调用函数时不传递参数依然会返回结果:

手动添加异常处理:

不传递参数与传递参数对比:

2.arguments

是JS免费赠送的关键字,代表传递进来的所有参数是一个数组

默认情况下,当函数传递多个参数时,会返回第一个参数结果:

利用arguments可以拿到所有参数

存在问题:arguments包含所有的参数,我们需要使用多余的参数时,需要排除已有的参数

rest函数

获取处理已经定义的参数之外的所有参数

使用argument获取多余数字:

javascript">function aaa(a,b) {
            console.log("a=>"+a);
            console.log("b=>"+b);
            for (var i=2;i<arguments.length;i++){
                console.log("多余"+arguments[i]);
            }
        }

使用rest获取多余数字:

rest参数只能写在最后面,必须用...表示

变量的作用域

在JavaScript中,var定义变量实际是有作用域的,在函数体内声明的变量,在函数体位不可以使用。(若想使用,闭包可以实现该功能)

javascript">function s() {
            var x;
            x=x+1;
        }
        x=x+1;

如果两个函数使用了相同的变量名,只要在函数内部,就不会产生冲突。如下:

javascript">function s() {
            var x;
            x=x+1;
        }
      //两个函数的x互不影响
        function z() {
            var x=3;
            x=x+1;
        }

内部函数可以访问外部函数的成员,反之不行,如下:

javascript">function a() {
            var x=1;
            function b() {
                var y=x+1;  //2
            }
            var z=y+1;  // y is not defined
        }

内部函数变量和外部函数的变量重名。如下

在JavaScript中,函数查找变量从自身函数开始。查找是由内向外。假设外部存在同名函数变量,内部函数会屏蔽外部函数变量。

javascript">function c() {
            var x=1;
            function d() {
                var x='A';
                console.log('outer:'+x);//inner:1
            }
            console.log('inner:'+x);//outer:A
            d();//调用d函数
        }
        c();//调用c函数

提升变量的作用域,js执行引擎,自动提升了y的声明,但是不会提升变量y的赋值,如下:

javascript">function e() {
            var x="x"+y;
            console.log(x);
            var y='y';
        }
        e();    //xundefined

注意:所有的变量定义都放在函数的头部,便于代码维护。

全局函数

javascript">var x=1;//全局变量
        function f() {
            console.log(x);//1
        }
        f();
        console.log(x);//1

全局对象window

javascript"> //全局对象window
        var x='xxx';
        alert(x);
        alert(window.x);

默认所有的全局变量,都会自动绑定在window对象下。

alert()这个函数本身也是一个window变量。

javascript">var x='xxx';
        /*alert(x);
        alert(window.x);*/
        window.alert(x);
        var old_alert=window.alert;
        window.alert=function () {
        };
        window.alert(123);//次弹窗不会弹出,失效
        //恢复弹窗
        window.alert=old_alert;
        window.alert(456)//恢复弹窗456

JavaScript实际上只有一个全局作用域,任何变量(函数也视为变量),假设没有在函数作用范围内找到,就会向外查找,如果在全局作用域都没有找到,报错RefrenceError

规范

由于使用的全局变量都会绑定到window上,如果不同的js文件所有了相同的全局变量,会产生冲突,如何减少冲突。如下:

javascript"> //唯一一个全局变量
        var zhangsanApp={};
        //定义全局变量
        zhangsanApp.name='zhangsan';
        zhangsanApp.abs=function (a,b) {
            return a+b;
        }

把自己的代码全部放入自己定义的唯一空间名字中,降低全局命名冲突的问题

局部作用域        let

为了解决以上局部作用域冲突问题,产生关键字let

建议使用let去定义局部作用域的变量

常量const

常量用大写字母定义

javascript"> const PI='3.15';
        console.log(PI);
        PI='123';
        console.log(PI)//Assignment to constant variable.

方法

定义方法

方法就是函数放在对象内部,对象只有属性和方法

javascript">var serenity={
            name:'张三',
            bitrh:2001,
            age: function () {
                //今年减去出生年
                var now=new Date().getFullYear();//获取当前日期
                return now-this.bitrh;
            }
        }

调用属性:对象.属性

serenity.name;

调用方法:对象.方法名()

serenity.age()

this关键字是无法指向的,默认指向调用它的对象,如下:

javascript">//定义方法二
        function getAge() {
            //今年减去出生年
            var now=new Date().getFullYear();//获取当前日期
            return now-this.bitrh;
        }
        var serenity={
            name:'张三',
            bitrh:2001,
            age: getAge
        }

1.通过对象调用函数

serenity.age()        //2001-当前时间

2.直接调用函数

getAge()        //NaN,无法得到数据

3.apply方法在JS中可以控制this的指向

getAge().apply(serenity,[]);        //函数名.apply(指向对象,参数)

内部对象

标准对象:如下

获取数据类型 typeof 数据

typeof 123
'number'
typeof '123'
'string'
typeof true
'boolean'
typeof undefined
'undefined'

typeof NaN
'number'
typeof []
'object'
typeof {}
'object'
typeof Math.abs
'function'

Date对象

var now=new Date();//获取当前时间

//Tue Feb 25 2025 12:26:38 GMT+0800 (中国标准时间)

Date对象的常用方法: 

javascript">var now=new Date();//获取当前时间Tue Feb 25 2025 12:26:38 GMT+0800 (中国标准时间)
    now.getFullYear();//年
    now.getMonth();//月
    now.getDate();//日
    now.getDay();//星期几
    now.getHours();//时
    now.getMinutes();//分
    now.getSeconds();//秒
    now.getTime();//时间戳  统一:从1970年1月1日0:00:00到目前的毫秒数
    //根据时间戳转换为当前时间
    console.log(new Date(1740457598294));//Tue Feb 25 2025 12:26:38 GMT+0800 (中国标准时间)

常用转换:时间戳转化为北京时间

now=new Date(1740457598294);
console.log(now.toLocaleString());//    2025/2/25 12:26:38

JSON

早期所有数据传输用XML文件

JSON(JavaScript Object Notation,JavaScript对象表示法)是基于ECMAScript的一个子集设计的,是一种开放标准的文件格式和数据交换格式。其简洁和清晰的层次结构有效地提升了网络传输效率,使其成为理想的数据交换语言。

在JavaScript中一切皆为对象,如何JS支持的类型都可以用JSON来表示。

格式:

  • 对象用{}
  • 数组用[]
  • 所有的键值对用:key:value

 JSON字符串和JS对象的转化

javascript">//定义一个JS对象 
var user={
            name:"serenity",
            age:3,
            Phone:123456789
        }
        //对象转换为JSON字符串
          //{"name":"serenity","age":3,"Phone":123456789}
       var jsonUser= JSON.stringify(user)
        //json字符串转化为对象  参数为json字符串
        //{name: 'serenity', age: 3, Phone: 123456789}
        var json=JSON.parse('{"name":"serenity","age":3,"Phone":123456789}')

JSON.stringify(对象名)       //对象转化为JSON字符串

JSON.parse("JSON字符串"  //JSON字符串转化为JS对象

JSON和JS的区别:

var obj={a:'hello',b:'hellob'};

var json='{"a":"hello","b":"hellob"}'

面向对象

了解

JavaScript、Java、c#等都是面向对象

  • 类:模板
  • 对象:具体的实例

在JavaScript中,原型对象

原型链_proto_

class

class关键字在ES6引入,

定义一个类

//定义一个Student类
class Student{
    //构造器
    constructor(name) {
        this.name=name;
    }
    //hello方法
    hello(){
       console.log("hello");
    }
};
var xiaomin=new Student("xiaomin");        //创建对象
var xiaohong=new Student("xiaohong");        //创建对象

调用:

xiaomin.hello()

xiaohong.hello()

继承extends

在继承中,子类需要使用父类的方法或属性时,需要使用super关键字。在调用对象时,都是先调用父类的构造器,在调用子类的构造器,显式的调用父类构造器时,super()必须写在子类中的第一行。


http://www.niftyadmin.cn/n/5868889.html

相关文章

计算机毕设-基于springboot的人工智能领域复合型人才校企协同培养管理系统的设计与实现(附源码+lw+ppt+开题报告)

博主介绍&#xff1a;✌多个项目实战经验、多个大型网购商城开发经验、在某机构指导学员上千名、专注于本行业领域✌ 技术范围&#xff1a;Java实战项目、Python实战项目、微信小程序/安卓实战项目、爬虫大数据实战项目、Nodejs实战项目、PHP实战项目、.NET实战项目、Golang实战…

Nginx系列-Nginx高可用(主从、主主模式)

文章目录 Nginx系列-Nginx高可用(主从、主主模式)1. 引言2. 高可用架构设计3. 基础环境准备4. Nginx安装5. keepalived安装4. 配置主备模式5. 配置主主(双主)模式6. 注意事项 Nginx系列-Nginx高可用(主从、主主模式) 1. 引言 在单机部署的Nginx环境中&#xff0c;一旦Nginx服务…

Java中的Stream API:从入门到实战

引言 在现代Java开发中&#xff0c;Stream API 是处理集合数据的强大工具。它不仅让代码更加简洁易读&#xff0c;还能通过并行处理提升性能。本文将带你从基础概念入手&#xff0c;逐步深入Stream API的使用&#xff0c;并通过实战案例展示其强大功能。 1. 什么是Stream API…

ROS的action通信——实现阶乘运算(一)

在ROS中除了常见的话题(topic&#xff09;通信、服务(server)通信等方式&#xff0c;还有action通信这一方式&#xff0c;由于可以实时反馈任务完成情况&#xff0c;该通信方式被广泛运用于机器人导航等任务中。本文将通过三个小节的分享&#xff0c;实现基于action通信的阶乘运…

PXE 安装ubuntu22.04自动判断UEFI或者Legacy引导

UEFI引导安装&#xff1a;https://blog.csdn.net/qq_50247813/article/details/145777563 Legacy引导安装&#xff1a;https://blog.csdn.net/qq_50247813/article/details/145730754 本篇根据上两篇快速部署pxe服务器&#xff0c;并自动判断uefi或者legacy引导 一、服务器必要…

C/C++后端开发面试表述、技术点摸底——基础组件篇

前端时间笔者系统学习了基础组件中的池式结构&#xff08;包括线程池、内存池、连接池&#xff09;&#xff0c;原子操作&#xff0c;锁&#xff0c;无锁队列&#xff0c;网络缓冲区&#xff0c;定时器设计&#xff0c;分布式锁&#xff0c;有些内容笔者已经总结整理成了相关技…

linux centos8 安装redis 卸载redis

准备环境 系统&#xff1a;linux CentOS8 安装步骤 一、下载redis 1.进入官网找到下载地址 https://redis.io/download 2.右键点击复制链接地址 3.进入到Xshell控制台(默认当前是root根目录)&#xff0c;&#xff0c;输入wget 加你复制的地址 &#xff08;示例 &#xff…

爱普生汽车用显示控制器IC:ScalerIC,汽车接口IC,相机接口IC

爱普生汽车显示控制器IC&#xff0c;汽车显示控制器芯片可以分为三类&#xff1a;爱普生显示控制芯片Scaler IC &#xff0c;爱普生汽车接口IC&#xff0c;爱普生相机接口IC。下面就给大家分别介绍下这三类芯片的具体型号的特征及用途。 爱普生显示控制芯片 Scaler IC Scaler…