Skip to content

对象 ​

特性 ​

封装性:隐藏细节,开放接口
继承性:继承另一个对象的成员
多态性:同一操作对不同对象,产生的结果不同

定义对象 ​

var obj = {}

plain
var obj = obj{
    name:"zhangsan",
    age:18,
}

JSON ​

plain
{
    "name":"zhangsan",
    "age":18
}

访问对象成员 ​

plain
var obj = {
    name:"zhangsan",
    age:18
}
console.log(obj.name)
var introduce = function(){
    console.log("my name")
}

遍历对象 ​

for ··· in

plain
var obj ={
    name:"zhangsan",
    age:18
}
for(var k in obj){
    console.log(k,obj[k])
}

对象是否存在 ​

plain
var obj= {
    name:"zhangsan",
    age:18
}
console.log('name' in obj)
console.log('sex' in obj)

深浅拷贝 ​

浅拷贝:复制后相同,改一个变两个,节省内存

plain
var obj ={
    name:"zhangsan",
    age:18
}
var obj2 = obj
obj2.name = "lisi"
console.log(obj === obj2)

深拷贝:复制后不同,改一个不影响另一个

plain
var obj ={
    name:"zhangsan",
    age:18
}
var obj2 = function(obj){
    for(i in obj){
        obj2[i] = obj[i]
    }
}
obj2.name = "lisi"
console.log(obj === obj2)

构造函数 ​

构造函数:创建相同特征的对象

plain
function factory(name,age){
    var o = {}
    o.name = name
    o.age = age
}
o1 = factory("lisi",24)
o2 = factory("wangwu",25)
console.log(o1)
console.log(o2)

类:

实例化:通过类创建对象的过程

内置构造函数:

{}.constructor

[native code]表示是原生代码

plain
var obj = new Object()
var str = new String("123")
console.log(obj.constructor)
console.log(str.constructor)

自定义构造函数 ​

  1. 帕斯卡命名法:首写字母大写
  2. 使用this指向实例化对象
plain
function Person(name,age){
    this.name = name;
    this.age = age;
    this.sayHello = function(){
        console.log("Hello,my name is "+ this.name)
    }
}
var p1 = new Person("zhangsan",18)
var p2 = new Person("lisi",20)
p1.sayHello()
console.log(p1)
p2.sayHello()
console.log(p2)

class关键字 ​

plain
class Person{
    constructor(name,age){
        this.name = name
        this.age = age
    }
    introduce(){
        console.log('我是' + this.name + ',今年'+this.age + '岁')
    }
}
var p = new Person("zhangsan",18)
p.introduce()
console.log(p)

私有成员 ​

私有成员:构造函数中用var定义的成员

plain
function Person(){
    var name = "zhangsan"
    this.getName = function(){
        return name
    }
}
var p = new Person()
console.log(p.name)
console.log(p.getName())

return 关键字 ​

return + 基本类型 = 数据
return +引用类型 = 对象

plain
//返回基本数据类型
function Person(){
    obj =this
    return 123
}
var obj,p= new Person()
console.log(obj === p)
//返回引用数据类型
function Person2(){
    obj2 = this
    return {}
}
var obj2,p2 = new Person2()
console.log(obj2 === p2)

this ​

  1. 指向构造函数内部对象
  2. 直接调用函数调用全局对象
  3. 对象的方法,指向对象
plain
function obj(){
    return this
}
var o ={
    name :"zhangsan",
    function:obj
}
console.log(obj() == window)
console.log(o.function() === o)

更改this指向 ​

apply()
call()

plain
function obj(){
    console.log(this.name)
}
obj.apply({name:'张三'})
obj.call({name:'李四'})

String对象 ​

方法解释
length字符串长度
charAt()从0开始获取字符位置
indexOf()获取字符首次出现位置
lastIndexOf()获取字符最后出现位置
substr()按位置截取字符串
substring()按长度截取字符串
toLowerCase()转小写
toUpperCase()转大写
trim()去除首尾空格
replace()替换字符串
split()分割字符串

Number对象 ​

方法解释
MAX_VALUE最大值
MIN_VALUE最小值
toFixed()保留小数位

date方法 ​

方法解释
getFullYear()获取年份
getMonth()获取月份
getDate()获取日期
getDay()获取星期
getHours()获取小时
getMinutes()获取分钟
getSeconds()获取秒
getTime()获取时间戳
setFullYear()设置年份
setMonth()设置月份
setDate()设置日期
setHours()设置小时
setMinutes()设置分钟
setSeconds()设置秒
setTime()设置时间戳

Math对象 ​

方法解释
random()随机数
PI圆周率
abs()绝对值
ceil()向上取整
floor()向下取整
round()四舍五入
max最大值
min最小值
pow(exp,base)指数
sqrt(num)开方

错误处理 ​

