Prototype Object对象 学习

  Object is used by Prototype as a namespace; that is, it just keeps a few new methods together, which are intended for namespaced access (i.e. starting with “Object.”).

  上面说的namespace个人理解就相当于C#中的静态类,提供工具函数的意思,和C#中的namespace应该不是一个概念。因为C#中的命名空间后面不会直接跟方法,肯定是接一个对象然后在调用方法,不过和C++中的命名空间倒是有些类似

  clone

  extend

  inspect

  isArray

  isElement

  isFunction

  isHash

  isNumber

  isString

  isUndefined

  keys

  toHTML

  toJSON

  toQueryString

  values

  

复制代码 代码如下:

  //通过匿名函数调用的方式创建Object对象

  (function() {

  //取得类型的字符串表达形式,(Prototype 学习——工具函数学习($方法))这篇日志里有详细的说明

  function getClass(object) {

  return Object.prototype.toString.call(object)

  .match(/^\[object\s(.*)\]$/)[1];

  }

  //继承方法,非常简单的类抄写机制,就是把source里面的所有属性和方法复制一份到destination中,如果是引用类型,则source和destination将指向同一个地址

  function extend(destination, source) {

  for (var property in source)

  destination[property] = source[property];

  return destination;

  }

  //返回object的字符串表达形式

  function inspect(object) {

  try {

  if (isUndefined(object)) return 'undefined';

  if (object === null) return 'null';

  return object.inspect ? object.inspect() : String(object);

  } catch (e) {

  if (e instanceof RangeError) return '...';

  throw e;

  }

  }

  //返回object的JSON(JavaScript Object Notation)

  function toJSON(object) {

  var type = typeof object;

  switch (type) {

  case 'undefined':

  case 'function':

  case 'unknown': return;

  case 'boolean': return object.toString();

  }

  if (object === null) return 'null';

  if (object.toJSON) return object.toJSON();

  if (isElement(object)) return;

  var results = [];

  for (var property in object) {

  var value = toJSON(object[property]);

  if (!isUndefined(value))

  results.push(property.toJSON() + ': ' + value);

  }

  return '{' + results.join(', ') + '}';

  }

  //返回查询字符串,例如:param1=value1¶m2=value2

  function toQueryString(object) {

  return $H(object).toQueryString();

  }

  //返回HTML字符串

  function toHTML(object) {

  return object && object.toHTML ? object.toHTML() : String.interpret(object);

  }

  //取得object的所有key

  function keys(object) {

  var results = [];

  for (var property in object)

  results.push(property);

  return results;

  }

  //取得object的所有value

  function values(object) {

  var results = [];

  for (var property in object)

  results.push(object[property]);

  return results;

  }

  //把object中的所有属性和方法拷贝到一个空对象中,并返回

  function clone(object) {

  return extend({ }, object);

  }

  //判断object是不是基本的DOM Element

  function isElement(object) {

  return !!(object && object.nodeType == 1);

  }

  //判断object是否为数组

  function isArray(object) {

  return getClass(object) === "Array";

  }

  //判断object是否为Prototype 的 Hash 对象

  function isHash(object) {

  return object instanceof Hash;

  }

  //判断object是否为函数

  function isFunction(object) {

  return typeof object === "function";

  }

  //判断object是否为字符串

  function isString(object) {

  return getClass(object) === "String";

  }

  //判断object是否为数字

  function isNumber(object) {

  return getClass(object) === "Number";

  }

  //判断object是否已经定义

  function isUndefined(object) {

  return typeof object === "undefined";

  }

  //返回Object对象

  extend(Object, {

  extend: extend,

  inspect: inspect,

  toJSON: toJSON,

  toQueryString: toQueryString,

  toHTML: toHTML,

  keys: keys,

  values: values,

  clone: clone,

  isElement: isElement,

  isArray: isArray,

  isHash: isHash,

  isFunction: isFunction,

  isString: isString,

  isNumber: isNumber,

  isUndefined: isUndefined

  });

  })();

  inspect方法:

  

复制代码 代码如下:

  Object.inspect() // -> 'undefined'

  Object.inspect(null) // -> 'null'

  Object.inspect(false) // -> 'false'

  Object.inspect([1, 2, 3]) // -> '[1, 2, 3]'

  Object.inspect('hello') // -> "'hello'"

  toJSON方法:

  注意这里面有一个递归调用的过程var value = toJSON(object[property]);最后返回一个JSON格式的字符串表示,下面看一下示例:

  

复制代码 代码如下:

  var data = {name: 'Violet', occupation: 'character', age: 25, pets: ['frog', 'rabbit']};

  /* '{"name": "Violet", "occupation": "character", "age": 25, "pets": ["frog","rabbit"]}' */

  //在eval返回的JSON字符串时要记住加上括号,否则报错,这里括号起到强制求值的作用。

  //要不然会把JSON字串当成复合语句,里面的("name":)当成Label,然后解析后面的内容就会出错了

  var obj=eval('('+Object.toJSON(data)+')');

  alert(obj.name);

  toQueryString方法:

  用object创建一个Hash对象,然后调用Hash对象的toQueryString方法,并返回调用结果,讲到Hash对象时在详细说toQueryString方法。

  一般这个方法在调用Ajax.Request时会经常用到,下面看一下示例:

  

复制代码 代码如下:

  Object.toQueryString({ action: 'ship', order_id: 123, fees: ['f1', 'f2'], 'label': 'a demo' })

  // -> 'action=ship&order_id=123&fees=f1&fees=f2&label=a%20demo'

  toHTML方法:

  如果传进去的object参数为undefined或者null将返回空字符串

  alert(Object.toHTML())

  alert(Object.toHTML(null))

  如果object定义了toHTML方法,则调用object的toHTML方法,否者调用String的静态方法interpret,其实就是判断一下object是否为null,为null则返回'',否则调用object的toString方法,并返回调用结果

  

复制代码 代码如下:

  Object.extend(String, {

  interpret: function(value) {

  return value == null ? '' : String(value);

  },

  specialChar: {

  '\b': '\\b',

  '\t': '\\t',

  '\n': '\\n',

  '\f': '\\f',

  '\r': '\\r',

  '\\': '\\\\'

  }

  });

  下面看一下示例:

  

复制代码 代码如下:

  var Bookmark = Class.create({

  initialize: function(name, url) {

  this.name = name;

  this.url = url;

  },

  toHTML: function() {

  return '<a href="#{url}" href="#{url}">#{name}</a>'.interpolate(this);

  }

  });

  var api = new Bookmark('Prototype API', 'http://prototypejs.org/api');

  Object.toHTML(api);

  //-> '<a href="http://prototypejs.org/api" href="http://prototypejs.org/api">Prototype API</a>'

  keys和values方法:

  看一下示例就明白了,就不多说了:

  

复制代码 代码如下:

  Object.keys()

  // -> []

  Object.keys({ name: 'Prototype', version: 1.5 }).sort()

  // -> ['name', 'version']

  Object.values()

  // -> []

  Object.values({ name: 'Prototype', version: 1.5 }).sort()

  // -> [1.5, 'Prototype']

  clone方法:

  '{}'就是空对象的直接量,相当于new Object()

  

复制代码 代码如下:

  var o = { name: 'Prototype', version: 1.5, authors: ['sam', 'contributors'] };

  var o2 = Object.clone(o);

  o2.version = '1.5 weird';

  o2.authors.pop();

  o.version // -> 1.5

  o2.version // -> '1.5 weird'

  o.authors // -> ['sam']

  // Ouch! Shallow copy!,注意这里!

  isXXX方法不说了吧。