> ## Documentation Index
> Fetch the complete documentation index at: https://docs.syntblaze.com/llms.txt
> Use this file to discover all available pages before exploring further.

# JavaScript Public Method

A public method in JavaScript is a function exposed as a property on an object or class instance, making it accessible and invocable from outside the object's internal lexical scope. By default, all methods defined within JavaScript classes, constructor functions, and object literals are public unless explicitly encapsulated using private field syntax (`#`) or closures.

## Class Syntax (ES6+)

In modern JavaScript classes, methods defined without the `#` prefix are implicitly public. They are attached to the class's `prototype` rather than the individual instance, optimizing memory allocation.

```javascript theme={"dark"}
class DataProcessor {
  constructor(data) {
    this.data = data;
  }

  // Public method (attached to DataProcessor.prototype)
  process() {
    return this.data.map(item => item * 2);
  }
}

const processor = new DataProcessor([1, 2, 3]);
processor.process(); // Accessible externally
```

## Constructor Functions and Prototypes (Pre-ES6)

Before the introduction of the `class` keyword, public methods were defined either by attaching them directly to the instance context (`this`) or by mutating the constructor's `prototype` object.

```javascript theme={"dark"}
function DataProcessor(data) {
  this.data = data;
  
  // Public method (attached directly to the instance)
  this.clear = function() {
    this.data = [];
  };
}

// Public method (attached to the prototype chain)
DataProcessor.prototype.process = function() {
  return this.data.map(item => item * 2);
};

const processor = new DataProcessor([1, 2, 3]);
processor.process(); // Resolved via prototype chain
processor.clear();   // Resolved directly on the instance
```

## Object Literals

Methods defined within object literals are inherently public properties of that specific object.

```javascript theme={"dark"}
const processor = {
  data: [1, 2, 3],
  
  // ES6 Method Shorthand
  process() {
    return this.data.map(item => item * 2);
  },
  
  // Standard property-function syntax
  clear: function() {
    this.data = [];
  }
};

processor.process();
```

## Technical Characteristics

* **Invocation and Context:** Public methods are invoked using property accessors (dot `.` or bracket `[]` notation). During invocation, the execution context (`this`) is dynamically bound to the object preceding the dot, unless the method is an arrow function (which retains its lexical `this`) or the context is explicitly overridden using `.bind()`, `.call()`, or `.apply()`.
* **Enumerability:**
  * Public methods defined via ES6 `class` syntax are **non-enumerable** by default. They will not appear in `for...in` loops or `Object.keys()`.
  * Public methods attached directly to `this` in a constructor or defined in an object literal are **enumerable** by default.
* **Mutability:** Unless the object or its prototype is explicitly frozen (`Object.freeze()`), public methods can be overwritten, deleted, or monkey-patched at runtime by external scripts.

<div
  style={{ 
display: "flex", 
justifyContent: "space-between", 
alignItems: "center", 
maxWidth: "754px", 
padding: "1rem 0",
marginBottom: "24px"
}}
>
  <span style={{ fontWeight: "bold", fontSize: "1.25rem", color: "var(--tw-prose-headings)", fontFamily: "Inter, ui-sans-serif, system-ui, sans-serif" }}>Tired of Poor JavaScript Skills? Fix That With Deep Grasping!</span>

  <a
    href="https://syntblaze.com"
    target="_blank"
    style={{ 
  marginLeft: "24px",
  textDecoration: "none", 
  backgroundColor: "#007AFF",
  color: "#ffffff", 
  padding: "6px 16px", 
  borderRadius: "16px",
  fontSize: "0.9rem",
  fontWeight: "600",
  textAlign: "center",
  transition: "background-color 0.2s ease"
}}
  >
    Learn More
  </a>
</div>

<div style={{ display: "flex", gap: "12px", flexWrap: "wrap" }}>
  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/skill-tracking.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=b9b0305c93bb501c9e767b5c76c88835" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/skill-tracking.png" />

  <img src="https://mintcdn.com/syntblazellc/23tyuOzaWS88qFlc/images/nuggets.png?fit=max&auto=format&n=23tyuOzaWS88qFlc&q=85&s=c86c80197299762989e9b882419b2109" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/nuggets.png" />

  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/bite-sized-exercises.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=a65f9a38c37ff28ab73ed783c53c60e3" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/bite-sized-exercises.png" />
</div>

<div style={{ display: "flex", gap: "12px", flexWrap: "wrap", marginTop: "12px" }}>
  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/mastery-chain.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=748a1763454713e679260fbb95f154a2" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/mastery-chain.png" />

  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/element-previews.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=242f61448ff5dd6deaaab2dccc13b507" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/element-previews.png" />

  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/element-explanations.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=cf0fc1c31f9cd0fc26716781be05fbc9" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/element-explanations.png" />
</div>
