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。

  • 不推荐在新项目中使用