类型说明
Error普通错误
EvalErroreval()函数错误
RangeError超出范围错误
ReferenceError引用不存在的变量
SyntaxError解析过程语法错误
TypeError变量或参数不是预期类型
plain
try {
  // 可能抛出错误的代码
} catch (error) {
  // 错误发生时执行的代码
  console.error('发生了一个错误:', error.message);
}

finally

关闭文件流:在文件操作完成后,确保文件流被关闭。
释放数据库连接:在数据库操作完成后,释放连接资源。
清理内存:在处理完需要大量内存的数据后,清理不再需要的内存。
注销事件监听器:在组件卸载时,注销所有注册的事件监听器。

JSON ​

JSON.stringify() 方法

JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串。

原型和继承 ​

特性 ​

封装性:隐藏细节,开放接口
继承性:继承另一个对象的成员
多态性:同一操作对不同对象,产生的结果不同

定义对象 ​

var obj = {}

plain
var obj = obj{
    name:"zhangsan",
    age:18,
}

JSON ​

plain
{
    "name":"zhangsan",
    "age":18
}

访问对象成员 ​

plain
var obj = {
    name:"zhangsan",
    age:18
}
console.log(obj.name)
var introduce = function(){
    console.log("my name")
}

遍历对象 ​

for ··· in

plain
var obj ={
    name:"zhangsan",
    age:18
}
for(var k in obj){
    console.log(k,obj[k])
}

对象是否存在 ​

plain
var obj= {
    name:"zhangsan",
    age:18
}
console.log('name' in obj)
console.log('sex' in obj)

深浅拷贝 ​

浅拷贝:复制后相同,改一个变两个,节省内存

plain
var obj ={
    name:"zhangsan",
    age:18
}
var obj2 = obj
obj2.name = "lisi"
console.log(obj === obj2)

深拷贝:复制后不同,改一个不影响另一个

plain
var obj ={
    name:"zhangsan",
    age:18
}
var obj2 = function(obj){
    for(i in obj){
        obj2[i] = obj[i]
    }
}
obj2.name = "lisi"
console.log(obj === obj2)

构造函数 ​

构造函数:创建相同特征的对象

plain
function factory(name,age){
    var o = {}
    o.name = name
    o.age = age
}
o1 = factory("lisi",24)
o2 = factory("wangwu",25)
console.log(o1)
console.log(o2)

类:

实例化:通过类创建对象的过程

内置构造函数:

{}.constructor

[native code]表示是原生代码

plain
var obj = new Object()
var str = new String("123")
console.log(obj.constructor)
console.log(str.constructor)

自定义构造函数 ​

  1. 帕斯卡命名法:首写字母大写
  2. 使用this指向实例化对象
plain
function Person(name,age){
    this.name = name;
    this.age = age;
    this.sayHello = function(){
        console.log("Hello,my name is "+ this.name)
    }
}
var p1 = new Person("zhangsan",18)
var p2 = new Person("lisi",20)
p1.sayHello()
console.log(p1)
p2.sayHello()
console.log(p2)

class关键字 ​

plain
class Person{
    constructor(name,age){
        this.name = name
        this.age = age
    }
    introduce(){
        console.log('我是' + this.name + ',今年'+this.age + '岁')
    }
}
var p = new Person("zhangsan",18)
p.introduce()
console.log(p)

私有成员 ​

私有成员:构造函数中用var定义的成员

plain
function Person(){
    var name = "zhangsan"
    this.getName = function(){
        return name
    }
}
var p = new Person()
console.log(p.name)
console.log(p.getName())

return 关键字 ​

return + 基本类型 = 数据
return +引用类型 = 对象

plain
//返回基本数据类型
function Person(){
    obj =this
    return 123
}
var obj,p= new Person()
console.log(obj === p)
//返回引用数据类型
function Person2(){
    obj2 = this
    return {}
}
var obj2,p2 = new Person2()
console.log(obj2 === p2)

this ​

  1. 指向构造函数内部对象
  2. 直接调用函数调用全局对象
  3. 对象的方法,指向对象
plain
function obj(){
    return this
}
var o ={
    name :"zhangsan",
    function:obj
}
console.log(obj() == window)
console.log(o.function() === o)

更改this指向 ​

apply()
call()

plain
function obj(){
    console.log(this.name)
}
obj.apply({name:'张三'})
obj.call({name:'李四'})

String对象 ​

方法解释
length字符串长度
charAt()从0开始获取字符位置
indexOf()获取字符首次出现位置
lastIndexOf()获取字符最后出现位置
substr()按位置截取字符串
substring()按长度截取字符串
toLowerCase()转小写
toUpperCase()转大写
trim()去除首尾空格
replace()替换字符串
split()分割字符串

Number对象 ​

方法解释
MAX_VALUE最大值
MIN_VALUE最小值
toFixed()保留小数位

date方法 ​

