• 技术文章 >web前端 >js教程

    JavaScript对象的基本用法

    长期闲置长期闲置2022-08-04 09:49:07转载71
    本篇文章给大家带来了关于javascript的相关知识,其中主要介绍了关于JavaScript对象的相关问题,对象是一组无序的相关属性和方法的集合,所有事物都是对象,例如字符串,数值,数组,函数等,下面一起来看一下,希望对大家有帮助。

    【相关推荐:javascript视频教程web前端

    一、 声明对象的两种语法

    什么是对象?

    在JavaScript中,对象是一组无序的相关属性和方法的集合,所有事物都是对象,例如字符串,数值,数组,函数等

    对象是由属性和方法组成的:

    let obj = {'name': 'frank','age' : 18}  // 简单写法 let obj = new Object({'name': 'frank'}) // 正规写法

    注意:

    • 键名(key)是字符串,不是标识符,可以包含任意字符
    • 引号可以省略,但是当键名里面存在汉字,空格,符号等特殊字符时候不可以省略,省略之后就只能写标识符。
    • 就算引号省略了,键名也还是字符串

    二、删除对象的属性

    1.delete obj.xxx或delete obj[‘xxx’]

    即可删除obj的xxx属性。只能删属性不能用来删对象。

    注意:区分「属性值为undefined」和「不含属性名」

    delete obj.xxx 或 delete obj['xxx'] 可以对属性名进行删除。

    在这里插入图片描述

    用 ‘xxx’ in obj 来检查是否属性名删除成功

    2.不含属性名

    'xxx' in obj===false

    3.含属性名,但是值为undefined

    'xxx' in obj && obj.xxx===undefined

    注意:obj.xxx === undefined,不能断定’xxx’是否为obj的属性

    在这里插入图片描述

    obj.name = undefined 只是把属性值变为空,但是属性名还存在。

    在这里插入图片描述

    三、查看对象的属性

    1. 查看自身所有属性

    Object.keys(obj)

    在这里插入图片描述
    2. 查看自身+共有属性

    console.dir(obj)

    在这里插入图片描述

    或者自己依次用Object.keys 打印出 obj.__proto__ (不推荐)

    在这里插入图片描述
    3. 判断一个属性是自身的还是共有的

    obj.hasOwnProperty('toString') // false 不是自身的 // ture 是自身的。

    在这里插入图片描述
    4. 查看单一属性值

    有两种方法:

     obj.name <==> obj['name']
     obj.name 不等价于 obj[name]
    let name ='frank'
    obj[name]等价于obj['frank']
    而不是obj.name 或 obj['name']
    除非let key = 'name';
    此时obj[key] = 'frank'

    四、修改或增加对象的属性

    1. 直接赋值 用中括号语法或者点语法="xxx"赋值
    let obj={name:'frank'} //name是字符串
    obj.name='frank'       //对字符串name进行修改
    obj['name']='frank'
    ~~obj[name]='frank'~~   因为name值不确定 可能不等于字符串name
    obj['na'+'me']='frank' //运算的形式赋值
    let key='name'; obj[key]='frank' // 通过引入变量来赋值
    let key='name';~~obj.key='frank'~~ obj.key等价于obj['key']

    在这里插入图片描述

    2. 批量赋值

    Object.assign(obj,{age:18,gender:'name',...}) (赋值给谁,{什么东西})

    在这里插入图片描述
    3.修改或增加共有属性

    (读的时候走原型,写的时候只走自身属性,如果你要运行的话只运行自身的属性)

    let obj = {},obj2 = {};obj.toString='xxx'//只会修改自身属性obj2.toString//还是在原型上
       obj.__proto__.toString='xxx'  //不推荐
       window.Object.prototype.toString='xxx' //与上式子相同
    let obj=Object.create(common)obj.name='frank'obj.age='jack' //简单用法

    规范大概的意思是,要改就一开始改,别后来再改,影响性能。

    var common={'国籍':'中国',hairColor:'black'}
    var person=Object.create(common,{name:{value:'frank'}})
    cosole.log(person)  // 正规 但是复杂用法

    提问:

    ‘name’ in obj和obj.hasOwnProperty(‘name’) 的区别?

    'name' in obj 是查看name属性是否在 obj 对象里面。这里是包含了 自身属性和共有属性。

    obj.hasOwnProperty('name') 是查看这个name属性属于自身属性还是共有属性

    // false 不是自身属性 //ture 是自身属性

    变量,属性,函数,方法的区别?

    相同点:变量和属性都是用来存储数据的

    不同点:

    变量:单独声明并赋值,使用的时候直接写变量名 单独存在

    属性:在对象里面不需要声明,使用的时候必须是 对象.属性

    相同点:函数和方法都是实现某种功能的

    不同点:

    函数:是单独声明的并且调用的 函数名() 单独存在

    方法:在对象里面 调用的时候 对象.方法()

    【相关推荐:javascript视频教程web前端

    以上就是JavaScript对象的基本用法的详细内容,更多请关注php中文网其它相关文章!

    声明:本文转载于:CSDN,如有侵犯,请联系admin@php.cn删除
    专题推荐:javascript
    上一篇:详解JavaScript函数返回值和return语句 下一篇:深入解析JavaScript中的回调函数(同步和异步)
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【活动】充值PHP中文网VIP即送云服务器• 简单了解JavaScript的起源与发展• JavaScript入门详解之三种引入方式• 实例代码详细介绍JavaScript中的输出数据多种方式• javascript变量的声明与命名规范总结• 一起聊聊JavaScript运算符
    1/1

    PHP中文网