[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Working_with_objects [Back]  [Original]

- JavaScript | MDN

MDN Web Docs

View in English Always switch to English

JavaScript ()

JavaScript () JavaScript JavaScript

new

C++

js
const obj = {
  property1: value1, // property_# 
  2: value2, // 
  "property n": value3, // 
};

valueN

obj

cond true x

js
let x;
if (cond) {
  x = { greeting: "hi there" };
}

3 myHonda engine

js
const myHonda = {
  color: "red",
  wheels: 4,
  engine: { cylinders: 4, size: 2.2 },
};

Object

2

  1. 1
  2. new

Car makemodelyear

js
function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}

this

myCar

js
const myCar = new Car("Eagle", "Talon TSi", 1993);

myCar myCar.make "Eagle" myCar.model "Talon TSi"myCar.year 1993

Car new

js
const randCar = new Car("Nissan", "300ZX", 1992);
const kenCar = new Car("Mazda", "Miata", 1990);

Person

js
function Person(name, age, sex) {
  this.name = name;
  this.age = age;
  this.sex = sex;
}

2 Person

js
const rand = new Person("Rand McKinnon", 33, "M");
const ken = new Person("Ken Jones", 39, "M");

Car Person owner

js
function Car(make, model, year, owner) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.owner = owner;
}

js
const car1 = new Car("Eagle", "Talon TSi", 1993, rand);
const car2 = new Car("Nissan", "300ZX", 1992, ken);

rand ken owner car2 owner

js
car2.owner.name;

js
car1.color = "black";

car1 color "black" Car

class

Object.create()

Object.create()

js
// Animal 
const animalProto = {
  type: "Invertebrates", // 
  displayType() {
    // Animal 
    console.log(this.type);
  },
};

// animal  animal 
const animal = Object.create(animalProto);
animal.displayType(); //  : Invertebrates

// Fishes  animal 
const fish = Object.create(animalProto);
fish.type = "Fishes";
fish.displayType(); //  : Fishes

JavaScript

myCar makemodelyear "Ford""Mustang"1969

js
const myCar = {
  make: "Ford",
  model: "Mustang",
  year: 1969,
};

JavaScript

2 myCar

js
// 
myCar.make = "Ford";
myCar.model = "Mustang";
myCar.year = 1969;

// 
myCar["make"] = "Ford";
myCar["model"] = "Mustang";
myCar["year"] = 1969;

JavaScript JavaScript

js
const myObj = {};
const str = "myString";
const rand = Math.random();
const anotherObj = {};

// Create additional properties on myObj
myObj.type = "type ";
myObj["date created"] = "";
myObj[str] = " str ";
myObj[rand] = "";
myObj[anotherObj] = " anotherObj ";
myObj[""] = "";

console.log(myObj);
// {
//   type: 'type ',
//   'date created': '',
//   myString: ' str ',
//   '0.6398914448618778': '',
//   '[object Object]': ' anotherObj ',
//   '': ''
// }
console.log(myObj.myString); // ' str '

anotherObj myObj JavaScript toString() anotherObj

str "myString" "myString" myObj.str undefined

js
str = "myString";
myObj[str] = " str ";

console.log(myObj.str); // undefined

console.log(myObj[str]); // ' str '
console.log(myObj.myString); // ' str '

js
let propertyName = "make";
myCar[propertyName] = "Ford";

// 
propertyName = "model";
myCar[propertyName] = "Mustang";

console.log(myCar); // { make: 'Ford', model: 'Mustang' }

undefined null

js
myCar.nonexistentProperty; // undefined

/ 3

for...in

js
function showProps(obj, objName) {
  let result = "";
  for (const i in obj) {
    // Object.hasOwn() 
    if (Object.hasOwn(obj, i)) {
      result += `${objName}.${i} = ${obj[i]}\n`;
    }
  }
  console.log(result);
}

showProps(myCar, 'myCar')

myCar.make = Ford
myCar.model = Mustang
myCar.year = 1969

js
function showProps(obj, objName) {
  let result = "";
  Object.keys(obj).forEach((i) => {
    result += `${objName}.${i} = ${obj[i]}\n`;
  });
  console.log(result);
}

js
function listAllProperties(myObj) {
  let objectToInspect = myObj;
  let result = [];

  while (objectToInspect !== null) {
    result = result.concat(Object.getOwnPropertyNames(objectToInspect));
    objectToInspect = Object.getPrototypeOf(objectToInspect);
  }

  return result;
}

delete

js
// 2  a  b  myobj 
const myObj = { a: 5, b: 12 };

//  a myobj  b 
delete myObj.a;
console.log("a" in myObj); // false

JavaScript 1 prototype

prototype 1 color Car car1

js
Car.prototype.color = "red";
console.log(car1.color); // "red"

js
objectName.methodName = functionName;

const myObj = {
  myMethod: function (params) {
    // ...
  },

  // 
  myOtherMethod(params) {
    // ...
  },
};

objectName methodName functionName

js
objectName.methodName(params);

prototype Car

js
Car.prototype.displayCar = function () {
  const result = ` ${this.year}  ${this.make} ${this.model}`;
  console.log(result);
};

this displayCar

js
car1.displayCar();
car2.displayCar();

this

JavaScript this manager intern 2 name, age, job sayHi() this.name 2

js
const manager = {
  name: "Karina",
  age: 27,
  job: "Software Engineer",
};
const intern = {
  name: "Tyrone",
  age: 21,
  job: "Software Engineer Intern",
};

function sayHi() {
  console.log(`Hello, my name is ${this.name}`);
}

//  sayHi 
manager.sayHi = sayHi;
intern.sayHi = sayHi;

manager.sayHi(); // Hello, my name is Karina
intern.sayHi(); // Hello, my name is Tyrone

this manager.sayHi() this manager manager sayHi() this Function.prototype.call() Reflect.apply() this

get set 1

js
const myObj = {
  a: 7,
  get b() {
    return this.a + 1;
  },
  set c(x) {
    this.a = x / 2;
  },
};

console.log(myObj.a); // 7
console.log(myObj.b); // 8 get b() 
myObj.c = 50; // set c(x) 
console.log(myObj.a); // 25

myObj

  • myObj.a
  • myObj.b myObj.a + 1
  • myObj.c myObj.c 1/2 myObj.a

Object.defineProperties() 1 2

js
const myObj = { a: 0 };

Object.defineProperties(myObj, {
  b: {
    get() {
      return this.a + 1;
    },
  },
  c: {
    set(x) {
      this.a = x / 2;
    },
  },
});

myObj.c = 10; // 'a'  10 / 2 (5) 
console.log(myObj.b); // a + 1  6 

2 2 2 JavaScript

JavaScript 2

js
// 2  2 
const fruit = { name: "apple" };
const anotherFruit = { name: "apple" };

fruit == anotherFruit; // false 
fruit === anotherFruit; // false 
js
// 2  1 
const fruit = { name: "apple" };
const anotherFruit = fruit; // anotherFruit  fruit 

// fruit  anotherFruit 
fruit == anotherFruit; // true 
fruit === anotherFruit; // true 

fruit.name = "grape";
console.log(anotherFruit); // { name: "apple" }  { name: "grape" } 


Web Proxy Viewer  |  New URL  |  Original Page