方法解释
getFullYear()获取年份
getMonth()获取月份
getDate()获取日期
getDay()获取星期
getHours()获取小时
getMinutes()获取分钟
getSeconds()获取秒
getTime()获取时间戳
setFullYear()设置年份
setMonth()设置月份
setDate()设置日期
setHours()设置小时
setMinutes()设置分钟
setSeconds()设置秒
setTime()设置时间戳

Math对象 ​

方法解释
random()随机数
PI圆周率
abs()绝对值
ceil()向上取整
floor()向下取整
round()四舍五入
max最大值
min最小值
pow(exp,base)指数
sqrt(num)开方

错误处理 ​

报错信息 ​

语法错误 ​

运行错误 ​

常用语句 ​

语句功能
alert()弹出对话框
console.log()打印到控制台
prompt()弹出对话框,返回用户输入的值
confirm()弹出对话框,返回用户点击的按钮
setInterval()定时器
setTimeout()定时器
document.write()向页面写入内容
类型说明
Error普通错误
EvalErroreval()函数错误
RangeError超出范围错误
ReferenceError引用不存在的变量
SyntaxError解析过程语法错误
TypeError变量或参数不是预期类型
plain
try {
  // 可能抛出错误的代码
} catch (error) {
  // 错误发生时执行的代码
  console.error('发生了一个错误:', error.message);
}

finally

关闭文件流:在文件操作完成后,确保文件流被关闭。
释放数据库连接:在数据库操作完成后,释放连接资源。
清理内存:在处理完需要大量内存的数据后,清理不再需要的内存。
注销事件监听器:在组件卸载时,注销所有注册的事件监听器。

JSON ​

JSON.stringify() 方法

JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串。

深入理解原型链 ​

允许对象间共享属性和方法

减少了代码的冗余

提高代码复用率和灵活性

基本概念 ​

原型:每个函数都有一个prototype属性,就是原型

原型链

构造函数

原型对象:prototype属性指向的对象,就是原型对象

实例

什么是原型 ​

运作机制 ​

构造函数、原型与实例之间的关系 ​

总结 ​

  • 可以通过原型链实现继

参考资料 ​

方法 ​

stringify( ) ​

  • 对象 -> 字符串
javascript
let book = {
    title: "高级程序设计",
    authors: "张三",
    edition: 4,
    year: 2025
}

let jsonText = JSON.stringify(book)
console.log(jsonText)

// {"title":"高级程序设计","authors":"张三","edition":4,"year":2025}

parse( ) ​

  • 字符串 -> 对象
javascript
let jsonText = `{
  "title": "高级程序设计",
  "authors": "张三",
  "edition": 4,
  "year": 2025
}`;

let bookCopy = JSON.parse(jsonText)

字符串转换 ​

JSON.stringify() ​

plain
const obj = { name: "Alice", age: 25 };
const jsonString = JSON.stringify(obj);
console.log(jsonString); // {"name":"Alice","age":25}

const jsonString = '{"name":"Alice","age":25}';
const obj = JSON.parse(jsonString);
console.log(obj.name); // "Alice"

const jsonString = '{"name":"Alice","age":25}';
const obj = eval('(' + jsonString + ')'); // 必须用括号包裹
console.log(obj.name); // "Alice"

const jsonString = '{"name":"Alice","age":25}';
const obj = $.parseJSON(jsonString); // 效果同 JSON.parse

function stringify(obj) {
  return `{${Object.entries(obj).map(([k, v]) => `"${k}":"${v}"`).join(',')}}`;
}
const obj = { name: "Alice", age: 25 };
console.log(stringify(obj)); // {"name":"Alice","age":"25"}(注意值强制转字符串)

function parse(str) {
  return str.slice(1, -1).split(',').reduce((acc, pair) => {
    const [k, v] = pair.split(':');
    acc[k.replace(/"/g, '')] = v.replace(/"/g, '');
    return acc;
  }, {});
}
const jsonString = '{"name":"Alice","age":"25"}';
console.log(parse(jsonString)); // {name: "Alice", age: "25"}

const jsonString = '{"name":"Alice","age":25}';
const parseJson = (str) => new Function('return ' + str)();
const obj = parseJson(jsonString);
console.log(obj.name); // "Alice"

特点 ​

  • 安全性:避免使用 eval() 的安全风险。

  • 兼容性:所有现代浏览器和 Node.js 均支持。

  • 参数扩展:

    • JSON.stringify(value, replacer?, space?)
      • replacer:过滤或转换属性(函数或数组)。
      • space:缩进美化(数字或字符串)。
    • JSON.parse(text, reviver?)
      • reviver:解析时的值转换函数。
  • 若字符串包含恶意代码(如 "alert('hack')"),会被直接执行。

  • 禁止用于解析外部或不可信的 JSON 数据。

  • 与 JSON.parse() 功能一致,但依赖 jQuery。

  • 不推荐在新项目中使用。